8.1. Baliser les listes non ordonnées avec <ul> et <li>

Utiliser les balises <ul> et <li> pour baliser les listes d’éléments pour lesquelles l’ordre n’a pas d’importance (menus, onglets, boutons de partage, plan du site, etc.).

Le cas échéant, veiller à la bonne imbrication des listes :

<ul>
   <li>Premier item de premier niveau</li>
   <li>
      Deuxième item de premier niveau
      <ul>
         <li>Premier item de deuxième niveau</li>
         <li>Deuxième item de deuxième niveau</li>
      </ul>
   </li>
   <li>Troisième item de premier niveau</li>
</ul>

Quels bénéfices ?

La structuration des listes est essentielle pour les personnes utilisant un lecteur d’écran (personnes aveugles et malvoyantes). Cette structuration leur permet ainsi, à la rencontre d’une liste de :

  • Naviguer de liste en liste au sein d’une page.
  • Connaître dès le départ le nombre d’éléments dans celle-ci.
  • Naviguer plus facilement dans la liste :
    • Passer directement à la fin de la liste si ce contenu ne les intéresse pas.
    • Revenir facilement au début de la liste.

Commentaires

Ajouter un commentaire

Les champs avec astérisque (*) sont obligatoires.

Haut de page