Scan gratuit

Corriger « Élément focusable masqué par aria-hidden » en HTML

Pourquoi c'est un problème

aria-hidden retire un élément de ce que perçoit un lecteur d'écran, mais pas du parcours clavier. La tabulation s'arrête donc sur un élément que l'utilisateur ne peut ni voir annoncé ni identifier : un « trou » silencieux dans la navigation.

Comment corriger — HTML

Ne masquez jamais un élément qui reste focusable. Si le contenu doit vraiment disparaître, retirez-le aussi du parcours clavier (tabindex="-1" sur chaque élément focusable, ou l'attribut inert sur le conteneur). S'il doit rester utilisable, retirez aria-hidden.

À éviter
<div class="carrousel-slide" aria-hidden="true">
  <a href="/offre">Découvrir l'offre</a>
</div>
Correct
<!-- Diapositive inactive : masquée ET hors du parcours clavier -->
<div class="carrousel-slide" aria-hidden="true" inert>
  <a href="/offre">Découvrir l'offre</a>
</div>

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