Čini se da zašto znati HTML oznake za tekst, ako sada u gotovo svakom admin ima zgodan vizualni editor koji ih stavlja automatski? Činjenica je da je formatiranje sadržaja na web-lokaciji radikalno različito od rada u uredskim aplikacijama. Nije dovoljno samo dati tekst atraktivnom izgledu, jer pravilan dizajn ne ovisi samo o prikazu web stranica, već io njegovoj promociji u tražilicama.

HTML oznake i atributi: osnove sintakse

Bilo koji tekst ima skriveni kod koji "objašnjava" računalo što i kako se prikazuje na zaslonu. Sve informacije se bilježe pomoću skupa univerzalnih elemenata.


U biti, HTML oznake za tekst su naredbe koje dodaju određene blokove na stranicu ili mijenjaju njihov izgled. Ispravan format pisanja izgleda ovako: Imajte na umu da nisu sve oznake uparene. Na primjer,
(preskočiti crtu) ili (dodavanje vodoravne crte) uopće ne morate zatvarati.

Zašto ne mogu kopirati članke iz Worda i drugih programa u uređivač stranica

Iako moderne uredske aplikacije koriste iste HTML oznake za tekst, u 99% slučajeva izvorni kod nije prikladan za web stranice. Čak i ako se sam dokument normalno pojavljuje u samoj aplikaciji, umetanje na stranicu oblikovanja može biti izblijedjelo. Osim toga, zbog velikog broja nepotrebnih oznaka i atributa, tražilice ne mogu adekvatno analizirati sadržaj stranice. Što, pak, komplicira napredak vašeg resursa. Da dobijemČist i relevantan kôd, prvo morate izbrisati tekst iz HTML oznaka koje je stvorio obični urednik. Postoji nekoliko načina da to učinite:

"Pobjegnite" kroz članak "Notepad" i tek tada ga umetnite na stranicu. Aplikacija briše čitav HTML, pa ćete nakon toga morati ponovno formatirati tekst (pomoću alata urednika ili ručno).

Pisanje i postavljanje članaka putem LiveWriter-a. Popularni blog urednik odmah generira ispravan kod. Na zasebnoj kartici možete vidjeti kako tekst izgleda na web-lokaciji.

Koristi HTML Cleaner. Ova online usluga ne uništava cijeli kod, već samo dodatne fragmente. Pomoću filtara odabirete oznake koje želite spremiti. Tu je i snažan vizualni editor za oblikovanje, koji dodaje već optimizirane naredbe kodu.

Uvijek provjerite HTML prije objavljivanja novog unosa. Ne smije sadržavati oznake osim onih koje trenutno pregledavamo.

Stavci

Ovaj je element prisutan u gotovo svim člancima. Svaki odlomak bi trebao biti smješten unutar takvog spremnika - pojednostavljuje oblikovanje i omogućuje vam spremanje jednog stila na svim stranicama stranice. Radi jednostavnosti, oznaka se uvijek piše iz nove linije.

Poravnanje

Odvojeni HTML-tag "Poravnanje teksta" je odavno korišten. Umjesto toga, kreiran je univerzalni ALIGN atribut. Da biste promijenili položaj tekstnog bloka na stranici, morate odabrati jednu od tri vrijednosti - CENTER, RIGHT ili LEFT. Slično tome, možete postaviti poravnanje za druge elemente - na primjer,zaglavlja.
U nekim situacijama, druge HTML oznake se koriste za poravnanje. Primjerice, tekst u sredini može se rasporediti pomoću elementa. Koliko je prikladna zasebna oznaka? Za razliku od atributa, radi s bilo kojim sadržajem, uključujući fotografije, videozapise, bljeskalice itd.

Zaglavlja i titlovi

Sustav titlova omogućuje stvaranje logičke strukture sadržaja. Kada je tekst razbijen u semantičke blokove, mnogo je lakše čitatelju da se koncentrira i nauči nove informacije. Tražilice također analiziraju zaglavlja kako bi razumjeli što traži stranica za pretraživanje. Zato SEO stručnjaci preporučuju korištenje tematskih ključeva u njima. U HTML-u se koristi šest razina podnaslova - od

do

. U tom sustavu postoji jasna hijerarhija:

. Glavni naslov (naslov članka, proizvod u online trgovini, itd.). U tekstu može biti samo jedan

. U pravilu sadrži glavni ključ.

. Podnaslovi druge razine dijele tekst na semantičke blokove. Na primjer, ako napravite ocjenu prijenosnog računala, možete napraviti nekoliko

s imenima različitih modela.

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

također podijeljen u male blokove. U našem primjeru, to mogu biti kriteriji za ocjenjivanje - "Performanse", "Memorija", "Video kartica", itd. Za svaki model.

,

,

. U praksi su izuzetno rijetki. Ali opći princip je isti - oni moraju biti "ugrađeni" u blok spodnaslov najviše razine.

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

ili

. I još više koristiti za homogene podnaslove različitih razina (recimo, bilježnicu koja je zauzela zadnje mjesto na ljestvici, koristeći

).
Ali ovdje je shema koja će vam pomoći da odmah shvatite i zapamtite ispravnu strukturu HTML zaglavlja.

Popisi

Svi unosi i upute najbolje se obavljaju u obliku popisa pomoću posebnih HTML oznaka za tekst (tipična pogreška je samo nekoliko odlomaka koji počinju crticom ili brojem). Struktura takvih blokova je vrlo jednostavna. Najprije odredite vrstu popisa - označenu ili numeriranu. Svi elementi se nalaze između oznaka otvaranja i zatvaranja. Svaka stavka popisa počinje s novom linijom i ima oblik

. Broj elemenata nije ograničen.

Odabir fonta: i njegovi atributi

Što mogu promijeniti pomoću HTML oznake? Veličina teksta, font i boja - i bez dodavanja novih CSS klasa. To je vrlo zgodno kada trebate odabrati samo jednu rečenicu ili fragment. ima nekoliko atributa:

Lice. Omogućuje promjenu fonta teksta. Možete navesti nekoliko opcija putem zareza (Tahoma, Verdana). Ako korisnik nema instaliran prvi font, sustav jednostavno koristi alternativu.

Veličina. Da biste povećali ili smanjili tekst, unesite vrijednost od 1 do 7. u navodnicima.

Boja, Ovisno o dizajnu možete odabrati jednu od standardnih nijansi (crvena, zelena, plava) ili unijeti bilo koji odabrani kod boje.

Nemojte koristiti stavke oblikovane korištenjem umjesto podnaslova. Bolje je staviti iste parametre registracije s ispravnom oznakom.

Vrste odabira teksta

Jednobojni tekst je zamoran, čak iu paragrafima po stavku. Kako bi se privukla pozornost i kako bi se povećao interes čitatelja, preporuča se grafički označiti ključne točke. Evo nekoliko naredbi koje će vam pomoći da se nosite s ovim zadatkom. . Iznimno popularna HTML oznaka. Hrabar tekst odmah zahvaća u oči, pa je uz njegovu pomoć prikladno istaknuti važne teze i činjenice. Mnogi zbunjuju oznake i. Vizualno nema razlike, ali rade drugačije. 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 strog kurziv idealan je za izradu znanstvenih termina, stranih riječi i različitih citata. U ozbiljnim publikacijama imena umjetničkih djela također se razlikuju po kosom tekstu. , Očigledno, toliko sporova nije uzrokovalo nikakve HTML oznake. Podvlačenje teksta rijetko se koristi, budući da je ova metoda raspodjele povijesno ukorijenjenih hiperveza. Ako koristite članke, imajte na umu da je ovo prikladno samo za kratke isječke - ne više od 1 retka. , Zanimljiva oznaka koja vam omogućuje da označite dio teksta. Vrlo relevantno u oglašavanju - na primjer, naglasitikontrast između starih i novih cijena. , Najlakši način za povećanje veličine fonta bez dodatnih parametara. , Radi na istom principu kao i prethodna oznaka. Tekst iznutra, smanjuje se u odnosu na glavni. , Točan naziv za takav format je gornji indeks. U osnovi, ova je oznaka namijenjena matematičkim koracima i fusnotama. Smanjuje veličinu fonta i pomiče označeni tekst prema gore. , Niži indeks često se nalazi u različitim formulama. Odabrani fragment nalazi se ispod glavnog teksta.

Polu-kontejneri

Budući da su neki od blokova pronađeni u mnogim tekstovima, počeli su za njih stvarati posebne oznake. To pojednostavljuje oblikovanje, jer ako svaka vrsta sadržaja ima svoj vlastiti skup stilova, dovoljno je označiti dio teksta i odrediti koje informacije sadrži.. Označite za dodavanje računalnih kodova. Neophodni u programskim člancima s primjerima - naredbe se ne izvršavaju, već se prikazuju kao običan tekst. . Dizajniran za izradu citata - na primjer, ključni izvadci iz intervjua. . Donosi dio teksta u zasebni blok. Po zadanom, označeni fragment ima veću lijevu marginu, ali u CSS-u također možete promijeniti veličinu, stil fonta i boju teksta. . Dodatna oznaka koja sadrži informacije o autoru, uključujući vezu.