<hgroup>
Associer un titre à son sous-titre sans casser la hiérarchie
<hgroup> — Le groupe de titres
La balise <hgroup> associe un titre (<h1>-<h6>) à un sous-titre ou un slogan (<p>). Elle signale que les deux forment un seul bloc de titre, pas deux contenus distincts.
Quand l'utiliser
Tu veux afficher un titre suivi d'un sous-titre, d'un slogan ou d'une accroche. Par exemple, le titre d'un article accompagné d'une phrase d'introduction.
Ce que tu gagnes
Accessibilité : sans <hgroup>, un sous-titre dans un <p> est annoncé comme un paragraphe orphelin entre le titre et le contenu. Avec <hgroup>, les technologies d'assistance savent que le <p> fait partie du bloc de titre. Le support varie encore selon les lecteurs d'écran (NVDA, JAWS, VoiceOver, TalkBack) : teste avant de compter dessus.
Exemple de code
<hgroup>
<h1>Accessible forms</h1>
<p>A practical guide to labels, errors, and focus management</p>
</hgroup>Pour aller plus loin
- Les lecteurs d'écran ne lisent pas comme toi — comprendre comment les AT interprètent les titres
- WHATWG —
<hgroup> - W3C — HTML spec
- MDN —
<hgroup>