Structure

Les listes de définitions exigent les bons enfants

Règle: definition-list
Gravité: Sérieux
Niveau WCAG A

Pourquoi c’est important

Une <dl> dont les enfants ne sont pas des paires <dt>/<dd> perd la relation terme-définition : un lecteur d’écran lit une suite de textes sans étiquette au lieu d’un glossaire.

Comment corriger

Ne placez directement dans la <dl> que <dt>, <dd>, <div>, <script> et <template>.
Groupez un terme et ses définitions dans un simple <div> si vous avez besoin d’un point d’accroche pour le style.
Utilisez une <ul> quand le contenu n’est pas réellement de type terme-définition.

Dans le balisage

Échoue

<dl>
  <div>Term</div>
  <p>Definition</p>
</dl>

Réussit

<dl>
  <dt>Term</dt>
  <dd>Definition</dd>
</dl>

L’exigence sous-jacente

Cette règle est une manière d’échouer aux critères de succès WCAG 2.2 suivants. Le W3C, qui rédige la norme, explique chacun d’eux :

1.3.1 Information et relations (s’ouvre dans un nouvel onglet) — Niveau WCAG A

Pour aller plus loin

Deque University sur definition-list (s’ouvre dans un nouvel onglet)

Deque développe axe-core, le moteur open source utilisé par notre scanner. Sa page documente la règle telle que le moteur l’implémente.

Les contrôles automatiques trouvent les défaillances qu’un navigateur peut prouver. Ils ne peuvent pas juger si un sous-titrage est fidèle, si une alternative textuelle est utile, ni si une page s’utilise de bout en bout au clavier : cela demande une personne.