Remédiation du scanner d'accessibilité

Votre équipe utilise-t-elle le scanner d’accessibilité Android de Google ?

Cette section fournira des conseils de correction pour les règles vérifiées par le scanner. En savoir plus sur l’utilisation de Scanner d'accessibilité et axe DevTools Mobile.

Consultez les directives de Google Accessibility Scanner pour obtenir la liste complète des vérifications, descriptions et mises à jour actuelles.

Étiquetage du contenu

Étiquette d'article manquante

Il se peut que le contenu de la vue manque d'informations contextuelles.

Pour toute vue fournissant des informations à l'utilisateur, fournissez l'un des éléments suivants pour résoudre ce problème d'accessibilité :

• android:contentDescription : Dans la plupart des cas, l'ajout d'une description de contenu est tout ce qui est nécessaire.
• android:hint : Des indices peuvent être ajoutés pour décrire le type de données que l'utilisateur doit saisir pour les vues de texte modifiables.
• android:labelFor : Cette balise vous permettra d'attribuer une vue comme étiquette pour une autre vue.

Images décoratives

Les images décoratives qui ne fournissent pas d’informations importantes peuvent être marquées comme non importantes pour l’accessibilité.

Pour XML : android:importantForAccessibility="no"

Ou pour Composer :

Image(
      imageVector = Icons.Filled.AccountCircle,
      contentDescription = null // decorative
    )

Article étiqueté avec le type ou l'état

L’une de vos vues peut avoir un état redondant. Android fournit des vues par défaut avec des états tels que activé, désactivé, coché ou décoché. L’ajout d’un état à l'annonce vocale peut entraîner une expérience déroutante.

Pour résoudre ce problème d’accessibilité, assurez-vous :

• Les cases à cocher ont une étiquette associée pour le contexte
• Les descriptions d'état ne sont pas ajoutées à la description de la vue

<TextView
      android:id="@+id/edit_text_label"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:labelFor="@+id/example"
      android:text="Check Label" />

<androidx.appcompat.widget.AppCompatCheckBox
      android:id="@+id/example"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:text="@string/with_text"/>

Descriptions d'articles en double

Il a été constaté que plusieurs vues au sein de la hiérarchie avaient des descriptions identiques.

Il ne s’agit pas d’un échec WCAG et il peut y avoir des cas où cela constitue une exigence. Si les descriptions de contenu sont dupliquées, assurez-vous que chacune fournit suffisamment de contexte pour permettre à l'utilisateur de savoir quel serait le résultat de l'interaction avec la vue.

Objectif du lien incertain

Tout lien doit contenir suffisamment de texte pour transmettre son objectif. Lorsque vous utilisez des descriptions telles que « Cliquez ici », vous devez vous assurer que le texte environnant contient suffisamment d'informations pour déchiffrer l'objectif du lien.

Mise en œuvre - Éléments cliquables

Liens cliquables

Les liens doivent être clairement affichés et facilement accessibles depuis le menu contextuel local. Google suggère d'utiliser URLSpan ou la classe de commodité Linkify pour afficher des hyperliens dans l'interface utilisateur d'une application afin d'augmenter la probabilité que ces liens soient détectés et activés.

Vues cliquables en double

L’un des éléments cliquables de votre vue chevauche un autre élément cliquable. Vous pouvez résoudre ce problème d’accessibilité de l’une des manières suivantes :

• Déplacer les éléments cliquables afin qu'ils n'entrent pas en collision ou ne se chevauchent pas.
• Si les vues ne peuvent pas être déplacées, assurez-vous que les deux vues disposent d'une zone de clic de taille appropriée et que tout le monde peut interagir avec les éléments sans problème.

Étiquette d'élément modifiable

Les champs modifiables doivent avoir une étiquette décrivant le but du champ.

Un exemple avec EditText :

<TextView
      android:id="@+id/edit_text_label"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:labelFor="@+id/edit_text"
      android:text="Enter your username" />

<EditText
      android:id="@+id/edit_text"
      android:layout_width="0dp"
      android:layout_height="wrap_content"
      android:hint="Hint" />

Un exemple avec CheckBox :

Utilisez un(e) TextView et associez-le à l'élément CheckBox :

val checkBox: CheckBox = ....... // Role: CheckBox
val label: TextView = ....... // Role: Label
label.setLabelFor(checkBox.getId()) // Associate the Checkbox with its Name

Type d'élément non pris en charge

Il semblerait que vous ayez une vue personnalisée. Modifiez le/la AccessibilityNodeInfo pour fournir au className un objectif approprié pour la vue.

val frameLayout = findViewById<FrameLayout>(R.id.custom_view)
frameLayout.setAccessibilityDelegate(object : View.AccessibilityDelegate() {
      override fun onInitializeAccessibilityNodeInfo(
          host: View,
          info: AccessibilityNodeInfo
      ) {
            info.className = "ClassName"
            info.contentDescription = "ContentDescription"
            super.onInitializeAccessibilityNodeInfo(host, info)           
      }
})

Ordre de traversée

Si vous pouvez naviguer dans vos vues à l'aide de TalkBack d'une manière qui a du sens contextuel, cela peut être un faux positif et n'a pas besoin d'être traité.

Si TalkBack ne fournit pas les mêmes informations que la lecture de l'application sans technologie d'assistance, vous pouvez envisager de modifier l'ordre des vues. Comme cela peut être difficile à réaliser et peut également impliquer l'ajout accidentel d'une boucle infinie, nous vous déconseillons de modifier l'ordre de navigation. Pour modifier l'ordre de parcours, utilisez android:accessibilityTraversalBefore et android:accessibilityTraversalAfter.

Mise à l'échelle du texte

Tous les éléments de texte doivent utiliser des pixels à l'échelle (sp) plutôt que des pixels indépendants de la densité (dp) pour permettre au texte de s'adapter au paramètre d'accessibilité de la taille de police de l'appareil.

Taille de la cible tactile

Pour obtenir des recommandations et des conseils de correction pour les zones visuelles et tactiles des contrôles actifs, reportez-vous à la Règle de taille de la cible tactile pour notre bibliothèque Android.

Faible contraste

Le contraste des couleurs entre le texte et son arrière-plan doit respecter les seuils de ratio minimum WCAG 2 AA. Apprenez-en plus sur ce ratio et trouvez des conseils de correction pour un faible contraste sous la Règle de contraste des couleurs pour notre bibliothèque Android.