Nuovi tag
Continuiamo a parlare dei nuovi tag introdotti in html5 in questa seconda parte dell’articolo, in particolare dei tag aside, nav, article.
Aside
Così come il nuovo tag header è legato all’idea di <head> ,il tag <aside> è legato al concetto di sidebar. Chiaramente quando parliamo di sidebar non ci riferiamo alla posizione dell’elemento nel documento e proprio per questo motivo il nuovo tag è stato chiamato aside, astraendo il concetto di contenuti marginali relazionati all’argomento principale.
Un esempio pratico in cui è ottimo utilizzare il tag sono le citazioni: in generale parliamo di contenuti interessanti da leggere ma che possono essere eliminati senza cambiare la comprensione del contenuto.
Ricordiamo che contenuti che, per esigenza di design, devono apparire nella sidebar non è detto che debbano essere inseriti in un tag aside. Per esempio le informazioni relative alla vita dell’autore di un articolo che dobbiamo inserire in una sidebar vanno inserite in un tag footer e non in un aside.
Nav
Proprio come immaginate il tag <nav> contiene le informazioni di navigazione, usualmente un lista di link. Quando parliamo di gruppi di link chiaramente indichiamo la navigazione principale della pagina e non ogni gruppo di link.
Il tag nav verrà inserito all’interno dell’elemento header. Questo chiarisce meglio il concetto di header presentato nell’articolo precedente.
Esempio:
<nav>
<a href="link1.htm">Link 1</a>
<a href="link2.htm">Link 2</a>
<a href="link3.htm">Link 3</a>
</nav>
Article
il tag <article> viene utilizzato per definire una parte di contenuto che forma una sezione indipendente di una porzione di documento o di una pagina web. Per fare alcuni esempi esplicativi andranno inseriti in un tag <article> tutti quei contenuti come news, blog post e simili.
Riprendendo il discorso riferito all’articolo precedente sul tag section possiamo affermare che l’elemento article è una specializzazione di section; viene utilizzato per contenuti relazionati “autosufficienti”: in altre parole contenuti che hanno relazione tra loro ma vivono anche indipendentemente gli uni dagli altri.
Dobbiamo fare molta attenzione nell’utilizzo del tag section e article poiché sono molto simili. Visto che potenzialmente in un tag section possono esserci uno o più tag article e in un tag article possono esserci uno o più tag section, dovrete decidere, in base alle vostre esigenze, scegliendo la soluzione più adatta a voi.
Esempio:
<article>
<header>
<h1>Contenuto dell'articolo</h1>
</header>
<p>Contenuto del paragrafo dell'articolo</p>
<footer>
<p>Contenuto scritto da dot4all Pubblicato il:</p>
<time datetime="2011-06-01T15:52" pubdate>
3:52pm 1 Giugno 2011
</time>
</footer>
</article>
Leggete l’articolo precedente per approfondire gli altri nuovi tag introdotti in html5.