Rôle de présentation sur un élément interactif

Silktide recherche les éléments interactifs, comme les boutons, les liens et les champs de formulaire, qui ont été marqués comme purement décoratifs. Marquer un élément interactif de cette façon lui retire sa signification pour les technologies d’assistance tout en le laissant cliquable à l’écran.

<!-- Problème : le bouton fonctionne toujours, mais est annoncé comme n’ayant aucun contenu -->
<button role="presentation">Supprimer</button>

<!-- Correctif : retirez le rôle -->
<button>Supprimer</button>

Pourquoi c’est important

Les rôles presentation et none indiquent aux qu’un élément n’a aucune signification — ils servent à retirer la sémantique d’éléments comme les tableaux de mise en page. Appliqués à un élément interactif, ils créent le pire type d’obstacle : un contrôle que les utilisateurs voyants cliquent à la souris tous les jours, mais qu’un présente comme du contenu inerte ou ignore complètement. L’utilisateur n’a aucun moyen de savoir qu’un bouton se trouve là.

Comment corriger

Supprimez le role=\"presentation\" ou role=\"none\" de l’élément interactif. Les éléments natifs exposent déjà la bonne signification sans aucun rôle.
S’il ne doit vraiment pas être interactif, rendez-le non interactif : remplacez-le par un élément non interactif comme <div>, et retirez tout tabindex.
Si vous cherchiez à supprimer la signification d’un conteneur (par exemple, un tableau de mise en page autour des contrôles), appliquez le rôle au conteneur, pas aux contrôles à l’intérieur.

Comment Silktide teste cela

Repérer chaque élément de la page avec role=\"presentation\" ou role=\"none\".
Déterminer si l’élément est interactif : un bouton, un lien ou une zone de carte d’image avec un href, un champ de formulaire, ou tout élément placé dans l’ordre de tabulation au clavier avec un tabindex de 0 ou plus.
Signaler chaque élément interactif qui porte un rôle de présentation.

Les éléments retirés de l’ordre de tabulation avec un tabindex négatif ne sont pas signalés, pas plus que les éléments décoratifs tels que les images ou les graphiques SVG.

Dépannage

Un cadriciel ou une bibliothèque a ajouté le rôle

Certaines bibliothèques d’interface appliquent role=\"presentation\" à des conteneurs internes, et parfois au mauvais élément. Inspectez l’élément signalé : s’il est réellement actionnable à la souris mais muet pour les technologies d’assistance, la correction se trouve dans votre utilisation de la bibliothèque ou en amont.

Ce contrôle ne signale rien alors que je m’attends à des détections

Les tests ARIA peuvent être désactivés pour chaque site Web. Vérifiez les paramètres avancés du site Web.