Critère 11.4
Étiquette accolée
Chaque étiquette de champ et son champ associé doivent être accolés visuellement.
En Bref : L'essentiel à retenir
- L'objectif est de faciliter l'association visuelle des étiquettes aux champs correspondants, notamment pour les utilisateurs de loupes d'écran.
- Pour les champs texte, les étiquettes doivent être placées au-dessus ou à gauche du champ.
- Pour les cases à cocher et boutons radio, les étiquettes doivent être à droite du champ.
- La proximité visuelle est essentielle et peut être assurée avec du CSS pour éviter toute ambiguïté.
Objectif
Permettre d'associer visuellement et rapidement l'étiquette à son champ, notamment pour les utilisateurs de loupes d'écran.
Solution Technique
1. Positionnement standard
- Champs texte : L'étiquette doit être au-dessus ou à gauche du champ.
- Cases à cocher / Boutons radio : L'étiquette doit être à droite du champ (ou au-dessus).
2. Proximité visuelle
Utilisez CSS pour garantir que l'étiquette est proche du champ et qu'il n'y a pas d'ambiguïté sur quel champ elle désigne.
label {
display: block;
margin-bottom: 0.5rem; /* Espace réduit entre label et champ */
}