HTML oznake za tekst: poravnanje, veličina, font

Čini se, zašto znaju HTML oznake za tekst, ako sada gotovo svaki administrator ima zgodan vizualni urednik, što ih postavlja automatski?

Činjenica je da oblikovanje sadržaja na web stranici u osnovi se razlikuje od radnih u uredskim aplikacijama. Nije dovoljno samo da tekst izgleda privlačno, jer točan izgled ne ovisi samo o prikazu web stranice, već io njegovoj promociji u tražilicama.

HTML oznake i atributi: osnove sintakse

Svaki tekst ima skriveni kod koji "objašnjava" računalu što i kako treba biti prikazano na zaslonu. Sve se informacije bilježe pomoću niza univerzalnih elemenata.

Zapravo, HTML oznake za tekst su naredbe koje dodaju određene blokove na stranicu ili mijenjaju izgled. Točan format za unos je:

Imajte na umu da nisu sve oznake uparene. Na primjer,
(preskakanje linije) ili (dodavanje vodoravne crte) ne treba zatvoriti.

Zašto ne možete kopirati članke iz programa Word i drugih programa uredniku web mjesta

Iako moderni uredski programi koriste iste HTML oznake za tekst, u 99% slučajeva izvorni kod nije prikladan za web stranice. Čak i ako je dokument normalno prikazan u samoj aplikaciji, formatiranje možda neće uspjeti ako se umetne na web mjesto. Osim toga, zbog velikog broja nepotrebnih oznaka i atributa, tražilice ne mogu adekvatno analizirati sadržaj stranice. To, pak, otežava promoviranje resursa.

Da biste dobili čist i relevantan kôd, prvo morate očistiti tekst iz HTML oznaka koje je izradio redovni urednik. Postoji nekoliko načina za to:

1. "Pokreni" članak kroz "Notepad" i tek nakon toga tijesto na web mjestu. Aplikacija briše sve HTML, pa ćete nakon toga morati ponovno oblikovati tekst (pomoću alata urednika ili ručno).
2. Pišite i objavite članke putem LiveWritera. Popularni urednik bloga odmah generira ispravan kôd. A na zasebnoj kartici možete vidjeti kako će izgledati tekst na web mjestu.
3. Koristite HTML čistiju. Ova mrežna usluga ne uništava sav kod u cijelosti, već samo dodatne fragmente. Pomoću filtara možete odabrati koje oznake želite spremiti. Tu je i snažan vizualni editor za oblikovanje koji dodaje optimizirane naredbe kodu.

Uvijek provjerite HTML prije objavljivanja novog zapisa. Ne smije sadržavati oznake osim onih koje ćemo sada pogledati.

stavci

Ovaj je element prisutan u gotovo svim člancima. Svaki odjeljak trebao bi se nalaziti unutar takvog spremnika - pojednostavljuje oblikovanje i omogućuje vam da zadržite jedan stil na svim stranicama web mjesta. Radi praktičnosti, oznaku

uvijek napišite novu liniju.

poravnanje

Zasebna HTML oznaka "Poravnaj tekst" nije se upotrebljavala dulje vrijeme. Umjesto toga stvoren je univerzalni atribut ALIGN. Da biste promijenili položaj blokova teksta na stranici, morate odabrati jednu od 3 vrijednosti - CENTAR, DESNO ili LIJEVO. Slično tome, možete postaviti poravnanje za druge elemente - na primjer, zaglavlja.

U nekim situacijama, druge HTML oznake koriste se za poravnavanje. Tekst na središtu, primjerice, može se organizirati pomoću elementa

Naslovi i podnaslovi

Sustav podnaslova omogućuje stvaranje logičke strukture sadržaja. Kada je tekst podijeljen na semantičke blokove, čitatelju je mnogo lakše koncentrirati i naučiti nove informacije. Tražilice također analiziraju zaglavlja kako bi razumjeli koje zahtjeve za promociju stranice. Stoga stručnjaci za SEO preporučuju korištenje tematskih ključeva.

HTML koristi šest razina titlova - od

• . Glavni naslov (naslov članka, roba u online trgovini itd.). U tekstu može postojati samo jedan

• ...

  . Podnaslovi druge razine razbijaju tekst u semantičke blokove. Na primjer, ako ocjenjujete bilježnice, možete napraviti nekoliko

  s imenima različitih modela.

• ...

  . Treća razina je potrebna ako se tekst između dva

  također razbijena u male blokove. U našem primjeru, to može biti kriterij ocjenjivanja - "Performance", "Memory", "Video card" itd. Za svaki model.

• ,

  ,

  . U praksi su vrlo rijetki. Ali opće je načelo isto - one moraju biti "ugniježđene" u bloku s podnaslovom najviše razine.

Pratite ispravnu hijerarhiju. Vraćajući se na naš primjer, to znači da ne možete odmah unijeti imena modela kao

ili

. A još više koristiti podnaslov raznih razina za homogene blokove značenja (na primjer, dodjeljivanje prijenosnog računala koje je zauzelo posljednje mjesto u ocjeni uz pomoć

).

A ovdje je dijagram koji će vam pomoći da odmah shvatite i zapamtite ispravnu strukturu zaglavlja u HTML-u.

arena

Bilo koji popis i upute bolje se oblikuju kao popisi pomoću posebnih HTML oznaka za tekst (tipična pogreška je samo nekoliko odlomaka

,koji počinju crticom ili znamenkom).

Struktura takvih blokova je vrlo jednostavna. Najprije definiramo vrstu popisa - označen

...

...

Svi su elementi između oznaka otvaranja i zatvaranja. Svaka stavka na popisu počinje novom linijom i ima oblik

izbor font: i njegove atribute

Što mogu promijeniti pomoću ove HTML oznake? Veličina teksta, njegov font i boju - i bez dodavanja novih klasa u CSS. To je vrlo povoljno kada trebate odabrati samo jednu rečenicu ili fragment.

ima nekoliko atributa:

• lice. Omogućuje vam promjenu fontova teksta. Možete navesti nekoliko opcija odvojenih zarezima (Tahoma, Verdana). Ako korisnik nema instaliran prvi font, sustav jednostavno koristi alternativu.
• veličina. Da biste povećali ili smanjili tekst, navedite u navodnicima vrijednost od 1 do 7.
• boja. Ovisno o dizajnu, možete odabrati jednu od standardnih nijansi (crvena, zelena, plava) ili unijeti bilo koji kod boje koji možete odabrati.

Ne upotrebljavajte stavke s formatom , umjesto titlova. Bolje je postaviti iste postavke za ispravnu oznaku.

Načini odabira teksta

Monotone tekstualne gume, čak i sa slomom odlomaka. Da biste privukli pozornost i zagrijali interes čitatelja, preporučljivo je grafički označiti ključne točke. Evo nekoliko naredbi koje će vam pomoći u rješavanju ovog zadatka.

.... Izuzetno popularna HTML oznaka. Podebljani tekst odmah hvata vaše oči pa stoga s njegovom pomoći prikladno je istaknuti važne teze i činjenice.

Mnogi zbunjuju oznake i . Vizualno nema razlike, ali rade na različite načine. Prvi jednostavno mijenja izgled teksta, a drugi obavlja funkciju "pokazivača" i ističe najvažnije fragmente (tematske ključne riječi i fraze za SEO).

.... Elegantan i strogi kurziv idealan je za dizajn znanstvenih pojmova, stranih riječi i raznih citata. U ozbiljnim publikacijama sklon tekstom razlikuju se i imena umjetničkih djela.

.... Možda, toliko mnogo sporova nije uzrokovalo HTML oznaku. Podvučite tekst Rijetko se upotrebljava jer je ova metoda dodjele povijesno dodijeljena hipervezama. Ako koristite u člancima, imajte na umu da je to prikladno samo za kratke fragmente - ne više od 1 redak.

.... Zanimljiva oznaka koja vam omogućuje da napravite dio preslikavanje teksta. Vrlo relevantno u oglašavanju - na primjer, naglasiti kontrast između starih i novih cijena.

.... Najlakši način za povećanje veličine fonta bez dodatnih parametara.

.... Radi na istom načelu kao i prethodna oznaka. Tekst se smanjuje u odnosu na glavni tekst.

^.... Točan naziv za ovaj format je superscript. U osnovi, ova oznaka namijenjena je matematičkim stupnjevima i fusnotama. Smanjuje se veličina fonta i pomiče odabrani tekst.

_.... Indeks se često nalazi u različitim formulama. Odabrani fragment nalazi se ispod glavnog teksta.

Semantički spremnici

Budući da su neki blokovi pronađeni u mnogim tekstovima, za njih su izrađene posebne oznake. To pojednostavljuje oblikovanje jer ako svaka vrsta sadržaja ima svoj vlastiti skup stilova, dovoljno je odabrati fragment teksta i navesti koje informacije sadrže.

.... Oznaka za dodavanje kodova računala. Nezaobilazno je u člancima o programiranju s primjerima - naredbe se ne izvode, već se prikazuju kao običan tekst.

.... Namijenjen je formulaciji citata - na primjer, ključnih isječaka iz intervjua.

...

. Dodatna oznaka koja sadrži informacije o autoru, uključujući veze.

Razdvajanje linije

Pomoću jednostavne trake možete označiti logičko završavanje velikog odjeljka. ne primjenjuje se na uparene oznake. To znači da element zatvaranja formata nije potreban.

Upotrebom atributa WIDTH, razdvajanje možete učiniti kraćim određivanjem odgovarajuće veličine u pikselima ili postotcima širine prozora.

Učenje kako pravilno upotrebljavati oznake za oblikovanje teksta u HTML-u ne samo da vaše članke olakšavaju čitanje, već i povećavaju učinkovitost SEO.