Test 11.10.1
Les indications du caractère obligatoire de la saisie des champs vérifient-elles une de ces conditions (hors cas particuliers) ?
Une indication de champ obligatoire est visible et permet d’identifier nommément le champ concerné préalablement à la validation du formulaire ;
Le champ obligatoire dispose de l’attribut aria-required="true" ou required préalablement à la validation du formulaire.
Méthodologie 11.10.1
- Retrouver dans le document les champs de formulaire obligatoires ;
- Pour chaque champ de formulaire, vérifier que préalablement à la validation du formulaire :
- Soit une indication de champ obligatoire est visible et permet d’identifier nommément le champ concerné ;
- Soit le champ possède un attribut
aria-required="true"ourequired.
- Si c’est le cas pour chaque champ de formulaire obligatoire, le test est validé.
Tests suivants et précédents au clavier
Test précédent : Maj + ←
Test suivant : Maj + →
Éléments et attributs
aria-required='true' required Note technique du critère 11.10
Dans un long formulaire dont la majorité des champs sont obligatoires, on pourrait constater que ce sont les quelques champs restés facultatifs qui sont explicitement signalés comme tels. Dans ce cas, il faudrait s’assurer que :
- Un message précise visuellement en haut de formulaire que “tous les champs sont obligatoires sauf ceux indiqués comme étant facultatifs” ;
- Une mention “facultatif” est présente visuellement dans le libellé des champs facultatifs ou dans la légende d’un groupe de champs facultatifs ;
- Un attribut
requiredouaria-required="true"reste associé à chaque champ qui n’est pas concerné par ce caractère facultatif.
Cas particuliers du critère 11.10
Le test 11.10.1 et le test 11.10.2 seront considérés comme non applicables lorsque le formulaire comporte un seul champ de formulaire ou qu’il indique les champs optionnels de manière :
- Visible ;
- Dans la balise
<label>ou dans la légende associée au champ.
Dans le cas où l’ensemble des champs d’un formulaire sont obligatoires, les tests 11.10.1 et 11.10.2 restent applicables.
Définitions
- Champ de saisie de formulaire
Objet d’un formulaire permettant à l’utilisateur :
- De saisir des données textuelles ou préformatées :
input type="text";input type="password";input type="search";input type="email";input type="number";input type="tel";input type="url";textarea.
- De sélectionner des valeurs prédéfinies :
input type="checkbox";input type="radio";input type="date";input type="range";input type="color";input type="time";input type="month";input type="week";input type="datetime-local";select;datalist;optgroup;option.
- De télécharger des fichiers :
input type="file".
- Ou d’afficher des résultats :
output;progress;meter.
- Les balises possédant un rôle WAI-ARIA permettant de restituer un champ de formulaire sont également couvertes par cette définition :
progressbar;slider;spinbutton;textbox;listbox;searchbox;combobox;option;checkbox;radio;switch.
- Les objets de formulaires et rôle WAI-ARIA suivants ne sont pas considérés comme des champs de formulaires :
input type="submit";input type="reset";input type="hidden";input type="image";input type="button";button;- attribut WAI-ARIA
role="button".
- De saisir des données textuelles ou préformatées :
- Contrôle de saisie (formulaire)
Ensemble des processus qui permettent de prévenir l’utilisateur des champs obligatoires, des indications de type ou de format attendus et des erreurs de saisie dans un formulaire. Ces contrôles de saisie peuvent être implémentés par l’auteur des contenus ou s’appuyer sur des attributs (comme
requiredoupattern), des attributs WAI-ARIA (commearia-required) ou des types de champ qui produisent de manière automatique des indications de saisie ou d’erreurs (comme les typesurl,email,date,timepar exemple).- Formulaire
Balise
<form>ou balise possédant un attribut WAI-ARIArole="form".- Indication de champ obligatoire
Indication textuelle ou graphique (icône) permettant à l’utilisateur de savoir que la saisie d’un champ est obligatoire préalablement à la saisie.
Note : Dans le cas où cette indication n’est pas réalisée de manière textuelle explicite (icône, “*”, “!”, etc.), l’explication de la signification de cette indication doit se situer, visuellement et dans l’ordre du code source, avant la première utilisation de l’indication.
- Légende
HTML propose un dispositif permettant de titrer les groupes de champs de même nature par l’intermédiaire des éléments
<fieldset>et<legend>.Il est également possible de créer des regroupements avec le rôle WAI-ARIA
groupet un passage de texte, faisant office de légende, lié par l’attribut WAI-ARIAaria-labelledbyou fourni par un attribut WAI-ARIAaria-label.Note 1 : Les regroupements de champs peuvent utiliser d’autres méthodes qui associent l’information du regroupement directement dans l’étiquette du champ. Par exemple, par l’intermédiaire d’un attribut
title, d’un attribut WAI-ARIAaria-label, d’une liaisonaria-labelledbyfaisant office d’étiquette ou encore par l’attribut WAI-ARIAaria-describedbyassociant un texte complémentaire. Dans ce cas, le regroupement de champs devient inutile puisque les labels sont suffisamment pertinents.Note 2 : Lorsque le formulaire est constitué d’un seul bloc d’informations de même nature (l’identité et l’adresse de l’utilisateur, par exemple) ou d’un champ unique (un moteur de recherche, par exemple), le regroupement des champs n’est pas obligatoire.