Scan gratuit

Corriger « Rôle ARIA invalide » en HTML

Pourquoi c'est un problème

Un rôle qui n'existe pas dans la spécification (faute de frappe, rôle inventé, rôle abstrait) est ignoré ou mal interprété. L'élément perd la sémantique qu'on croyait lui donner : un « bouton » n'est plus annoncé comme bouton.

Comment corriger — HTML

Utilisez un rôle défini par WAI-ARIA et non abstrait (button, dialog, tab, navigation…). Mieux : préférez l'élément HTML natif correspondant, qui porte le rôle et le comportement clavier sans rien ajouter.

À éviter
<div role="buton" tabindex="0">Envoyer</div>
<nav role="landmark">…</nav>
Correct
<!-- L'élément natif : rôle, focus et clavier inclus -->
<button type="submit">Envoyer</button>
<nav aria-label="Navigation principale">…</nav>

Vérifiez votre site en 30 secondes

Conformly détecte ce type de problème sur toutes vos pages, en continu, et vous alerte à chaque régression.

Scan gratuit

Autres corrections