7.8. Organize the items of dropdown lists logically

When dropdown lists are used, the items listed should be organized logically.

The logical order depends on the context, but it may be:

Tip

Une bonne pratique d’accessibilité consiste à ne pas préfixer le contenu de la balise <option> element with decorative characters (dashes, stars, space, etc.).

This will allow the user direct access to a desired value or group of values by simply pressing a key on the keyboard (pressing the I key to reach the country “Italy”, for example).

<select>
   <option>--Belgium</option>
   <option>--France</option>
   <option>--Germany</option>
   <option>--Italy</option>
   <option>--Spain</option>
</select>

Should be replaced by:

<select>
   <option>Belgium</option>
   <option>France</option>
   <option>Germany</option>
   <option>Italy</option>
   <option>Spain</option>
</select>

Comments

Add a comment

Required fields are marked *.

Back to top