Nové štrukturálne značky a atribúty HTML5

Štandarde by sa štruktúra stránky mala členiť na záhlavie, navigáciu, sekcie s obsahom a  zapätie.

Záhlavie:  - môžeme tam umiestniť napríklad logo spoločnosti, nadpis  resp. názov webovej stránky, slogan, pole na
vyhľadávanie obsahu, hlavný navigačné menu stránky a pod.


< header id="stranka-zahlavie">
    < h1>Nadpis webovej stránky< /h1>
< /header>

Záhlavie môže byť v rámci webovej stránky použite viackrát. Každá sekcia, článok alebo postranný text môže mať svoje záhlavie, ale aj zapätie.



Zapätie:  - môžeme tam umiestniť informácie o webovej stránke, autorské práva, dátum vzniku stránky, odkaz na administračnú časť (CMS) a veľa ďalšieho obsahu. Ako sme už spomenuli, zapätie efinujeme pre stránku ako celok, ale aj pre jednotlivé sekcie, články alebo postranné texty. Článok môže mať v zapätí umiestnenú informáciu o počte prečítaní alebo odkaz "čítaj viac >>" a pod.
< footer id="stranka-zapatie">
    < p>© 2015 all rights reserved< /p>
< /footer>
Navigácia: - najdôležitejšia časť webovej stránky. Webová stránka má okrem hlavnej stránky aj podstránky s jednotlivým obsahom, na ktoré sa dostaneme prostredníctvom odkazov. Navigáciu je možné rozdeliť na hlavnú navigáciu a rôzne pomocné odkazy do jednotlivých častí webovej stránky. Môže byť umiestnená v záhlaví, zapätí alebo aj v jednotlivých sekciách stránky.
< nav> < ul> < li>< a href="/">posledné novinky< /a>< /li> < li>< a href="archiv">archív< /a>< /li> < li>< a href="autori">autori príspevkov< /a>< /li> < li>< a href="kontakt">kontaktujte nás< /a>< /li> < /ul> < /nav>

Sekcie: 
- ide o logické časti webovej stránky. Element < section>< /section> sa používa verzii HTML5 miesto známej značky pre blok < div>< /div>.



Články: 
- popisujú samotný obsah stránky. Texty, obrázky a ďalší obsah je možné zobrazovať práve ako články, a to pomocou značky < article>< /article>.

Postranný obsah:  - v tomto prípade nejde o hlavný obsah stránky. Do postranného obsahu sa môžeme umiestniť doplňujúce informácie k hlavnému obsahu (diagramy, poznámky, pomocné odkazy, citácie a pod.).

< section id="prispevky" >

    < article class="clanok">
        < header>
            < h2>Je koncern PSA Peugeot Citroën zachránený?< /h2>
                < p>
                    Publikoval autor, 26. januára 2015 v 14:39
                < /p>
        < /header>

        < aside>
            < p>
                "Situácia v Trnavskom závode momentálne nie je až taká zlá, ..."
            < /p>
        < /aside>

        < footer>
            < p>< a href="komentare">< i>25 komnetárov< /i>< /a>< /p>
        < /footer>
    < /article>

< /section>

Rubriky: