Listes déroulantes sans libellé

Un <select> sans étiquette ne dit pas ce qu'on choisit : « France, Belgique, Suisse » sans titre ne veut rien dire pour un lecteur d'écran.

Qui est concerné

• Personnes aveugles ou malvoyantes
• Personnes avec troubles de l'attention, qui perdent le contexte de la liste

Pourquoi c'est important

Comme les champs texte, les listes déroulantes ont besoin d'un libellé lié. Le critère 4.1.2 (niveau A) exige que chaque composant de formulaire expose un nom. Sans cela, l'utilisateur entend une suite d'options sans savoir à quoi elles répondent.

Comment le tester vous-même

1. Chaque <select> doit avoir un <label for> ou un aria-label.
2. Au lecteur d'écran, la liste doit être annoncée avec son intitulé puis l'option sélectionnée.

Comment corriger

Associez une étiquette à chaque <select> (via <label> ou aria-label).

<select name="pays">
  <option>France</option>
  <option>Belgique</option>
</select>

<label for="pays">Pays de livraison</label>
<select id="pays" name="pays">
  <option>France</option>
  <option>Belgique</option>
</select>

Critères de référence

Plainpied détecte ce défaut automatiquement et le localise page par page. La conformité totale combine détection automatique et vérifications humaines : voir notre méthode.