Critères en pratique
Tableaux de données accessibles : en-têtes, titre et structure
Un tableau sans en-têtes déclarés est une grille de chiffres muette. Comment structurer un tableau de données conforme, et pourquoi il ne faut jamais l'utiliser pour la mise en page.
Pourquoi le tableau pose problème
Un tableau restitue une information à deux dimensions. Visuellement, l'œil relie une cellule à sa colonne et à sa ligne sans effort. À l'écoute, ce lien n'existe pas : sans structure déclarée, l'utilisateur entend une suite de valeurs sans savoir à quoi chacune se rapporte.
Tout l'enjeu consiste à rendre ces relations explicites dans le code.
La structure attendue
- un titre de tableau, via
caption, qui annonce ce qu'il contient ; - des cellules d'en-tête en
th, jamais entdmis en gras ; - un attribut
scopesur chaqueth:colpour un en-tête de colonne,rowpour un en-tête de ligne ; - pour les tableaux complexes à double entrée, la paire
id/headerspour relier explicitement chaque cellule à ses en-têtes ; - une structure
thead/tbodyqui sépare les en-têtes des données.
> Le tableau de mise en page — Utiliser un tableau pour positionner des éléments est une non-conformité directe : le lecteur d'écran annonce « tableau de 3 lignes et 4 colonnes » là où il n'y a aucune donnée tabulaire. La mise en page relève de CSS, sans exception.
Les cas difficiles
Les cellules fusionnées brouillent les relations : quand la structure devient trop complexe à déclarer, c'est souvent le signe qu'il faut scinder le tableau en plusieurs tableaux simples. Les tableaux larges doivent rester consultables sur mobile — un défilement horizontal contenu, atteignable au clavier, plutôt qu'un contenu tronqué.
En contexte éditorial
Les tableaux insérés par des rédacteurs via un éditeur de contenu sont la source principale de non-conformité : l'outil produit rarement caption et scope spontanément. C'est un point à traiter en formation plutôt qu'en correction répétée.
---
À lire aussi