Formulaire
Avoir des champs de formulaires explicites #
Cible : tout le monde et en particulier les personnes déficientes visuelles.
Quand : lors de la conception et lors du développement.
Description :
Lier les champs de formulaires avec leurs labels apporte une vocalisation supplémentaire qui permet à l’utilisateur de comprendre ce qu'il faut remplir lorsqu’il arrive sur un champ de formulaire.
Il existe 2 grandes techniques pour réaliser cette liaison :
labelFor
: permet de spécifier à une vue qu’elle est le label d’une autre vue. Cette méthode prend en paramètre l’id
de la vue que l’on labellise. On peut utiliser cette méthode avec quasiment tout type de champ de formulaire. Utilisable depuis le xmlandroid:labelFor
ou le codesetLabelFor
.hint
: permet d’ajouter un texte d’exemple quand le champ de texte est vide. Cette méthode ne marche que pour lesTextView
. Prend en paramètre l’id
d’une chaîne de caractère. Utilisable depuis le xmlandroid:hint
ou le codesetHint
.
De plus, il est essentiel d'indiquer à l'utilisateur, pour une bonne compréhension du formulaire, les différents champs obligatoires, le format attendu, ou encore les erreurs commises sur de potentiels champs.
À vérifier :
- Les champs de formulaire doivent être liés à un label si celui-ci est visible, sinon un
hint
est présent. - Les champs obligatoires sont identifiables
- Le format de données des champs "complexe" est indiqué à l'utilisateur
Exemple
Remarque : il est très fréquent, une fois le label lié à son champ, de masquer le label à l’accessibilité. En effet, celui ci n’a plus besoin d’être reconnu par l’API d’accessibilité car son champ de formulaire l’utilise déjà (et sera donc restitué vocalement par TalkBack par exemple).
<EditText
android:id="@+id/addressLine2"
android:hint="@string/aptSuiteBuilding" ... />
<TextView
android:id="@+id/usernameLabel" ...
android:text="@string/username"
android:importantForAccessibility="no"
android:labelFor="@+id/usernameEntry" />
<EditText
android:id="@+id/usernameEntry" ... />
Référence WCAG :