Après l’article Quelques notes sur la balise h1 avec HTML5 dans lequel j’ai abordé l’utilisation des niveaux d’en-tête h1 -- h6 pour savoir dans quelle mesure il est judicieux d’utiliser une ou plusieurs balises h1 dans une même page Web, je continue sur ma lancée avec la notion d’Outline. Cette dernière fournit la liste des sections imbriquées impliquant les éléments de type Sectioning Content ou Sectioning Root. Chaque section peut être associée à un niveau d’en-tête et peut contenir autant de sections imbriquées que l’on veut. Notez que les sections dont on parle ne sont pas nécessairement l’élément section lui-même (même si ce dernier fait partie des éléments ayant une portée de Sectioning Content). Voulez-vous en savoir plus ?
tag » Section
HTML 5 Outline — Quelques notes sur la structure des pages Web avec h1 et section
Quelques notes sur la balise h1 avec HTML5
La réponse courte à la question « Combien de balises h1 dans une page Web HTML5 ? » est : « Autant que nécessaire ! » En gros, chaque fois que vous avez une nouvelle section, vous pouvez mettre un h1. D’une manière générale, h1 accompagnera article, aside, nav ou section avec brio ! (cf. Sectioning content). Allons voir ce que nous disent les spécifications HTM5 sur l’emploi des balises de titre h1 — h6, notamment les exemples concernant les niveaux de titre. Ils sont assez parlant bien que parfois déroutant lorsqu’on a l’habitude du balisage utilisé jusqu’à présent. Les éléments h1 — h6 représentent les niveaux d’en-têtes de leurs sections respectives. Quant à l’élément hgroup, il regroupe un ensemble d’en-têtes composé d’au moins deux niveaux de titre, comme un titre et son sous-titre ou un titre et le slogan associé (un bon candidat pour Logo et Motto, faute de mieux). Voulez-vous en savoir plus ?
HTML5 — Repenser le découpage des pages web et des contenus
Derrière les nouvelles balises proposées par HTML5 se cache un nouveau modèle de structuration. Jusqu’à présent, on rencontre souvent la structure suivante : un niveau de titre h1 pour le nom du site et ça continue avec h2 pour le titre des articles ; reste h3 — h6 pour structurer la prose, ce qui est suffisant ou pas. HTML5 introduit la notion de Sectioning Content (cf. le concept d’outline) de manière explicite avec les balises section, nav, article et aside ou de manière implicite a chaque utilisation d’un niveau de titre h1. Voulez-vous en savoir plus ?
HTML5 — Et si on évitait la balise «section» dans une balise «article» ?
Ce billet fait partie d’une série de notes rapides prises lors de ma lecture des spécifications HTML5. Aujourd’hui, c’est le commentaire de Romy qui me donne l’occasion de rebondir sur le découpage d’une page web avec HTML5 et plus particulièrement la balise section. Dans ce billet, je m’éloigne un peu du commentaire de Romy et je voudrais souligner qu’elle a parfaitement raison quand elle dit que le rôle des balises header et footer est clair mais que leur traduction en En-tête et Pied de page prête à confusion ; il faudrait peut-être introduire la notion de meta information. Voulez-vous en savoir plus ?