Critère 11.1 Chaque champ de formulaire a-t-il une étiquette ?

Texte officiel du RGAA 4.1.2. Voir aussi le critère 11.1 sur accessibilite.numerique.gouv.fr.

Tests

Test 11.1.1

Chaque champ de formulaire vérifie-t-il une de ces conditions ?

Le champ de formulaire possède un attribut WAI-ARIA aria-labelledby référençant un passage de texte identifié ;
Le champ de formulaire possède un attribut WAI-ARIA aria-label ;
Une balise <label> ayant un attribut for est associée au champ de formulaire ;
Le champ de formulaire possède un attribut title ;
Un bouton adjacent au champ de formulaire lui fournit une étiquette visible et un élément <label> visuellement caché ou un attribut WAI-ARIA aria-label, aria-labelledby ou title lui fournit un nom accessible.

Méthodologie du test 11.1.1

Retrouver dans le document les champs de formulaire ;
Pour chaque champ de formulaire, vérifier que le champ de formulaire :
- Possède un attribut WAI-ARIA aria-labelledby référençant un passage de texte identifié ;
- Possède un attribut WAI-ARIA aria-label ;
- Est associé à un élément <label> ayant un attribut for ;
- Possède un attribut title ;
- Un bouton adjacent au champ de formulaire lui fournit une étiquette visible et un élément <label> visuellement caché ou un attribut WAI-ARIA aria-label, aria-labelledby ou title lui fournit un nom accessible.
Si c’est le cas pour champ de formulaire, le test est validé.

Test 11.1.2

Chaque champ de formulaire associé à une balise <label> ayant un attribut for, vérifie-t-il ces conditions ?

Le champ de formulaire possède un attribut id ;
La valeur de l’attribut for est égale à la valeur de l’attribut id du champ de formulaire associé.

Méthodologie du test 11.1.2

Retrouver dans le document les champs de formulaire associé à un élément <label> ;
Pour chaque champ de formulaire, vérifier que :
- Le champ de formulaire possède un attribut id ;
- La valeur de l’attribut for de l’élément <label> est égale à la valeur de l’attribut id.
Si c’est le cas pour champ de formulaire, le test est validé.

Test 11.1.3

Chaque champ de formulaire ayant une étiquette dont le contenu n’est pas visible ou à proximité (masqué, aria-label) ou qui n’est pas accolé au champ (aria-labelledby), vérifie-t-il une de ses conditions ?

Le champ de formulaire possède un attribut title dont le contenu permet de comprendre la nature de la saisie attendue ;
Le champ de formulaire est accompagné d’un passage de texte accolé au champ qui devient visible à la prise de focus permettant de comprendre la nature de la saisie attendue ;
Le champ de formulaire est accompagné d’un passage de texte visible accolé au champ permettant de comprendre la nature de la saisie attendue.

Méthodologie du test 11.1.3

Retrouver dans le document les champs de formulaire dont l’étiquette n’est pas visible ou à proximité (masquée, utilisation de l’attribut aria-label) ou n’est pas accolée au champ (utilisation de l’attribut aria-labelledby) ;
Pour chaque champ de formulaire, vérifier que le champ de formulaire :
- soit possède un attribut title dont le contenu permet de comprendre la nature de la saisie attendue ;
- est accompagné d’un passage de texte accolé au champ qui devient visible à la prise de focus permettant de comprendre la nature de la saisie attendue ;
- est accompagné d’un passage de texte visible accolé au champ permettant de comprendre la nature de la saisie attendue.

Références WCAG 2.1

1.3.1 Info and Relationships (niveau A)
2.4.6 Headings and Labels (niveau AA)
3.3.2 Labels or Instructions (niveau A)
4.1.2 Name, Role, Value (niveau A)

Techniques WCAG : G82, G131, H44, H65, F68, F82, F86, ARIA6, ARIA9, ARIA14, ARIA16

Ce que l’audit automatique peut détecter

Règles qui vérifient directement ce critère

Ces règles d’axe-core 4.14.0 citent un test de ce critère. Elles repèrent une partie des erreurs ; le reste du critère demande une vérification humaine.

aria-input-field-name : Ensure every ARIA input field has an accessible nameTest 11.1.1.
aria-meter-name : Ensure every ARIA meter node has an accessible nameTest 11.1.1.
aria-progressbar-name : Ensure every ARIA progressbar node has an accessible nameTest 11.1.1.
label : Ensure every form element has a labelTest 11.1.1.
select-name : Ensure select element has an accessible nameTest 11.1.1.

Règles liées indirectement (via WCAG 4.1.2) — signal faible

Ces règles ne citent aucun test de ce critère : elles vérifient un critère WCAG qu’il partage avec d’autres critères RGAA. Une erreur qu’elles signalent peut relever d’un autre critère, et leur silence ne prouve rien ici.

aria-braille-equivalent : Ensure aria-braillelabel and aria-brailleroledescription have a non-braille equivalentVia WCAG 4.1.2.
aria-tooltip-name : Ensure every ARIA tooltip node has an accessible nameVia WCAG 4.1.2.
summary-name : Ensure summary elements have discernible textVia WCAG 4.1.2.

Source : RGAA 4.1.2 (WCAG 2.1), © DINUM, publié dans le dépôt DISIC/accessibilite.numerique.gouv.fr (commit ca4019f), sous Licence Ouverte 2.0. Texte officiel reproduit sans modification de contenu ; certains attributs de mise en forme (liens ouverts dans une nouvelle fenêtre, lien mort) sont retirés. Seuls les encadrés « Explication Rampe — non normative » sont rédigés par Rampe.