HTML5 étant encore en brouillon, certains de ses éléments sont parfois revus dans leur définition. En substance ou sur un détail il est important de savoir de quoi l’on parle avant d’utiliser tel ou tel élément. L’idée première est de ne pas utiliser cet élément pour ses styles ou à la place d’un autre, tout en bénéficiant de sa sémantique.
L’élément aside
Souvent confondu avec la sidebar d’un site web, cet élément est censé représenter un complément d’information lié à une information principale. La barre latérale d’un site web n’a que rarement ce rôle direct de complément à l’information principale de la page, elle est parfois une autre manière de proposer une navigation transversale ou proposer des informations supplémentaires (et non complémentaires) à propos du site web, et non à propos du contenu de la page en elle même.
L’élément aside est donc utilisable pour apporter un contenu à un élément précis, mais pas forcément à la totalité de la page.
<body>
<h1>Titre de ma page</h1>
<article>
<div>
<!-- Ceci est le contenu de mon article -->
</div>
<aside>
<!-- L'information complémentaire à l'article -->
</aside>
</article>
<aside>
<!-- Contenu complémentaire à la page courante, mais pas à l'article au dessus -->
</aside>
</body>Voilà pour l’exemple simplifié.
Ici nous avons un aside associé directement à un article, qui apporte donc un complément d’information à l’article, puis plus bas un aside qui apporte un complément à la page complète, puisqu’il n’y a aucun élément de section parent de cet aside.
N’oubliez pas que l’utilisation de l’élément ne doit pas forcément signifier la définition d’une zone stylée différemment, ou inversement le style d’un contenu de type « sidebar » n’indique pas forcément le besoin d’utiliser l’élément aside.
Séparez bien fond et forme. (cela ne veut pas dire que les deux ne peuvent pas être associés ;p)
Sources et liens utiles
Partager la publication "Définition de l’élément aside en HTML5"
Laisser un commentaire sur cet article ?
Suivre les commentaires et trackbacks