Concept des tableaux

Aperçu

Les tableaux de données servent à structurer les données en colonnes et en rangées. Il est important de marquer les tableaux de façon sémantique pour définir la relation entre les cellules d’en-tête et les cellules de données. Dans le cas de tableaux simples, l’utilisation des éléments <table>, <tr>, <th> et <td> rend les relations perceptibles. Il est également recommandé d’utiliser l’attribut scope même dans les tableaux simples. Dans le cas des tableaux complexes, l’utilisation des éléments <col> et <colgroup> et des attributs scope, id et header rend les associations explicites.

Les lecteurs d’écran utilisent le marquage du tableau pour lire l’information d’en-tête qui change à mesure que l’utilisateur navigue dans le tableau au moyen du clavier. Le lecteur d’écran lit les en-têtes de rangée et de colonne lorsqu’il est logique de le faire – quand on passe d’une cellule dans une colonne à une cellule dans la suivante, l’en-tête de la colonne suivante est lu à haute voix; quand on passe d’une rangée à l’autre, l’en-tête de la rangée suivante est lu à haute voix. Avec certain lecteur d’écran, lorsque les utilisateurs se perdent dans une table complexe, ils peuvent « interroger le tableau », et le lecteur d’écran lit tous les en-têtes associés à la cellule ciblée.

Pour rendre l’information accessible au plus grand nombre possible, convertir les tableaux complexes en tableaux simples, et convertir les tableaux en listes si les données sont simples.

Guide de style du contenu de Canada.ca

Suivre les recommandations de la section 5.3 du Guide de style du contenu de Canada.ca Section 5.3 pour ce qui est des tableaux :

  • Utiliser des tableaux pour organiser et présenter les données;
  • La valeur de chaque cellule est liée aux en-têtes de colonne et de rangée;
  • Les entrées d’une colonne ne contiennent pas d’information qui pourrait être considérée comme un sous-titre;
  • La valeur de chaque cellule est alignée avec l’en-tête de colonne qui apparaît directement au-dessus;
  • Donner au tableau un titre clair (en utilisant <caption>) qui décrit l’information qu’il contient;
  • Convertir des tableaux complexes en un ou plusieurs tableaux simples;
  • Convertir un tableau en liste si les données sont simples.

Ressources WCAG connexes

Ressources WCAG connexes

Critères de succès

Techniques

Haut de la page