Accueil › Ressources › Critère WCAG

Étiquetage des formulaires selon les WCAG

Chaque champ de formulaire doit avoir une étiquette associée par programmation, pour que les utilisateurs de lecteurs d'écran sachent quoi saisir et pour que le clic sur l'étiquette place le focus dans le champ.

La bonne méthode

<label for="email">E-mail</label><input id="email"> — ou englober le champ dans le <label>. aria-label / aria-labelledby seulement s'il est impossible d'avoir une étiquette visible.

Pourquoi un placeholder ne suffit pas

Le placeholder disparaît à la saisie, a souvent un contraste trop faible et n'est pas reconnu comme étiquette par certains lecteurs d'écran.

Messages d'erreur

Relier l'erreur au champ (aria-describedby) et formuler le texte concrètement (« Veuillez saisir un e-mail valide », pas « Erreur »).

Comment a11yglass aide

Le scan gratuit vérifie le HTML et le CSS livrés à la recherche d'infractions WCAG détectables automatiquement et indique pour chaque constat le critère de succès et une mesure concrète. Il détecte environ 20 à 35 % des problèmes et ne remplace pas un audit complet.

À lire aussi

• Textes alternatifs selon WCAG 1.1.1
• Navigation au clavier selon WCAG 2.1.1
• Focus visible selon WCAG 2.4.7

Information générale donnée de bonne foi, sans valeur de conseil juridique. Pour un cas particulier, consulter un cabinet spécialisé en droit du numérique.