ARIA
Les infobulles ont besoin de contenu
- Règle:
aria-tooltip-name - Gravité: Sérieux
- Niveau WCAG A
Pourquoi c’est important
Un élément avec role="tooltip" et sans texte ne produit rien quand le composant qu’il décrit reçoit le focus : l’explication est perdue.
Comment corriger
- Placez le texte explicatif dans l’élément d’infobulle.
- Référencez-le depuis le composant avec aria-describedby.
- Ne mettez jamais dans une infobulle une information disponible nulle part ailleurs : les infobulles sont peu fiables sur écran tactile.
Dans le balisage
<div role="tooltip" id="tip"></div><div role="tooltip" id="tip">Opens in a new window</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 :
- 4.1.2 Nom, rôle et valeur (s’ouvre dans un nouvel onglet) — Niveau WCAG A
Pour aller plus loin
Deque University sur aria-tooltip-name (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.