Cette traduction n’a pas encore été relue par la rédaction. La version allemande fait foi. Deutsche Fassung →

Barrierefreiheit

Pourquoi chaque champ de formulaire a-t-il besoin d'une étiquette ?

Chaque champ de formulaire a besoin d'une étiquette, sinon les visiteurs doivent deviner ce qui doit y aller. L'étiquette est en permanence visible à côté du champ — « Prénom », « Adresse e-mail », « Message » — et techniquement liée à celui-ci, de sorte que les lecteurs d'écran l'annoncent. Le texte d'exemple gris dans le champ ne suffit pas : il disparaît lors de la saisie. Le critère WCAG 3.3.2 exige des étiquettes ou des instructions pour chaque entrée.

Le texte d'exemple dans le champ ne remplace pas une étiquette

De nombreux formulaires modernes économisent les étiquettes visibles et écrivent à la place du texte d'exemple gris directement dans les champs. C'est visuellement épuré, mais crée trois problèmes. Premièrement : dès que le visiteur commence à taper, le texte disparaît — s'il a été brièvement distrait, il ne sait plus quel champ c'était avec un formulaire partiellement rempli. Deuxièmement : le texte gris est contrasté faiblement et difficile à lire pour les personnes malvoyantes. Troisièmement : sans lien technique, le lecteur d'écran n'annonce que « champ de saisie » lors de l'accès au champ — le visiteur aveugle ne sait jamais ce qui doit y aller. Une étiquette permanente au-dessus ou à côté du champ, techniquement liée à celui-ci, résout les trois problèmes à la fois.

Comment le service de contrôle mesure les étiquettes

Le service de contrôle compte tous les champs de saisie visibles de votre page dans un vrai navigateur et vérifie pour chacun s'il existe une étiquette techniquement liée — comme un label classique, une étiquette englobante ou un nom accessible dans le code source. Si tous les champs sont étiquetés, le critère est considéré comme respecté. Si ne serait-ce qu'un champ reste sans étiquette, le rapport signale une violation et nomme le nombre de champs affectés avec preuve. Un champ sans étiquette compte aussi contre le critère de robustesse 4.1.2, car le champ manque ainsi de son nom accessible. Que les étiquettes existantes soient formulées de manière pertinente est évalué au standard Or par une personne.

Beispiele

Platzhalter als einzige Beschriftung

Verstoß

<input type="text" placeholder="Nachname">

Erfüllt

<label for="nachname">Nachname</label>
<input id="nachname" type="text">

Der Platzhalter verschwindet beim Tippen. Ein label bleibt und ist für Vorleseprogramme der Name des Feldes.

Passez en revue chaque formulaire de votre site et vérifiez : existe-t-il une étiquette en permanence visible à chaque champ ?
Remplacez les solutions texte d'exemple par de vraies étiquettes au-dessus du champ — le texte d'exemple peut suppléer en plus.
Demandez à votre agence de lier techniquement chaque étiquette à son champ, de sorte que les lecteurs d'écran l'annoncent.
Complétez les champs avec des spécifications de format avec une instruction visible, par exemple « Date au format JJ.MM.AAAA », avant la saisie.
Remplissez à moitié un formulaire et vérifiez si vous pouvez ensuite toujours attribuer chaque champ.

Deutsche Fassung dieser Seite

FAQ

Le texte d'espace réservé dans le champ de saisie suffit-il comme étiquette ?

Le texte d'espace réservé ne répond pas au critère 3.3.2 comme seule étiquette. Il disparaît dès que le visiteur tape, est souvent trop contrasté et est traité de manière inégale par les lecteurs d'écran. L'étiquette doit être en permanence visible à côté du champ et techniquement liée à celui-ci. Le texte d'espace réservé peut suppléer — par exemple avec une valeur d'exemple — mais ne doit jamais remplacer.

Qu'est-ce qu'une étiquette techniquement liée ?

Techniquement liée signifie : dans le code source, il est spécifié quelle étiquette appartient à quel champ — généralement via un élément Label qui se rapporte au champ. Ce n'est qu'alors qu'un lecteur d'écran peut annoncer le bon nom lors de l'accès au champ. Un texte qui se tient uniquement optiquement à côté du champ reste non attribué pour les visiteurs aveugles.

Comment le service de contrôle teste-t-il les étiquettes de champ manquantes ?

Le noyau de mesure compte tous les champs de saisie visibles de la page et en vérifie chacun pour une étiquette techniquement liée. Si tous les champs sont équipés, le critère est considéré comme respecté ; chaque champ sans étiquette mène à la violation, que le rapport signale avec le nombre et la preuve. Un champ sans étiquette compte également contre le critère 4.1.2, car le champ manque du nom accessible.