Maciej Żukiewicz

Semantic interface

Rodzaje tagów

Rodzaje tagów

<main>

<aside>

<nav>

<section>

<article>

<header>

<footer>

<main>

Określa główną treść dokumentu.

Treść wewnątrz elementu <main> powinna być unikalna dla dokumentu.

Nie powinien zawierać żadnych treści powtarzających się w dokumentach, takich jak paski boczne, linki nawigacyjne, informacje o prawach autorskich, logo witryny i formularze wyszukiwania.

<aside>

Definiuje treść poboczną dokumentu lub elementu.

Treść tego tagu nie powinna wpływać na "czytelność" głównej treści.

Znacznik może być użyty bezpośrednio w tagu <body>, ale także w innych elementach takich jak <section> czy też <article>.

W tym znaczniku najczęściej znajdują się elementy takie jak: nawigacja kontekstowa, reklamy, powiązane treści, informacje o autorze, etc.

<nav>

Definiuje wszystkie linki składające się na nawigację serwisu.

Nie umieszczaj w nim linków, które nie służą do nawigacji po serwisie np. link do produktu, link do wpisu na blogu, etc.

W dokumencie może być wiele znaczników <nav>.

<section>

Definiuje treść sekcji (czyli pewnej części) dokumentu.

Tego znacznika najczęściej używamy, aby pogrupować treść dokumentu w logiczne części np. najczęściej kupowane produkty, produkty w promocji, wyniki wyszukiwania, etc.

Sekcja powinna posiadać nagłówek informujący co się w niej znajduje.

<article>

Definiuje niezależną i autonomiczną treść w dokumencie.

Treść znajdująca się w znaczniku powinna mieć sens niezależnie od reszty informacji na stronie.

Przykładowe użycie tego tagu to: post na blogu, przepis, produkt, komentarz.

Artykuł powinien posiadać nagłówek informujący co się w nim znajduje.

<header>

Jest to kontener dla treści wprowadzających do dokumentu lub elementu.

W tym znaczniku najczęściej znajdują się elementy takie jak: logotyp, nawigacja, nagłówek, informacje o autorstwie.

Znacznik może być użyty bezpośrednio w tagu <body>, ale także w innych elementach takich jak <section>, <article>, <aside>.

Tagu nie można używać wewnątrz innego tagu <header>, a także w: <footer> oraz <address>.

<footer>

Jest to kontener dla treści, które w praktyce umieszcza się w stopce dokumentu lub elementu.

W tym znaczniku najczęściej znajdują się elementy takie jak: informacje o autorstwie czy też prawach autorskich, dane kontaktowe, mapa strony, linki do powiązanych dokumentów, przypisy, linki kierujące do góry strony..

Znacznik może być użyty bezpośrednio w tagu <body>, ale także w innych elementach takich jak <section>, <article>, <aside>.

Tagu nie można używać wewnątrz innego tagu <footer>.

Made with Slides.com