A un rôle d'accessibilité valide

ID de règle : has-valid-accessibility-role

WCAG 2.0 (A) 4.1.2

accessibilityRole communique le but d’un composant à l’utilisateur de la technologie d’assistance.

accessibilityRole peut être l'un des suivants :

• réglable Utilisé lorsqu'un élément peut être « ajusté » (par exemple un slider).
• alerte Utilisé lorsqu'un élément contient un texte important à présenter à l'utilisateur.
• bouton Utilisé lorsque l'élément doit être traité comme un bouton.
• case à cocher Utilisé lorsqu'un élément représente une case à cocher qui peut être cochée, décochée ou avoir un état coché mixte.
• boîte combinée Utilisé lorsqu'un élément représente une zone de liste déroulante, qui permet à l'utilisateur de sélectionner parmi plusieurs choix.
• en-tête Utilisé lorsqu'un élément agit comme en-tête pour une section de contenu (par exemple, le titre d'une barre de navigation).
• image Utilisé lorsque l'élément doit être traité comme une image. Peut être combiné avec un bouton ou un lien.
• bouton-image Utilisé lorsque l'élément doit être traité comme un bouton et est également une image.
• touche de clavier Utilisé lorsque l'élément agit comme une touche du clavier.
• lien Utilisé lorsque l'élément doit être traité comme un lien.
• menu Utilisé lorsque le composant est un menu de choix.
• menubar Utilisé lorsqu'un composant est un conteneur de plusieurs menus.
• menuitem Utilisé pour représenter un élément dans un menu.
• aucun Utilisé lorsque l'élément n'a aucun rôle.
• barre de progression Utilisé pour représenter un composant qui indique la progression d'une tâche.
• bouton radio Utilisé pour représenter un bouton radio.
• groupe de boutons radio Utilisé pour représenter un groupe de boutons radio.
• barre de défilement Utilisé pour représenter une barre de défilement.
• recherche Utilisé lorsqu'un élément de champ de texte doit également être traité comme un champ de recherche.
• bouton rotatif Utilisé pour représenter un bouton qui ouvre une liste de choix.
• résumé Utilisé lorsqu'un élément peut être utilisé pour fournir un résumé rapide des conditions actuelles de l'application lorsque l'application est lancée pour la première fois.
• interrupteur Utilisé pour représenter un interrupteur qui peut être activé et désactivé.
• onglet Utilisé pour représenter un onglet.
• liste d'onglets Utilisé pour représenter une liste d'onglets.
• texte Utilisé lorsque l'élément doit être traité comme un texte statique qui ne peut pas changer.
• timer Utilisé pour représenter un timer.
• togglebutton Utilisé pour représenter un bouton à bascule. Doit être utilisé avec l'option accessibilityState cochée pour indiquer si le bouton est activé ou désactivé.
• barre d'outils Utilisée pour représenter une barre d'outils (un conteneur de boutons d'action ou de composants).
• grid Utilisé avec ScrollView, VirtualizedList, FlatList ou SectionList pour représenter une grille. Ajoute les annonces d'entrée/sortie de grille à GridView d'Android.

Pourquoi c'est important

Les éléments auxquels sont attribuées des valeurs de rôle non valides ne sont pas interprétés par la technologie d'assistance comme prévu par le développeur.

Lorsque les lecteurs d’écran et autres technologies d’assistance ne connaissent pas le rôle de chaque élément, ils ne sont pas en mesure d’interagir avec lui de manière intelligente, ni de communiquer le rôle à l’utilisateur. Les caractéristiques, propriétés et méthodes de transmission d'informations vers et/ou depuis l'utilisateur d'un élément ne peuvent pas être communiquées via des technologies d'assistance lorsqu'une valeur de rôle n'est pas valide.

Comment résoudre le problème

Assurez-vous que accessibilityRole la valeur est un rôle valide.

Exemples de réussite

<TouchableOpacity accessibilityRole="button">
  <Text>Increase Count</Text>
</TouchableOpacity>

Exemples d'échecs

<TouchableOpacity accessibilityRole="secondary-button">
  <Text>Increase Count</Text>
</TouchableOpacity>

Ressources

• Rôle d'accessibilité React Native