A kdy používat články, ASIDE a DIV
Nový element HTML5 SECTION může být poněkud matoucí. Pokud jste před HTML5 vytvářeli dokumenty HTML, pravděpodobně už používáte tento prvek k vytvoření strukturálních dělení na vašich stránkách a následně s nimi stylujte stránky. Takže se může zdát přirozené, že jednoduše nahradíte stávající prvky DIV s prvky SECTION. To je však technicky nesprávné. Takže pokud nenahradíte prvky DIV pouze s prvky SECTION, jak je používáte správně?
Prvek SECTION je sémantický prvek
První věc, kterou je pochopit, je, že prvek SECTION je sémantický prvek. To znamená, že poskytuje význam jak uživatelským agentům, tak i lidem informace o obsahu přiloženého obsahu - konkrétně části dokumentu.
To se může zdát jako velmi obecný sémantický popis, a to proto, že je. Existují i další prvky HTML5, které poskytují více sémantického rozlišení vašemu obsahu, které byste měli nejdříve použít před použitím prvku SECTION:
- ČLÁNEK
- STRANOU
- NAV
Kdy použít Prvek SECTION
Použijte prvek ČLÁNEK, pokud je obsah samostatnou součástí webu, který může být samostatný a bude syndikován jako článek nebo příspěvek na blogu. Použijte prvek ASIDE, pokud je obsah tangenciálně spojen s obsahem stránky nebo samotného webu, jako jsou boční lišty, poznámky, poznámky pod čarou nebo související informace o webu. Použijte prvek NAV pro navigační obsah.
Prvek SECTION je obecný sémantický prvek. Používáte jej, pokud není vhodný žádný z ostatních sémantických prvků kontejneru. Používáte jej k tomu, abyste spolu spojili část dokumentu do diskrétních jednotek, které můžete nějakým způsobem označit za příbuzné. Pokud nemůžete popsat prvky v sekci v jedné nebo dvou větách, pravděpodobně byste tento prvek neměli používat.
Místo toho byste měli použít element DIV. Element DIV v HTML5 je ne-sémantický kontejnerový prvek. Pokud se obsah, který se pokoušíte spojit, nemá sémantický význam, ale stále jej potřebujete kombinovat pro styling, potom je prvek DIV vhodným prvkem, který chcete použít.
Jak funguje prvek SECTION
Část dokumentu se může zobrazit jako vnější obal pro články a prvky ASIDE. Může také obsahovat obsah, který není součástí ČLÁNEK nebo ASIDE. Element SECTION může být také nalezen uvnitř ČLÁNEK, NAV nebo ASIDE. Dokonce můžete vnořit části, které označují, že jedna skupina obsahu je část jiné skupiny obsahu, která je částí článku nebo stránky jako celku.
Prvek SECTION vytvoří položky uvnitř obrysu dokumentu. A jako takový byste měli mít vždy část hlavičky (H1 až H6) jako součást sekce. Pokud nemůžete přijít s názvem oddílu, pak je pravděpodobně vhodnější prvek DIV. Nezapomeňte, že pokud nechcete, aby se název stránky zobrazoval na stránce, můžete ji vždy maskovat pomocí CSS.
Pokud nepoužíváte prvek SECTION
Kromě výše uvedených pokynů použijte nejprve specifické sémantické prvky, existuje jedna definovaná oblast, kterou byste neměli používat prvek SECTION: pouze pro styl.
Jinými slovy, pokud je jediným důvodem, proč umístíte prvek na toto místo, je připojit vlastnosti stylu CSS, neměli byste používat prvek SECTION. Najděte sémantický prvek nebo místo toho použijte element DIV.
Nakonec to nemusí mít záležitost
Složitost při psaní sémantického HTML je, že to, co je pro mě sémantické, může být pro vás nesmírným nesmyslem. Pokud máte pocit, že můžete ospravedlnit použití prvku SECTION v dokumentech, měli byste ho použít. Většina uživatelských agentů se nestará a stránka se zobrazí tak, jak by se dalo očekávat, zda budete stylovat DIV nebo SECTION.
Pro konstruktéry, kteří chtějí být sémanticky správní, je významné použití prvku SECTION sémanticky platným způsobem. Pro designéry, kteří chtějí, aby jejich stránky fungovaly, to není tak důležité. Domnívám se, že psaní sémanticky platného kódu HTML je dobrá praxe a udržuje stránky mnohem bezpečnější pro budoucnost. Ale nakonec je to na vás.