Accessibilité : [5.1.2.2] : Il manque les en-tête des lignes/colonnes d'un tableau de données (1 colonne)

Priorité 1

Cause :

Vous avez défini des tableaux de données en omettant une en-tête de colonne.

Exemple :

Error <table summary="Il manque une en-tête de colonne dans ce tableau">
<caption>Il manque une en-tête de colonne dans ce tableau</caption>
<tr>
<td>age</td><th>taille</th><th>poids</th>
</tr>
<tr>
<td>10</td><td>1.3 m</td><td>50 kg.</td>
</tr>
<tr>
<td>15</td><td>1.8 m</td><td>75 kg.</td>
</tr>
<tr>
<td>20</td><td>2.1 m</td><td>100 kg.</td>
</tr>
</table>
Good <table summary="Cette table a tous ses en-tête de colonne">
<caption>Cette table a tous ses en-tête de colonne</caption>
<tr>
<th>age</th><th>taille</th><th>poids</th>
</tr>
<tr>
<td>10</td><td>1.3 m</td><td>50 kg.</td>
</tr>
<tr>
<td>15</td><td>1.8 m</td><td>75 kg.</td>
</tr>
<tr>
<td>20</td><td>2.1 m</td><td>100 kg.</td>
</tr>
</table>

Solution :

Pour les tableaux de données, il faut identifier les entêtes des lignes et des colonnes. Il faut par exemple utiliser <td> pour signaler les cellules de données et <th> pour signaler les en-têtes. On peut aussi nommer les éléments du tableau avec les attributs "scope", "headers", et "axis", de façon à ce que les futurs navigateurs et techniques d'assistance à l'accessibilité puissent sélectionner les données par filtrage sur les catégories.

Références :

.