Html p atributi. Tagovi - što su i što su. Zašto su potrebne oznake h1-h6?

Označiti

Označiti

koristi se za podjelu stranice na odlomke. Može sadržavati samo tekstualne i ugrađene oznake (oznake na razini retka). Istovremeno, sama oznaka

Temelji se na blokovima, odnosno stvara prijelom retka prije i iza sebe. Osim toga, postavlja margine slobodnog prostora iznad i dolje sa svojih strana prema okolnom kontekstu, zbog čega je stranica vizualno podijeljena na odlomke. Veličina polja oznake

Ovisi o vrsti preglednika, ali je približno jednaka visini jednog retka teksta na trenutnoj stranici.

Završna oznaka

nije obavezan. Ako nedostaje, tada će se kraj odlomka smatrati prvom neumetnutom oznakom koja se nalazi ispod u HTML kodu stranice.

Atributi

Osobne karakteristike:

  • align - Postavlja horizontalno poravnanje sadržaja odlomka.
  • accesskey - postavlja tipku prečaca za fokusiranje na HTML element.
  • klasa - specificira naziv klase oznake ili klasa koje se koriste u CSS-u (Cascading Style Sheets).
  • dir - označava smjer teksta unutar elementa.
  • - navodi naziv identifikatora HTML oznake koji se može koristiti kao "sidro" ili u listovima stilova.
  • lang - označava jezik na kojem je napisan tekst unutar HTML elementa.
  • stil - potreban za primjenu ugrađenih CSS stilova na oznaku.
  • tabindex - postavlja tabulatorski redoslijed između elemenata (tipka Tab).
  • naslov - prikazuje opis alata kada prijeđete mišem preko HTML elementa.

Vrsta oznake

Namjena: tekst (blokovi).

Model oznake: blok (blok, blok razina).

Može sadržavati: ugrađene oznake, običan tekst i HTML posebni znakovi(mnemotehnika).

Oznaka za otvaranje: potrebno. Završna oznaka: nije obavezno.

Sintaksa

sadržaj

Primjer HTML-a: korištenje oznake P

seodon.ru - Korištenje oznake P

Jedna od pogrešaka koju čine kreatori web stranica početnici jest korištenje neuniformiranih slika ili svijetlih boja za pozadinu tekstualnih informacija na stranici. To ne samo da otežava čitanje, već ima i štetan učinak na vid korisnika, prisiljavajući ih da vire u svaki redak i nepotrebno naprežu oči.

Druga pogreška je korištenje obrnutih boja "posvuda", kada je boja teksta vizualno svjetlija od pozadine, na primjer, crna pozadina - bijeli tekst. Ova tehnika je sasvim primjenjiva, ali samo tamo gdje je stvarno prikladna.



Podrška za HTML verziju

Verzija:HTML 4.01HTML 5XHTML 1.0XHTML 1.1
podrška:DaDaDaDa

Podrška za preglednik

preglednik:Internet ExplorerGoogle ChromeMozilla FirefoxOpera
Verzija:6.0 i više2.0 i više2.0 i više9.2 i više3.1 i više
podrška:DaDaDaDaDa

A danas ćemo pobliže pogledati što je to html oznake i oni atributi Na primjer p, br, hr; i također kakvu ulogu imaju? vrijednosti atributa oznake sadržane u html dokumentu.

Prije nego počnem, želio bih se ispričati zbog svoje duge odsutnosti. Činjenica je da sam zbog zauzetosti s jednim projektom bio prisiljen na neko vrijeme odustati od ažuriranja bloga i bio sam u nekom kašnjenju. Ali sada je sve gotovo i nadam se da ću nastaviti održavati isti ritam i redovito davati svježe materijale.

Sada se vraćam na zamišljenu temu. U sklopu uvoda u osnove html-a, već sam pisao o strukturi html dokumenata, gdje sam dao i objašnjenja o glavnim html, head i body tagovima, koji moraju biti prisutni u svakom dokumentu, kao i posebnom tag-unaziva deklaracija.

Ovaj odjeljak također pruža informacije o tome kako koristiti značajku izrade popisa. Osim toga, možete se upoznati s obrascima na web mjestu i zasebno s oznakama koje vam omogućuju dizajn najrazličitijih obrazaca: .

Pošto sam od vas, dragi čitatelji, primio brojne želje putem obrasca za povratne informacije i putem e-maila, odlučio sam se vratiti na početak i detaljnije opisati što tagovi postoje, kako se klasificiraju i koji su atributi html tagova . Dakle, počnimo.

Parne i pojedinačne, blok i linije HTML oznake: p, br, hr

Kao što ste vjerojatno već shvatili iz prethodnih postova na blogu, oznaka je glavna strukturna jedinica Hyper Text Markup Language (HTML). Općenito, to je skup oznaka koji određuje html kod koji opisuje određeni dokument (na primjer, jednu od stranica vašeg resursa).

Oznake su razvrstane u parove i pojedinačne, kao i blok i linije oznaka. Sada, redom, pogledajmo bit njihovih razlika na primjeru najpopularnijih i najčešće korištenih oznaka. Usput, u mnogim izvorima možete pronaći naziv blok i inline elemenata, znajte da su to iste stvari.

Za početak ću dati kratke definicije. Uparene html oznake- elementi koji imaju oznaku za otvaranje i zatvaranje, između kojih se nalazi sadržaj; pojedinačni elementi nemaju oznaku za zatvaranje. Blokovni elementi su oni koji zauzimaju cijelu raspoloživu širinu, a njegova visina određena je sadržajem. Stoga će prema zadanim postavkama nekoliko elemenata bloka biti smješteno jedan ispod drugog.


Elementi bloka mogu biti ugniježđeni jedan u drugi, ali ne svi, više o tome kasnije. Umetnute oznake obično sadrže tekst ili druge umetnute elemente, ali nije vam dopušteno postavljanje blok oznaka unutar umetnutih oznaka. Inline oznake, za razliku od blok oznaka, nalaze se u jednom redu i prenose se u drugi samo ako je potrebno, kada ponestane raspoloživog prostora širine.


Vjerojatno je za početnike još uvijek malo komplicirano i postoji zbrka u glavi, ali to je dobar početak. U budućnosti će sve biti jasnije, u to sam uvjeren. Štoviše, prelazim na konkretne primjere temeljene na uobičajenim oznakama, svaki put bilježeći kojim elementima, u liniji ili bloku, u paru ili pojedinačno, svaki od njih pripada.

Počnimo s oznakom p koju svaki webmaster koristi doslovno svake minute, ne pretjerujem. Naziv ovog elementa dolazi od početnog slova engleske riječi paragraf (odlomak, paragraf). Služi za isticanje fragmenata teksta, što je čitateljima mnogo lakše percipirati. Upravo sada, na primjer, pišem članak i s vremena na vrijeme ističem tekst posta u odlomke, možete vidjeti ovo.

Razbijanjem teksta na fragmente i olakšavanjem posjetiteljima resursa da percipiraju materijal, možete značajno poboljšati resurs za tražilice, što je važno u njegovoj promociji.

U svojoj srži, prirodno, p element je uparen, budući da ima oznaku otvaranja i zatvaranja. Istovremeno, to je blok element koji može sadržavati samo inline elemente. Na primjer, ako napišete neki tekst u nekoliko redaka i stavite ga između početne i završne oznake p, tada će ga preglednik i dalje prikazati u jednom retku i samo ako tekst ne stane u jedan red, bit će prebačen.

HTML oznake Oznaka p - blok element Sadržaj oznake p

Ali da biste prikazali ovaj tekst u nekoliko redaka, morate koristiti element br (od engleskog "break"), koji je jednostruk, odnosno nema završnu oznaku, a također je i inline element. Postavljanjem na kraju svakog retka teksta koji je sadržaj p oznake, dobivamo željenu opciju:

HTML oznake
Oznaka p - blok element
Sadržaj oznake p

Pisanje br oznaka je gotovo besplatno. Odnosno, možete odabrati nekoliko redaka odjednom i staviti ovu oznaku na kraj svakog od njih ili možete jednostavno napisati tekst na uobičajeni način i umetnuti br na mjestima gdje bi se trebale napraviti crtice. Broj inline elemenata br uključenih u sadržaj blok oznake p može biti onoliko velik koliko želite. Odnosno, u novi red možete napisati koliko god želite teksta.

Sada pogledajmo još jednu jednostavnu oznaku, o kojoj ćemo detaljnije govoriti na kraju članka. Govorimo o oznaci hr (od engl "horizontalno pravilo"- vodoravna linija), koja je jednostruka, ali istodobno blok, jer prema zadanim postavkama zauzima cijelu moguću širinu. Opisuje jednostavnu vodoravnu liniju koja je korisna za dijeljenje sadržaja stranice na logične dijelove. To može biti odvajanje teksta, grupe slika ili neke druge komponente dizajna.

Izgled ove vodoravne linije ovisi o pregledniku u kojem se stranica pregledava, čiji html kod sadrži ovaj element. Osim toga, izgled ove linije, kao i izgled drugih elemenata, može se uređivati ​​pomoću različitih atributa. Sada smo glatko pristupili još jednoj komponenti naše današnje teme, naime konceptu atributa html oznake.

Atributi HTML oznaka i njihova klasifikacija

Atributi html oznaka omogućuju vam da im date dodatne karakteristike i diverzificirate izgled elemenata web stranice koje preglednik prikazuje. Svaka oznaka može imati nekoliko atributa. Svaki od njih igra ulogu u oblikovanju dizajna određenog područja web stranice. Atributi se pišu unutar uvodne oznake iza naziva samog elementa. Ako ima više atributa, njihov redoslijed nije bitan, može biti bilo što.

Gotovo svaki atribut ima svoju vrijednost (parametar). Općenito, svaka pojedinačna ili uparena oznaka može se shematski prikazati na sljedeći način:


Imajte na umu da za označavanje vrijednosti atributa znak jednakosti treba staviti iza imena atributa, a sama vrijednost treba biti u jednostrukim ili dvostrukim navodnicima. Atributi mogu biti prisutni u inline i blok tipovima; u pojedinačnim i dvostrukim oznakama.

Naravno, u slučaju jednog elementa, neće biti oznake za zatvaranje. Svi atributi i njihove vrijednosti zapisani su unutar uvodne oznake i moraju biti odvojeni razmakom, inače odgovarajuće područje u pregledniku neće biti ispravno prikazano. Da, skoro sam zaboravio, neki atributi ne mogu imati vrijednosti. Naravno, nemoguće je analizirati sve oznake u kombinaciji sa svim mogućim atributima, i to nije važno, glavna stvar je razumjeti mehanizam njihove upotrebe. Na službenoj stranici možete proučiti sve preporučene html oznake.

Istina, postoje podaci koji odgovaraju službeno aktualnim standardima html 4.01. Međutim, ubrzano se odvija implementacija verzije html 5, čija se pravila popularni preglednici već pridržavaju. A u novoj verziji jezika za označavanje hiperteksta neke oznake i atributi više neće biti valjani, odnosno neće biti u skladu s HTML standardima. Stoga ćemo ići u korak s vremenom i ubuduće ću vam nuditi samo valjane oznake i atribute, također ćemo naučiti u budućnosti izbjegavati nepoštivanje standarda HTML koda, materijali o ovoj temi pojavit će se vrlo brzo.

Ali pogledajmo službenu W3C stranicu, gdje je predstavljena tablica preporučenih html oznaka. Ako kliknemo na poveznicu s oznakom koja nas zanima (radi jasnoće, uzmimo već spomenutu oznaku hr, tim više što ćemo u nastavku razmotriti jedan primjer s njom), tada ćemo biti preusmjereni na ovu web stranicu, gdje se nalazi specifikacija u vezi s ovim elementom dano je:


Svi atributi elementa mogu se podijeliti u tri skupine:

  1. Grupa univerzalnih atributa- primjenjuju se na gotovo sve html oznake. Na gornjoj snimci zaslona oni su istaknuti u zelenom okviru
  2. Jedinstveni atributi- skup atributa jedinstvenih za ovaj element (za oznaku hr na slici oni su podvučeni ljubičastom bojom: align, noshade, size, width). Specifikacija html 5 dodala je novi atribut boje koji određuje boju vodoravne linije.
  3. Događaji- ovi atributi su potrebni kada je potrebna neka radnja kao odgovor na radnju korisnika. Na snimci zaslona oni su istaknuti u plavom okviru.

Informacije o atributima mogu se dobiti i na drugoj W3C stranici, gdje se nalazi tablica s potpunim popisom html atributa:


Ova tablica prikazuje sve atribute za sve oznake koje postoje u jeziku za označavanje hiperteksta. U stupcu "Povezani elementi" nasuprot željenog atributa označene su oznake u kojima se ovaj atribut može koristiti. Stupac "Vrsta" označava vrstu podataka koji se mogu koristiti kao vrijednost atributa. Na primjer, atribut align (koji određuje poravnanje elementa) ima tri moguće vrijednosti (lijevo, središte, desno).

Ako stupac "Odjel" sadrži slovo D, tada se ne preporučuje korištenje ovog atributa, inače html dokument neće proći provjeru valjanosti. U ovom slučaju potrebno je koristiti CSS stilove, koje ćemo, kao što sam već napomenuo, proučavati u bliskoj budućnosti. Ovo je neophodno jer je trend da je većina atributa u html 5 zastarjela, a izgled elemenata treba odrediti pomoću css-a.

Usput, apsolutno potpune informacije s dodanim oznakama i njihovim atributima prema verziji html 5 predstavljene su na jednom od najboljih, po mom mišljenju, resursa posvećenih učenju osnova html-a, naime htmlbook, i to na ruskom.

Kako prikazati vodoravnu liniju pomoću oznake hr

Djelovat ćemo progresivno. hr element bez atributa definira jednostavnu horizontalnu liniju koja zauzima cijelu širinu prostora (vidi primjer gore). Uzastopnom primjenom različitih atributa na oznaku hr mijenjat ćemo izgled vodoravne crte.

Prvo napišimo atribute poravnanja i širine. Što se tiče poravnanja, ima smisla koristiti ga samo ako je naveden atribut širine koji određuje širinu elementa (manju od širine stranice). Podsjetit ću vas da je oznaka hr blok element i prema zadanim postavkama zauzima sav raspoloživi prostor širine.

Vrijednost atributa širine može biti broj (u kojem će slučaju širina biti navedena u pikselima) ili postotak, koji specificira širinu elementa kao dio dostupnog prostora. Vrijednost atributa size upisuje se brojkama i određuje visinu elementa (u ovom slučaju debljinu vodoravne crte). Pa pogledajmo primjer:

Zatim dodajte atribut noshade gore navedenom. Činjenica je da se pri korištenju hr oznake prema zadanim postavkama koriste 3D efekti (sjena), što možete vidjeti gledajući liniju koja se nalazi odmah iznad. Određivanjem atributa noshade zabranjujemo njihovu upotrebu.

Sada pokušajmo dodati atribut boje, koji će odrediti boju vodoravne linije. Imajte na umu da korištenje ovog atributa automatski onemogućuje 3D efekte, tako da noshade nije potreban. Kao vrijednost postavljamo naziv boje, na primjer, "plava".

Dakle, na konkretnom primjeru p, br, hr, pogledali smo kako html oznake, kao i različiti korišteni atributi, utječu na formiranje različitih elemenata na web stranici. Uskoro ću objaviti nastavak ove teme, tako da primate nove materijale, ne zaboravite se pretplatiti na ažuriranja bloga putem RSS feeda ili e-pošte. Stoga mi dopustite da se oprostim s najboljim željama.

HTML oznake su standardni označni jezik koji je namijenjen dokumentima na globalnom internetu. Zahvaljujući njemu stvorene su sve stranice World Wide Weba. Ako pogledate kod stranice na kojoj se trenutno nalazite, vidjet ćete ogroman broj abecednih i numeričkih znakova - to su oznake za HTML. Neki od njih su od posebne važnosti za optimizaciju web stranica za tražilice.

Što su naslovne oznake?

Naslovne oznake imaju najveći utjecaj na težinu ključne riječi na web stranici. Preglednik prikazuje naslov članka, što oznaku čini važnim elementom optimizacije za tražilice. Kako bi privukli pažnju, naslovi članaka trebaju biti napisani jezikom koji prosječna osoba može razumjeti i sadržavati dovoljno informacija. Za bolju izvedbu oznake u vrijednosti < titula > mora sadržavati najmanje 7 riječi. Ako se pridržavate ovog pravila, imat ćete priliku ostvariti dodatni promet s tražilica. I na kraju, naslov treba po značenju biti što bliži samoj temi članka.

Što su oznake pogleda< h1>,< h2>…< h6>?

Takve oznake su naslovi teksta koji se nalaze izravno unutar oznaka: Za bolje performanse stranice, oznaka

- ne više od pet puta. Oznake za oblikovanje i strukturiranje stranica

-

koristiti u potrebnoj količini, ali pokušajte učiniti

Što su oznake< meta>?

Dvije meta oznake vrlo su važne za SEO: opis i ključne riječi. Oni se ne prikazuju na stranici, ali ih tražilice uzimaju u obzir. U početku su ključne riječi stvorene kako bi semantika dokumenta bila lakša za razumijevanje tražilicama. Sada su u ovu oznaku umetnute riječi koje odražavaju bit internetske stranice.

Što se tiče oznake opisa, ranije je u nju ubačen veliki broj riječi, što je utjecalo na rangiranje. Yandex tražilica generira isječke na temelju vrijednosti ove oznake. Danas su mnogi sigurni da opis uopće nije potreban, ali optimizatori ipak preporučuju da ga ispunite. U svakom slučaju, neće učiniti nikakvu štetu.

Što su oznake< jak>,< b> i< em> ?

Funkcija oznake - istaknuti tekst na stranici masnim slovima. Pojavio se malo kasnije od oznake , ali unatoč tome, uzimaju ga u obzir i tražilice. Kako bi identificirali ključne riječi i ojačali njihovo značenje, stručnjaci za promociju preporučuju korištenje oznaka za isticanje , .

Oznake , Napiši riječi napisane između njih kurzivom. Za tražilice su od malog značaja, ali će njihova upotreba imati pozitivan učinak na internet stranicu.

je oznaka čija je funkcija podcrtavanje dijelova teksta koji su informativne prirode. Njegov utjecaj na pretraživanje je beznačajan, već se koristi da bi dizajn stranice bio izražajniji.

Što su oznake< img>?

Slike koje su dostupne na internetskim stranicama prikazane su na njima pomoću oznake . Ima velik broj atributa, no za tražilice su najvažniji alt i title. Prva od njih je informativne prirode i prikazuje se ako nije moguće otvoriti sliku, a druga sadrži naziv slike. Iskače u pregledniku ako prijeđete iznad slike. Oba ova atributa vrlo su važna i za posjetitelje i za tražilice (alt u većoj mjeri), ali ih mnogi webmasteri nezasluženo zanemaruju.

Oznake se najčešće koriste pri uređivanju HTML stranica - zahvaljujući njima, tekst je podijeljen na odlomke. Pravilna upotreba različitih oznaka ne samo da će pomoći u promicanju vaše stranice u tražilicama, već će je učiniti i privlačnijom posjetiteljima.

su najčešće u upotrebi, jer utječu na težinu ključne riječi na internet stranici. Dakle, u pregledniku se prikazuje naslov članka, što naslov čini nužnim dijelom tražilice. Naslovi članaka najčešće su napisani jezikom razumljivim prosječnoj osobi i trebali bi sadržavati dovoljno informacija da privuku pozornost. Da bi oznaka najbolje funkcionirala, vrijednost naslova mora sadržavati najmanje 7 riječi. Ako se pridržavate ovog pravila, imat ćete priliku ostvariti dodatni promet s tražilica. I na kraju, naslov treba po značenju biti što bliži samoj temi članka.

Što su oznake pogleda

,

…

?

Takve oznake su naslovi teksta koji se nalaze izravno na samoj stranici stranice i nalaze se unutar drugih oznaka …

. Oznaka za bolju izvedbu stranice

Preporuča se koristiti samo 1 put, i

- ne više od 5 puta. Ali trebali biste koristiti oznake za oblikovanje i strukturiranje stranica

-

u razumnom iznosu.

Što su oznake ?

Za rad u SEO-u najčešće se koriste dvije meta oznake: opis i ključne riječi. Oni se ne prikazuju na stranici, ali ih tražilice uzimaju u obzir. U početku su ključne riječi stvorene kako bi tražilicama olakšale razumijevanje semantike dokumenta. Sada su u ovu oznaku umetnute riječi koje odražavaju bit internetske stranice.

Što se tiče oznake opisa, ranije je u nju ubačen veliki broj riječi, što je utjecalo na rangiranje. Yandex tražilica generira isječke na temelju vrijednosti ove oznake. Danas je većina ljudi sigurna da opis uopće nije potreban, ali programeri preporučuju njegovu upotrebu. U svakom slučaju, od toga neće biti nikakve štete.

Što su oznake , , I ?

Označiti - je oblikovanje, njegova funkcija je podebljati tekst na stranici. Ova oznaka se pojavila nešto kasnije od oznake b, ali unatoč tome, tražilice je također uzimaju u obzir. Kako bi identificirali ključne riječi i ojačali ih, stručnjaci za promociju preporučuju korištenje istaknutih oznaka.

- oblikuje riječ unesenu u njega, pišući je kurzivom. Za tražilice nema veliki značaj, ali će njegova upotreba imati pozitivan učinak na internetsku stranicu.

je oznaka koja se također koristi u formatiranju, ali je njena funkcija podcrtavanje dijelova teksta koji su informativni. Utjecaj ove oznake na pretraživanje nije značajan, češće se koristi za ljepotu.

Što su oznake ?

Slike koje se prikazuju na stranicama to čine pomoću oznake . Ovaj tag ima velik broj atributa, no za tražilice su najvažniji alt i title. Alt - je informativnog karaktera, a naslov sadrži naziv slike koja može biti in

Međutim, oznaka koja se najčešće koristi u uređivanju HTML stranica je

Ovo je popularan način odvajanja odlomaka. U svakom slučaju, svako korištenje oznaka samo će povećati popularnost vaše stranice među tražilicama. Iskoristite ih i krenite naprijed.

Pozdrav, dragi čitatelji bloga. Danas ćemo započeti razgovor o tagovima u Html jeziku, odnosno o naslovima H1, H2, H3, H4, H5, H6, o paragrafima P i prijelomima redaka Br, kao i o oznaci horizontalne linije Hr, na primjeru koje pogledat ćemo upotrebu atributa i da vidimo gdje možete pronaći sve moguće atribute za svaki element i pogledati sintaksu vrijednosti za njih.

Glavna razlika između inline i block tagova je u tome što prve mogu slijediti jedna drugu po širini dok im ne ponestane prostora, a zatim se prelamaju u sljedeći redak.

Blokirajte elemente, prema zadanim postavkama, pokušajte zauzimaju sav raspoloživi prostor u širini i stoga će se sljedeći blok element nužno nalaziti na drugoj liniji.

Započnimo sada sustavno proučavanje svih mogućih oznaka u HTML-u, a pritom ćemo obratiti posebnu pozornost na to kojoj vrsti pripadaju kako bismo jasno razumjeli mogućnosti njihove ispravne (valjane) upotrebe. Pojednostavljena struktura oznake izgleda ovako:

Za njih također postoje atributi (svaki ima svoj skup), koji vam omogućuju dodavanje određenih svojstava ovom elementu, ali o tome ćemo govoriti na konkretnim primjerima.

Počnimo s pogledom na koncept naslova koji se formiraju pomoću uparenih oznaka H1, H2, H3, H4, H5, H6 (naziv dolazi od prvog slova riječi "Header", tj. "heading"). Osmišljeni su za odvajanje različitih fragmenata teksta jedan od drugog i označavanje njihove važnosti ovisno o razini. U modernoj verziji HTML jezika, sve oznake i svi atributi dopušteni za njih unaprijed su navedeni i opisani.

Kao rezultat toga, naslovi mogu imati samo šest razina i, dodatno, elemente H1-H6 su blokaste, tj. nastojte zauzeti sav raspoloživi prostor po širini stranice. Ali imaju jednu osobitost - samo ugrađeni elementi mogu biti sadržani unutar oznaka naslova, unatoč činjenici da, na primjer, isti Div omogućuje uključivanje drugih blok oznaka unutar njega.

Da. preglednik vam neće dopustiti, na primjer, da zaglavlja druge razine zatvorite unutar zaglavlja jedne razine, jer, ponavljam, to su blok elementi, ali mogu sadržavati samo mala slova. Oh, kako.

Naslovi različitih razina H1-H6 bit će nacrtani u preglednicima s fontovima različitih veličina (iako ih, koristeći CSS, možete postaviti apsolutno bilo koju veličinu, boju i vrstu fonta za prikaz u pregledniku, ali u čistom Html-u to su pravila) :

Ako uzmemo u obzir izgled web mjesta sa stajališta pogodnosti njegove daljnje promocije (), onda je vrijedno spomenuti da bi trebao postojati samo jedan naslov razine H1 po stranici. Vjerojatno možete koristiti dva H1, ali više od toga će najvjerojatnije izazvati negativnu reakciju tražilica kada pretražuju vaš dokument. Vaše radnje mogu se smatrati neželjenom poštom ili povećanjem relevantnosti.

Također se ne preporučuje preskakanje razina naslova, tj. Nakon H1, trebali biste koristiti H2 za označavanje manje važnih dijelova teksta itd. Malo je vjerojatno da će to povući ozbiljne sankcije od strane tražilica, ali ipak je bolje slijediti logiku u kreiranju razina naslova u Html kodu.

Tražilice daju veću važnost riječima sadržanim u ovim oznakama nego riječima samo u tekstu. Zaključak koji slijedi je da kada pišete članke, trebali biste dodati naslove onima koje koristite.

Pa, sama upotreba naslova u tekstu članka čini ga vizualnijim i pomaže čitateljima da se brzo snađu u skupu informacija. Mislim da će za prvi put biti dovoljno informacija i da je vrijeme da krenemo dalje.

Odlomak, prijelom retka i vodoravna linija HR u Html kodu

Oznaka P izvedena je iz riječi "odlomak", ali češće se još uvijek naziva odlomak. Koriste se za semantičko isticanje određenog dijela teksta, koji obično uključuje nekoliko rečenica. Između odlomaka formiranih od P elemenata okomito pojavljuje se prazan prostor, što dopušta odvojene logičke dijelove teksta vizualno jedno od drugog.

Stvar je u tome što je osobi prilično teško čitati monolit teksta ako nije razbijen u zasebne male fragmente. Na primjer, općenito niti ne počinjem čitati članke koji nisu razbijeni na paragrafe u HTML kodu, jer je to jako neugodno.

Razbijanjem teksta vrlo ste smanjiti prag umora posjetitelja vašeg resursa i poboljšati korisničke čimbenike (vrijeme koje korisnik provede na vašoj stranici i), što zauzvrat ima pozitivan učinak na promociju.

U iste svrhe (zadržavanje pozornosti korisnika i smanjenje umora pri čitanju članka) u tekst se dodaju različiti, a ponekad i možda.

Usput, oznaka odlomka P, kao što ste vjerojatno već primijetili, je par, ali prema specifikaciji HyperText Markup Language 4.01, završni element za nju je potpuno nije obavezno. U ovom slučaju, preglednik će morati shvatiti gdje ga treba postaviti.

Budući da je P blok element i unutar njega se mogu pojaviti samo elementi s malim slovima. Shodno tome, preglednik, nakon što je otkrio uvodnu oznaku odlomka, dalje analizira kod i čim naiđe na sljedeći element bloka (najvjerojatnije će to biti sljedeći početni P), odmah ispred njega umeće završnu oznaku odlomka. U standardu Html 5 takve slobode najvjerojatnije više neće postojati i potrebne su odmah naviknuti se na zatvaranje svih oznaka i piši ih samo malim slovima.

Odlomak je blok element, tako da će tekst unutar odlomaka nastojati zauzeti sav raspoloživ prostor širine. Odnosno, ako ste napisali katren u Html kodu dokumenta kako treba (svaki red posebno), i cijeli ovaj katren zatvorili u oznake odlomka P, tada ćete u pregledniku vidjeti da će se sva vaša četiri retka spojiti u jedan i zauzet će cijelu širinu prostora dostupnog za tekst.

Već smo detaljno raspravljali o tome zašto se to događa u članku o. Zahvaljujući ovom svojstvu jezika za označavanje hiperteksta (da će bilo koji broj razmaka u izvornom kodu biti zamijenjen jednim razmakom kada se prikaže u pregledniku), možete formatirati svoj kod na bilo koji prikladan način, bez straha da ćete poremetiti njegov prikaz na web stranicu.

Pa, ako stvarno trebate napisati katren u općeprihvaćenom obliku, možete koristiti dodatni HTML za tu svrhu

oznake za prijelom retka pod nazivom BR

(od riječi "prekid"):

BR je inline element i također "prazan", tj. jednostruki (nema element za zatvaranje). Cijela funkcija BR-a je da uzrokuje prijelom retka prilikom prikaza teksta u pregledniku (slično tipki Enter u bilo kojem uređivaču teksta).

Pisanje oznaka BR (prijelom retka) u kodu nije regulirano ni na koji način. Možete napisati cijeli tekst zajedno i staviti BR umjesto razmaka na odgovarajuća mjesta ili možete odmah podijeliti tekst u retke u kodu radi jasnoće i staviti BR ili na kraj redaka ili na početak. Ovo ne mijenja suštinu.

HR(skraćenica za riječi “horizontal rule”, tj. vodoravna crta) je vrlo jednostavan Html tag koji iscrtava vodoravnu crtu (traku) preko cijele širine ekrana i debljine, ovisno o pregledniku u kojem se gleda (u biti to je vizualni marker, koji vam, po analogiji s oznakama naslova, omogućuje razbijanje teksta na logične dijelove radi lakše asimilacije).

On je “prazan” (jednostruk), tj. nema par (završna oznaka). Osim, HR je blok element, tj. prema zadanim postavkama zauzima cijelu širinu stranice koja mu je dostupna.

Pojam atributa i pravila za njihovo upisivanje u Html tagove

Pogledajmo koncept atributa pomoću ovog jednostavnog elementa. Činjenica je da oznakama možemo dodati atribute koji su valjani i opisani u WC3 validatoru za njih, dajući sadržaju svojstva koja su nam potrebna.

Na primjer, ako imate nekoliko odlomaka (odlomaka) u nizu zatvorenih u odgovarajuće P oznake, tada da biste promijenili izgled jednog od njih samo trebate dodati potrebne atribute u početni P element ovog odlomka. U slučaju pojedinačnih (praznih) oznaka, ne postoje opcije gdje dodati traženi atribut.

Dakle, prvo pravilo je atributi se postavljaju samo u početnu oznaku(završni nikad ništa ne sadrži). Jedan element može sadržavati više atributa koji su međusobno i između naziva oznake odvojeni razmakom (obavezni uvjet). Dopustite mi da odmah dam primjer njihove upotrebe za vodoravnu liniju HR:

Dakle, prvo idemo kroz sintaksu atributa. Umetnute su u početnu oznaku, napisane razdvojene razmakom (uključujući razmak iza imena elementa) i konstrukcija su koja uključuje ime, znak jednakosti i napisana u navodnicima (obično je uobičajeno stavljati uparene dvostruke , ali standard dopušta i uparene jednostruke navodnike) vrijednosti. Redoslijed atributa u kodu Html oznake nije važan.

Tamo sam naveo poveznicu na popis svih valjanih HTML oznaka. Ako u ovom popisu kliknete na naziv elementa koji vas zanima (u našem slučaju to je HR), bit ćete preusmjereni na stranicu s detaljnom specifikacijom istog:

Svi atributi bilo koje oznake mogu biti podijeliti u tri grupe:

  1. Općenito - mogu se pojaviti u velikoj većini elemenata u HTML jeziku. Na gornjoj slici oni su na dnu i okruženi crvenim okvirom. Zapravo, postoji nekoliko zajedničkih atributa (samo šest), a čak i tada, malo je vjerojatno da ćete ih sve koristiti u svojoj praksi. Najvjerojatnije postoje samo četiri - , naslov i stil.
  2. Atributi događaja - potrebni su za pokretanje neke radnje kao odgovor na radnju korisnika ili događaj sustava. Oni su više povezani s JavaScreetom i na gornjoj slici su na samom dnu (zaokruženi u tamnom okviru).
  3. Jedinstveno - svaka oznaka obično ima vlastiti skup atributa, od kojih se neki možda uopće ne nalaze na drugim elementima. Ako uzmemo u obzir HR vodoravnu liniju, ona ima samo četiri jedinstvena atributa (poravnanje, nijansa, veličina i širina). Sve ostale navedene u oznaci HR (osim dvije gore opisane grupe) preglednik će zanemariti.

Primjeri atributa u oznaci horizontalne crte HR

Vrijednosti različitih atributa mogu biti ili proizvoljni brojevi (itd.) ili vrijednosti iz unaprijed određenog skupa, na primjer, kao u slučaju poravnanja za HR - lijevo|sredina|desno (možete koristiti jedno od tri poravnanja opcije).

Općenito, informacije o njima u WC3 validatoru mogu se dobiti ne samo na popisu Html oznaka, već i u popis atributa, koje ćete pronaći na navedenoj poveznici.

Ovaj popis sadrži sve moguće opcije za sve oznake dostupne u HTML jeziku. U stupcu "Povezani elementi" nasuprot opcije koja vas zanima bit će navedeni elementi u kojima se ovaj atribut može koristiti. Stupac "Vrsta" označava vrstu podataka koji se mogu koristiti kao njegova vrijednost.

Na primjer, u retku podcrtanom na slici za atribut align, za oznaku HR, dopušteno je koristiti samo tri fiksne vrijednosti, koje su tamo navedene (lijevo | središte | desno).

Još jedan vrlo važan stupac je “Depr”. Ako atribut koji vas zanima u ovom stupcu ima slovo D pored sebe, onda je to upotreba se ne preporučuje, ali trebali biste koristiti odgovarajuće CSS stilove da biste ga zamijenili. Pregledavajući specifikaciju oznake, također smo vidjeli da je uz nazive sva četiri atributa za HR ispisana riječ “Deprecated” (ne preporučuje se za korištenje).

Pogledajmo koji se atributi koriste s elementima koje smo već obradili u ovom članku (P, naslovi H1-H6 i HR). Za sve njih možete koristiti "poravnaj", jer svi ovi elementi su blok elementi. Za ugrađene elemente, atribut "align" nema značenje.

Na primjer, ako dodate "align" oznaci naslova (kao što je H1), možete postaviti poravnanje teksta naslova. Oni. Blok element će zauzeti sav prostor koji mu je dostupan po širini, ali sadržaj ovog zaglavlja (njegov tekst) može se poravnati ili lijevo (zadano), desno ili središnje, ili po širini (justify - udaljenost između riječi se mijenja, kao na novinskim stupcima).

Ista stvar, usput, vrijedit će za Html oznaku odlomka P i za Div spremnik, ako pažljivo pogledate dani screenshot.

Za vodoravnu HR liniju, atribut "align" će pokazati poravnanje same vodoravne linije koju tvori taj element. Ali HR oznaka je blok element i nastoji zauzeti sav raspoloživi prostor u širini. Stoga ima smisla koristiti "usklađivanje" u njemu samo ako, uz njega, i vi postavite vrijednost za atribut “width”.(širina) manja od širine stranice.

Vrijednost za "širinu" mogu biti samo brojevi (ovo će postaviti širinu u pikselima) ili možete koristiti postotak ukupne širine dostupne za horizontalnu HR liniju. Vrijednost atributa “size” za istu oznaku određena je brojevima koji označavaju visinu vodoravne crte u pikselima. Pogledajmo ovo na primjeru:

HR oznaka u Html 4.01 standardu ima još jednu atribut koji se naziva single, jer ne može poprimiti nikakve vrijednosti (samo znači neku radnju) - to je "noshade" koji sprječava da horizontalna linija baca sjenu:

Jasno je da neću moći uzeti u obzir sve moguće atribute za sve moguće oznake u Html-u, a to nije ni potrebno, jer se sve može učiniti po analogiji - glavna stvar je razumjeti sintaksu i samu ideju. Osim toga, mnogi od njih već su postali nepreporučljivi za korištenje, jer... Sada njihovu funkciju obavljaju CSS stilovi, o čemu ćemo također vrlo brzo početi detaljno govoriti.

Sretno ti! Vidimo se uskoro na stranicama bloga

Moglo bi vas zanimati

Tablice u HTML-u - Table, Tr i Td oznake, kao i Colspan, Cellpadding, Cellspacing i Rowspan za njihovo stvaranje
Iframe i Frame - što su i kako najbolje koristiti okvire u Html-u
Naredbe komentara i Doctype u Html kodu, kao i koncept bloka i inline elemenata (tagova)
Embed and object - Html oznake za prikaz medijskog sadržaja (video, flash, audio) na web stranicama
Kako ubaciti link i sliku (fotografiju) u HTML - IMG i A tagovi
Html forme za web stranicu - oznake Form, Input and Select, Option, Textarea, Label i druge za izradu elemenata web forme
Font (lice, veličina i boja), Blockquote i Pre oznake - staro oblikovanje teksta u čistom HTML-u (ne koristi se CSS)
Razmaci i njihovo oblikovanje koda u Html-u, kao i posebni neprekinuti razmaci i druga mnemotehnika
Kako napraviti hipervezu (A, Href, Target blank), kako je otvoriti u novom prozoru na stranici, a također napraviti sliku poveznicom u Html kodu

Pozdrav, prijatelji! Danas ćemo razgovarati o oznaka odlomka i atribut poravnanja. Općenito, sav sadržaj na stranici trebao bi biti podijeljen u odlomke. Sadržaj odlomka ispisan je između oznaka

Tekst…

. Kada prikažemo 2 uzastopna odlomka, između njih se formira nevidljivo polje koje ih odmiče jedne od drugih. Oznaka je blok oznaka pa zauzima cijelu širinu stranice.

Na primjer, uzmimo stranicu sa sljedećim kodom:

Stranica s paragrafima.

Prvi odlomak: Lorem Ipsum jednostavno je lažni tekst tiskarske i slovne industrije. Lorem Ipsum je standardni lažni tekst u industriji još od 1500-ih, kada je nepoznati tiskar uzeo galiju slova i pomešao je kako bi napravio knjigu uzoraka slova.

Drugi odlomak: Davno je utvrđena činjenica da će čitatelju odvući pažnju čitljiv sadržaj stranice kada gleda njezin izgled. Smisao korištenja Lorem Ipsuma je da ima više-manje normalnu raspodjelu slova, za razliku od upotrebe "Sadržaj ovdje, sadržaj ovdje", što čini da izgleda kao čitljiv engleski.

Pogledajmo kako ovo izgleda u pregledniku:


Sigurno ste primijetili da u kodu stranice postoji oznaka jak, ova oznaka podebljava tekst.

Atributi oznake

Za svaku oznaku možete, au nekim slučajevima čak i morate, odrediti atribute. Preko atributa govorimo pregledniku točno kako prikazati ovaj ili onaj element na stranici.

Atribut je naveden unutar uvodne zagrade oznake i ima sljedeću sintaksu: attribute_name="vrijednost"

Atribut poravnanja

Na primjer, imamo odlomak na stranici i želimo uskladiti njegov sadržaj. Da bismo to učinili, upisujemo atribut unutar početne oznake uskladiti, koji je odgovoran za usklađivanje sadržaja unutar odlomka, te ga postavite na jednu vrijednost.

Sadržaj odlomka.

Ovaj atribut ima 4 vrijednosti:

1 preostao– Poravnava sadržaj ulijevo. Ova vrijednost je zadana. To jest, ako ne navedemo atribut za paragraf uskladiti, tada će sadržaj unutar odlomka prema zadanim postavkama biti lijevo poravnat. To se može vidjeti u prethodnom primjeru.

2.U pravu– Poravnava sadržaj udesno.

Tekst…

Evo kako to izgleda u pregledniku:


3.Središte- Poravnava sadržaj prema sredini stranice.

Tekst…


4. Opravdajte– Poravnava sadržaj prema širini stranice.

Tekst…


Sažetak lekcije:
Danas smo naučili što je to paragraf u html-u. Odlomci se vrlo često koriste u html-u. Naučili smo i što je atribut oznake. I naučio atribut poravnanja uskladiti. Koji može uzeti jednu od sljedećih vrijednosti: lijevo (zadana vrijednost),pravo,centaropravdati.



Preporučamo čitanje