English

<hgroup>

Associer un titre à son sous-titre sans casser la hiérarchie

  • HTML
  • accessibilité
  • sémantique
  • structure

<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