← Toutes les règles

ARIA

Certains rôles exigent un parent précis

• Règle: aria-required-parent
• Gravité: Critique
• Niveau WCAG A

Pourquoi c’est important

Un role="tab" hors d’une liste d’onglets, ou un listitem hors d’une liste, n’a aucun contexte. La technologie d’assistance ne peut pas dire « onglet 2 sur 5 » puisqu’elle ignore à quoi l’élément appartient.

Comment corriger

1. Enveloppez les enfants dans un élément portant le rôle parent exigé par la spécification.
2. Gardez la relation directe : un div intercalé a besoin de role="presentation".
3. Si ce parent n’existe pas dans la maquette, c’est le rôle de l’enfant qui est faux.

Dans le balisage

<div>
  <button role="tab">Overview</button>
</div>

<div role="tablist">
  <button role="tab" aria-selected="true">Overview</button>
</div>

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 aria-required-parent (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.