---
title: "Tableaux accessibles : bien utiliser caption, th et l’attribut scope"
description: "Ce sujet se rattache à notre dossier accessibilité numérique. Un tableau mal codé n’est plus qu’une suite de valeurs Quand vous consultez un tableau, votre regard fait des allers-retours : vers le haut pour identifier la colonne, vers la gauche pour identifier la ligne, puis vous comprenez la donnée. Un lecteur d’écran, lui, énonce les […]"
url: "https://www.newp.fr/accessibilite-numerique/tableaux-accessibles/"
author: ""
date: "2026-09-20T09:27:36+00:00"
modified: "2026-09-21T18:33:19+00:00"
lang: "fr_FR"
---

# Tableaux accessibles : bien utiliser caption, th et l’attribut scope

 Ce sujet se rattache à notre dossier [accessibilité numérique](/accessibilite-numerique/).

 

## Un tableau mal codé n’est plus qu’une suite de valeurs

 Quand vous consultez un tableau, votre regard fait des allers-retours : vers le haut pour identifier la colonne, vers la gauche pour identifier la ligne, puis vous comprenez la donnée. Un lecteur d’écran, lui, énonce les cellules une à une, dans l’ordre du code, sans ce va-et-vient.

 Faute de balisage, l’utilisateur entend « 250 000 000 » sans savoir à quoi ce montant se rapporte. Une fois le tableau correctement codé, la même cellule est lue précédée de ses deux intitulés, par exemple « Entreprises privées, seuil de chiffre d’affaires : 250 000 000 ».

## Trois balises et attributs décisifs

### `caption` : l’intitulé du tableau

 Cet élément annonce le sujet du tableau et il est lu en même temps que lui. Quand on passe d’un tableau à l’autre avec les raccourcis clavier, c’est le seul repère qui permet de savoir si l’on a trouvé le bon. Un simple paragraphe placé au-dessus ne joue pas ce rôle : aucun lien technique ne l’associe au tableau.

### `th` : les cellules qui servent d’en-têtes

 Un intitulé de colonne ou de ligne se code avec `<th>`. Un `<td>` passé en gras ou sur fond coloré reste une cellule de données : le style visuel n’apporte aucune information aux technologies d’assistance.

### `scope` : dans quel sens porte l’en-tête

 On écrit `scope="col"` quand l’intitulé concerne une colonne et `scope="row"` quand il concerne une ligne. Grâce à cet attribut, le lecteur d’écran sait quels intitulés annoncer pour chaque valeur.

 Dans nos audits, l’erreur typique consiste à baliser la ligne d’en-tête du haut en oubliant que la première colonne contient, elle aussi, des intitulés. Résultat : chaque valeur perd la moitié de son contexte.

 Automatiser le contrôle Compter sur la vigilance de chacun ne suffit pas. Nous recommandons un test automatique dans la chaîne de publication : tout tableau de données sans `caption`, ou dont une cellule d’en-tête n’a pas de `scope`, bloque la mise en ligne. L’oubli devient alors impossible, quel que soit le nombre de tableaux publiés.

 

## Les tableaux à plusieurs niveaux d’en-têtes

 On parle de tableau complexe dès qu’une donnée dépend de plusieurs intitulés sur un même axe : en-têtes étagés, cellules regroupées sur plusieurs lignes ou colonnes. Le RGAA exige alors un **résumé** et un lien explicite entre chaque cellule et l’ensemble de ses en-têtes.

 Notre conseil est pourtant d’éviter ce cas : **scindez le tableau complexe en plusieurs tableaux simples**. Chacun se lit plus facilement, pour tous les publics, et le problème disparaît au lieu d’être compensé par du code.

## Les tableaux utilisés pour la mise en page

 Positionner des blocs à l’aide d’un tableau est une technique d’un autre âge, que l’on retrouve encore dans les e-mails et quelques vieux modèles. Si vous devez en conserver, retirez-leur tout ce qui caractérise un tableau de données (pas de `caption`, de `th` ni de `scope`) et vérifiez que le contenu garde son sens une fois lu cellule après cellule.

## Tableaux et affichage sur petit écran

 Le RGAA demande qu’un contenu reste consultable à 320 pixels de large sans défilement horizontal, ce qui pose problème à un tableau à nombreuses colonnes. Les tableaux de données font exception, s’ils sont insérés dans un conteneur qui défile de façon autonome : c’est le principe que nous appliquons.

  [ Sujet précédent Sous-titres et audiodescription des vidéos ](/accessibilite-numerique/videos-sous-titres-audiodescription/) [ Sujet suivant Accessibilité et référencement naturel ](/accessibilite-numerique/accessibilite-et-seo/)

---

*Source : [www.newp.fr](https://www.newp.fr/accessibilite-numerique/tableaux-accessibles/)*