Il presente articolo è la traduzione dell' originale - "The Footer Element Update - pubblicato originariamente su http://html5doctor.com/the-footer-element-update/. La traduzione viene riportata con il consenso dei curatori del sito. Eventuali immagini e porzioni di codice sono dei legittimi proprietari

Aggiornamento

Quando è stata scritta la versione precedente di questo articolo alcuni mesi fa, sapevo, come anche molti di voi, che questo elemento in particolare avrebbe potuto essere soggetto a modifiche in quanto le specifiche HTML 5 si sono avvicinate alla fase di completamento. Il problema è semplice in quanto l'elemento <footer> non era "completo" e non presentava la stessa flessibilità degli altri elementi. Adesso è stato modificato.

In sintesi il content model per l'elemento <footer> è stato modificato per dare un aspetto di contenuti simile all'elemento <header> o all'elemento <nav>. In effetti il suo impiego è assimilabile all'elemento <header>. Tuttavia è importante notare che l'elemento <footer> non è contenitore di  testi  e non introduce una nuova sezione.

Se si è realizzato un sito ed è stato inserito un bel footer con tutto ciò che consente, si è pregati di scrivere un link nei commenti in maniera tale che venga mostrato agli altri lettori.

Qui di seguito  una copia aggiornata dell'articolo originale.

Precedente articolo

Per molto tempo siamo stati abituati a vedere <div id="footer"> nella parte inferiore delle pagine web, ma con l'introduzione dell'HTML 5 è il momento di dire addio ad esso. Con l'aggiunta  del nuovo elemento <footer> abbiamo più spazio e flessibilità.

Secondo le specifiche

L'elemento footer rappresenta la parte inferiore per i suoi elementi più vicini, vale a dire sezione di contenuti o sezione dell'elemento radice. Il footer solitamente contiene informazioni in merito alle sue sezioni, l'autore, link a documenti correlati, i dati sul copyright e simili.

Cominciamo

Prima di discutere del nuovo elemento, cominciamo dalle basi. Come già accennato precedentemente, la maggior parte delle persone disporrebbero un footer in questo modo:

<div id="footer">
  <ul>
     <li>copyright</li>
     <li>sitemap</li>
     <li>contact</li>
     <li>to top</li>
  </ul>
<div>

Con l'uso dell'HTML 5, non ha più motivo di esistere. Come già si saprà, non serve un elemento <div> che contenga altri elementi. Nel nostro caso, quando ci si riferisce al piè di pagina, il codice appropriato è <footer>

<footer>
  <ul>
     <li>copyright</li>
     <li>sitemap</li>
     <li>contact</li>
     <li>to top</li>
  </ul>
</footer>

Come è stato riportato nel primo paragrafo, in origine l'elemento <footer> è stato utilizzato soltanto una volta all'interno delle nostre pagine. Con l'introduzione del nuovo elemento, potrebbe non essere più il caso. L'elemento <footer> può essere utilizzato più volte per visualizzare tutte le informazioni supplementari.

Utilizzare l'elemento <footer>

Una cosa importante da notare è che non si è condizionati ad usare un solo elemento <footer> per sito; è possibile utilizzare footer multipli, ciascuno dei quali diventerà il <footer> per quella sezione specifica  del documento. Si potrebbe, quindi, avere un <footer> per un elemento <section> o per un elemento <article>.

Elemento Section

<section>
   Section content appears here.
   <footer>
   Footer information for section.
   </footer>
</section>

Elemento Article

<article>
   Article content appears here.
   <footer>
   Footer information for article.
   </footer>
</article>

Per vedere un esempio dell'elemento <footer> all'interno di un articolo / sezione non si vada a cercare oltre la presente pagina. Scorrerla verso il basso, oltre l'articolo, e si noterà la sezione con lo sfondo di colore grigio chiaro, che si trova subito dopo "Further reading". La sezione grigia fornisce informazioni riguardo i riferimenti, le risposte, tag e categorie, utilizzando l'elemento <footer>.

Footer

Se ne è già discusso più su come il footer può apparire.

Altri pensieri

Inizialmente  sono stato un pò depistato dalla presentazione dell'elemento; l'uso che ne è stato fatto non è in fondo alla pagina o addirittura in fondo all'articolo, ma sembra adattarsi alle specifiche - informazioni sulle sezioni, nome dell'autore, collegamenti a documenti correlati (commenti) e simili. Non c'è motivo per cui non si possa avere più di un footer per pagina; la descrizione delle specifiche recita "l'elemento footer rappresenta il piè di pagina per la sezione a cui si applica" ed una pagina può avere un numero qualsiasi di sezioni. Le specifiche dicono anche "I piè di pagina non devono necessariamente apparire alla fine della sezione, come solitamente si usa fare".

Bruce Lawson – http://www.brucelawson.co.uk/2009/marking-up-a-blog-with-html-5-part-2/

Conclusioni

L'elemento <footer> offre la possibilità di definire le pagine web dando loro il corretto mark-up semantico, ed è indispensabile utilizzare questi nuovi tag per come sono stati pensati. Quello che conta è che non se ne faccia un uso improprio come è stato fatto con le tabelle e con i div.