Kada upotrebljavati Element HTML5 elementa

I kada koristiti ARTICLE, ASIDE i DIV

Novi HTML5 element SECTION može biti pomalo zbunjujući. Ako ste izgradili HTML dokumente prije HTML5, vjerojatno ćete već upotrebljavati element za izradu strukturnih odjeljaka unutar svojih stranica, a zatim oblikujte stranice s njima. Zato bi moglo izgledati prirodno jednostavno zamijeniti postojeće elemente DIV elementima SECTION. Ali ovo je tehnički netočno. Dakle, ako ne samo zamijenite elemente DIV elementima SECTION, kako ih pravilno upotrebljavate?

Element SECTION je semantički element

Prvo što treba shvatiti jest da je element SECTION semantički element. To znači da korisnicima korisnika i ljudima daje značenje o sadržaju sadržaja - konkretno dijelu dokumenta.

Ovo se može činiti poput vrlo općenitog semantičkog opisa, i to zato što jest. Postoje i drugi elementi HTML5 koji pružaju više semantičkih razlika vašem sadržaju koje biste trebali upotrijebiti prije nego što upotrijebite element SECTION:

Kada upotrebljavati Element odjeljka

Upotrijebite ARTICLE element kada je sadržaj neovisni dio web-lokacije koji može samostalno stajati i biti sindiciran kao članak ili post na blogu. Koristite ASIDE element kada je sadržaj tangencijalno povezan sa sadržajem stranice ili samom web sučeljem, kao što su bočne trake, bilješke, fusnote ili povezani podaci o web-lokaciji. Koristite NAV element za sadržaj koji je navigacija.

Element SECTION je generički semantički element. Koristite ga kada nijedan od ostalih elemenata semantičkih spremnika nije prikladan. Koristite ga za kombiniranje dijelova dokumenta zajedno u diskretne jedinice koje možete opisati povezane na neki način. Ako elemente u odjeljku ne možete opisati u jednoj ili dvije rečenice, vjerojatno ne biste trebali koristiti element.

Umjesto toga, trebali biste upotrebljavati DIV element. DIV element u HTML5 je ne-semantički element spremnika. Ako sadržaj koji pokušavate kombinirati nema semantičko značenje, ali još uvijek trebate kombinirati za oblikovanje, onda je DIV element odgovarajući element za upotrebu.

Kako funkcionira SECTION Element

Dio vašeg dokumenta može se prikazati kao vanjski spremnik za članke i elemente ASIDE. Može sadržavati i sadržaj koji nije dio stavke ARTICLE ili ASIDE. Element SEZONA također se može pronaći unutar ARTICLE, NAV ili ASIDE. Možete čak i dijeliti odjeljke kako bi naznačili da je jedna grupa sadržaja dio druge grupe sadržaja koji je dio članka ili stranice u cjelini.

Element SECTION stvara stavke unutar obrasca dokumenta. I kao takav, uvijek biste trebali imati element zaglavlja (H1 do H6) kao dio odjeljka. Ako ne možete pronaći naslov za odjeljak, onda je opet DIV element vjerojatno prikladniji. Zapamtite, ako ne želite da se naslov odlomka pojavi na stranici, uvijek ga možete maskirati pomoću CSS-a.

Kada ne koristite Element odjeljka

Iznad gore navedenog savjeta kako biste najprije upotrijebili specifičnije semantičke elemente, postoji jedno određeno područje koje ne biste trebali koristiti element SECTION: samo za stil.

Drugim riječima, ako je jedini razlog zbog kojeg stavljate element na to mjesto da pridružite CSS svojstva stila, ne biste trebali koristiti element SECTION. Pronađite semantički element ili umjesto toga upotrijebite DIV element.

U konačnici to ne može biti bitno

Poteškoća u pisanju semantičkog HTML je da ono što je semantički za mene može biti krajnje gluposti vama. Ako smatrate da možete opravdati upotrebu elementa SECTION u vašim dokumentima, trebali biste je koristiti. Većina korisničkih agenata ne zanima i prikazuje stranicu kao što očekujete da li ste stil DIV ili SECTION.

Za dizajnere koji vole biti semantički ispravni, korištenje elementa SECTION na semantički valjan način je važno. Za dizajnere koji samo žele da svoje stranice rade, to nije tako važno. Vjerujem da je pisanje semantički valjanog HTML-a dobra praksa i čuva stranice buduće dokazane. Ali na kraju je na vama.