Les tableaux complexes du site — avec des colonnes et des lignes d'en-têtes croisées ou des cellules fusionnées — sont-ils accompagnés d'une explication de comment les lire ?
Critère officiel 5.1 — Chaque tableau de données complexe a-t-il un résumé ?
Pourquoi c'est important
Un logiciel de lecture parcourt un tableau cellule par cellule. Sans explication de la structure, une personne aveugle entend une suite de chiffres sans contexte et ne peut pas savoir comment les colonnes et les lignes s'organisent entre elles.
Exemples concrets
Ce qui est conforme
Le tableau des tarifs de la cantine scolaire — avec les quotients familiaux en lignes et les types de repas en colonnes — est accompagné de la note : « Ce tableau présente les tarifs en euros selon le quotient familial (lignes) et le type de repas : déjeuner, goûter ou repas soir (colonnes). » Le logiciel de lecture lit cette note avant le tableau.
Ce qui pose problème
Le même tableau des tarifs est publié sans aucune explication. Le logiciel de lecture annonce les chiffres les uns après les autres sans que l'utilisateur puisse comprendre à quel quotient ou quel type de repas ils correspondent.
Comment agir
Rédigez une phrase expliquant comment lire le tableau — ce que représentent les lignes, ce que représentent les colonnes, et comment interpréter les cellules. Transmettez ce texte à votre prestataire pour qu'il le déclare correctement dans le code du tableau.
Règles clés
- Le résumé décrit la structure, pas le contenu : 'Lignes = régions, colonnes = trimestres, total en dernière ligne'.
- Méthodes RGAA : <caption> étendu, aria-describedby vers un paragraphe adjacent.
- Pour les tableaux simples (une seule ligne/colonne d'en-têtes) : résumé non requis.
Erreurs fréquentes
- Tableau avec colspan/rowspan sans résumé de structure
- Résumé présent mais décrivant le contenu plutôt que la structure
Exemples de code
tableau complexe sans résumé
✗ Non conforme<table>
<tr>
<th colspan="2">Nord</th>
<th colspan="2">Sud</th>
</tr>
<!-- ... -->
</table>En-têtes fusionnés sans explication préalable. L'utilisateur doit naviguer dans le tableau pour en comprendre la structure.
tableau complexe avec résumé
✓ Conforme<p id="resume-tab">
Tableau des ventes : lignes = régions
(Nord, Sud, Est, Ouest), colonnes = trimestres
(T1–T4). Dernière ligne : totaux annuels.
</p>
<table aria-describedby="resume-tab">
<!-- ... -->
</table>Le paragraphe décrit la structure. aria-describedby lie programmatiquement le tableau à son résumé.
Référence WCAG : 1.3.1