Portées des en-têtes de tableau

Silktide vérifie que chaque cellule d’en-tête de tableau indique ce dont elle est l’en-tête — une colonne, une ligne ou un groupe de colonnes ou de lignes. Cela indique aux à quelles cellules chaque en-tête s’applique.

En , une cellule d’en-tête <th> peut faire office d’en-tête d’une colonne, d’une ligne ou d’un groupe de colonnes ou de lignes. L’attribut scope précise lequel, éliminant toute ambiguïté quant à la structure du tableau.

<!-- Problème : rien n’indique si « Nom » est l’en-tête d’une colonne ou d’une ligne -->
<th>Nom</th>

<!-- Corrigé : l’attribut scope le rend explicite -->
<th scope="col">Nom</th>

Pourquoi c’est important

Un annonce les en-têtes pertinents avec chaque cellule au fur et à mesure que l’utilisateur parcourt un tableau. Pour ce faire, il doit savoir à quelles cellules chaque en-tête s’applique. Dans les tableaux qui comportent à la fois des en-têtes de colonnes et de lignes, ou des en-têtes qui couvrent des groupes de cellules, un en-tête sans portée oblige le lecteur d’écran à deviner — et lorsqu’il se trompe, les valeurs sont annoncées dans le mauvais contexte ou sans contexte du tout.

Comment le corriger

Ajoutez un attribut scope à chaque cellule <th>. Les valeurs valides sont :

col - l’en-tête s’applique à la colonne située en dessous.
row - l’en-tête s’applique à la ligne adjacente.
colgroup - l’en-tête s’applique à un groupe de colonnes.
rowgroup - l’en-tête s’applique à un groupe de lignes.

<table>
  <tr>
    <th scope="col">Nom</th>
    <th scope="col">Âge</th>
  </tr>
  <tr>
    <th scope="row">Bob</th>
    <td>35</td>
  </tr>
</table>

Comment Silktide vérifie cela

Repérer chaque cellule d’en-tête <th> sur chaque page.
Signaler celles dont l’attribut scope est manquant ou dont la valeur n’est pas row, col, rowgroup ou colgroup.

Dépannage

Mon tableau simple fonctionne bien sans attributs scope

Pour un tableau avec une seule ligne d’en-tête en haut, les navigateurs et les lecteurs d’écran peuvent généralement en déduire la structure. Des portées explicites éliminent néanmoins toute ambiguïté, ne coûtent rien et vous protègent si le tableau devient plus complexe par la suite; Silktide les demande donc pour chaque cellule d’en-tête. Si vous jugez qu’un tableau particulier convient tel quel, vous pouvez le constat.