9.2. Baliser les entêtes des tableaux de données simples avec <th> et scope
Un tableau de données simple est un tableau dans lequel les cellules d’entêtes s’appliquent systématiquement à la totalité des cellules de données d’une ligne ou d’une colonne.
Baliser chaque cellule d’entête de ligne et de colonne avec la balise <th>
Dans chaque tableau de données, baliser chaque cellule d’entête de ligne et de colonne avec la balise <th>.
C’est-à-dire que chaque fois qu’une cellule est nécessaire à la compréhension des données proposées dans le tableau, celle-ci doit être balisée avec <th>.
Utiliser l’attribut scope sur les balises <th>
Pour associer les entêtes à leurs données dans ce type de tableaux, utiliser l’attribut scope sur les balises <th>. La valeur de cet attribut changera selon que la cellule d’entête concerne :
- La totalité d’une colonne :
scope="col". - La totalité d’une ligne :
scope="row".
Exemple
<table>
<caption>Températures moyennes mensuelles des 3 plus grandes villes de France.</caption>
<tr>
<td> </td>
<th scope="col">Paris</th>
<th scope="col">Marseille</th>
<th scope="col">Lyon</th>
</tr>
<tr>
<th scope="row">Juin</th>
<td>22°C</td>
<td>28°C</td>
<td>26°C</td>
</tr>
<tr>
<th scope="row">Juillet</th>
<td>24°C</td>
<td>30°C</td>
<td>28°C</td>
</tr>
</table>
| Paris | Marseille | Lyon | |
|---|---|---|---|
| Juin | 22°C | 28°C | 26°C |
| Juillet | 24°C | 30°C | 28°C |
Remarque
Lorsque le tableau ne contient qu’un seul type d’entête, l’attribut scope n’est pas nécessaire.
Commentaires
Laisser un commentaire
Mises à jour
- 01/09/2025
- Fusion de deux fiches et ajout d’une remarque concernant l’attribut scope