Partager

Approfondir

Qualité Web le livre

Livre Qualité Web

Acheter

21 - Les éléments visuellement présentés sous forme de liste sont balisés de façon appropriée dans le code source.

Thématique
Phase Projet

Objectif
  • Permettre l’identification des listes par les navigateurs et les aides techniques et donc leur restitution appropriée afin de faciliter leur compréhension par les utilisateurs.
  • Améliorer la sémantique du contenu des pages et sa réutilisabilité.
Mise en œuvre

Soit utiliser les éléments HTML appropriés :

  • ul et li pour les listes non ordonnées ;
  • ol et li pour les listes ordonnées ;
  • dl, dt et dd pour les listes de définitions ou de descriptions.

Soit recourir aux attributs ARIA permettant de donner la sémantique d’une liste non ordonnée ou ordonnée à un contenu balisé de manière plus générique :

  • donner au conteneur de la liste un attribut role="list" ;
  • donner à chaque élément de la liste un attribut role="listitem" ;
  • (il n’existe pas d’équivalent aux listes de définitions via un rôle ARIA). 

Contrôle

Pour chaque page contenant une liste :

  • Contrôler le code source des contenus présentés sous forme de liste (caractérisés par la présence de retours à la ligne et de marqueurs de listes tels que des puces ou des numéros) à l’aide d’un inspecteur de code.
  • Vérifier si le code source de ces listes apparentes comporte bien les éléments HTML correspondant au type de liste concerné : ul li pour une liste non ordonnée (liste à puces), ol li pour une liste ordonnée (liste numérotée) et dl dt dd pour une liste de définitions ou, à défaut, les rôles ARIA list et listitem.

Découvrez la certification Opquast

Rejoignez la communauté des certifiés Opquast. Plus de 5000 professionnels formés à la qualité Web. Au programme une formation en ligne de 14h, un examen de 1h30, un badge et un score à mettre sur votre cv et votre profil linkedin.

Commander en ligne