HTML5 se dévoile Les balises principales de HTML 5

Doctype

Le doctype est simplifié :

 <!DOCTYPE html>


 Documentation sur l'élément Doctype

Il n'est pas sensible à la casse (on peut écrire <!doctype html> par exemple), et son rôle est uniquement d'éviter un rendu en mode "Quirks" (ou mode de compatibilité) des navigateurs.



Section

L'élément <section> permet de définir les différentes sections d'un document comme par exemple les chapitres, les en-tête et pied-de-page, ou toute autre section dans un document. Il peut être combiné avec les éléments h1, h2, h3, h4, h5, et h6 pour une meilleure définition de la structure du document.

 Documentation sur l'élément Section



Article

<article> représente un texte, comme par exemple un article de journal, de blog ou de forum.

 <article> 
<p><a href="http://www.alsacreations.com/actu/lire/746-xhtml-est-mort-vive-html.html">
XHTML est mort, vive HTML !</a><br />
Sous ce titre quelque peu provocateur (et faux) se cache une réalité officielle depuis hier soir : le W3C vient d'annoncer que ses travaux sur XHTML 2 se termineront cette année 2009.</p>
</article>


 Documentation sur l'élément Article



Aside

L'élément <aside> est destiné au contenu indirectement lié à l'article lui-même, il représente ce qui l'entoure comme par exemple une barre latérale d'archives.

 <aside> 
   <h1>Archives</h1>
   <ul>
       <li><a href="https://www.journaldunet.com/archives/09/05/">Mai 2009</a></li>
       <li><a href="https://www.journaldunet.com/archives /09/06/">Juin 2009</a></li>
       <li><a href="https://www.journaldunet.com/archives /09/07/">Juillet 2009</a></li>
   </ul>
</aside>    

 Documentation sur l'élément Aside



Header

L'élément <header> représente l'en-tête d'une section ou d'une page.

 Documentation sur l'élément Header



Footer

L'élément <footer> représente le pied de page d'une section ou d'une page pour mettre les informations concernant l'auteur, les mentions légales?etc.

 Documentation sur l'élément Footer



Nav

L'élément <nav> représente une section de liens de navigation.

 <nav> 
<a href="index.php">Page d'accueil</a>
<a href="contact.php">Contact</a>
</nav>

 Documentation sur l'élément Nav



Dialog

L'élément <dialog> peut être utilisé pour définir une conversation.

 <dialog> 
 <dt> Raphaël
 <dd> Hello, comment ça va ?
 <dt> Julie
 <dd> Bien merci et toi ? 
 <dt> Raphaël
 <dd> Super merci, tu as vu la nouvelle opération Kiwiz ? 
 <dt> Julie
 <dd> Ah oui c'est top, je crois que je vais me commander un livre qui parle des Sims 3.
</dialog>

... bien que les éléments de listes de définition (dt, dd) soient explicitement utilisés dans l'exemple proposé par le W3C, cet usage nous semble assez incongru.

 Documentation sur l'élément Dialog



Figure

L'élément <figure> peut être utilisé pour regrouper des éléments tels que des images ou des vidéos avec leur légende <legend>.

 <figure> 
<img src="/images/chaton.jpg" />
 <legend>Un petit chat mignon tout plein</legend>
</figure>

  Documentation sur l'élément Figure