table-th-has-data-cells
Les éléments <th> doivent décrire au moins une cellule de données
Vérifie qu’un tableau contenant des éléments <th> contient aussi au moins une cellule de données <td> que ces en-têtes peuvent décrire.
Applicabilité. S’applique aux éléments <table> qui conservent leur sémantique de tableau, sont inclus dans l’arbre d’accessibilité et contiennent au moins un <th> visible, inclus dans l’arbre d’accessibilité et non remplacé par un rôle explicite autre que rowheader/columnheader. S’applique aussi à l’équivalent purement ARIA : un élément dont le rôle se résout en grid/treegrid (sans <table> natif) qui contient au moins un élément de rôle columnheader/rowheader entrant dans le périmètre. Les rôles sont résolus comme le font les agents utilisateurs : le premier jeton de l’attribut role désignant un rôle connu, sans tenir compte de la casse ; un attribut role sans jeton connu laisse le rôle implicite en place. Dans la forme purement ARIA, un élément personnalisé auquel ses ElementInternals donnent le rôle grid, treegrid, d’en-tête ou de cellule (this.attachInternals().role), sans attribut role qui en nomme un autre, compte comme un élément doté de cet attribut role.
Attendu. Le tableau contient aussi au moins un <td> quelque part et, dans un tableau sans colspan ni rowspan (ou un grid sans aria-colspan, aria-rowspan ni aria-colindex), chaque cellule d’en-tête a une cellule de données qui lui est attribuée par le modèle de tableau HTML : une cellule qui la suit dans sa colonne ou sa ligne, selon ce que permet son scope, sans attribut headers, ou une cellule dont l’attribut headers la nomme.
Ce que rapporte un constat.
row,column: l’emplacement d’un en-tête sans cellule attribuée, en comptant à partir de 0 : les lignes depuis le haut, les cellules depuis la gauche dans la ligne.
Ces champs de data.details aident à lire et à reproduire un constat. À part reasonCode et les quelques champs que la page Schéma de sortie donne comme stables, ils ne constituent pas un contrat stable : un champ peut être renommé ou supprimé dans une version mineure, ne vous appuyez donc pas dessus.
Exemples
<table><tr><th>Name</th></tr><tr><td>Apple</td></tr></table>
Le tableau a au moins un <td> auquel le <th> peut servir d’en-tête.
<table><tr><th>Name</th></tr></table>
Le tableau a un <th> mais aucun <td> nulle part.
Comment vérifier
Quand cette règle ne peut pas trancher, elle renvoie cantTell et laisse la question à une personne. Chaque question qu’elle peut poser figure ici sous son code de raison, avec les étapes pour y répondre. Un constat porte les mêmes étapes dans howToCheck, dans la langue de l’analyse. Voir Schéma de sortie.
TABLE_TH_NO_ASSIGNED_CELL
- Repérez la cellule d’en-tête indiquée par le rapport (sa ligne et sa colonne sont données, en comptant à partir de 0).
- Regardez les cellules situées en dessous dans sa colonne, ou après elle dans sa ligne, selon ce qu’indique son scope.
- Déterminez si l’en-tête est destiné à étiqueter des données : si les cellules qu’il devrait couvrir sont absentes, ou sont balisées comme des en-têtes, il n’étiquette rien.
- Si un lecteur d’écran est disponible, parcourez les cellules de données du tableau et notez si cet en-tête est annoncé à un moment.
Réussite. L’en-tête n’est pas destiné à étiqueter des données (il peut être une cellule ordinaire), ou les données qu’il couvre sont balisées de façon à ce que l’en-tête leur soit associé.
Échec. Un en-tête qui devrait étiqueter des données n’a aucune cellule de données associée : sa relation n’est donc pas transmise, ce qui ne respecte pas le critère WCAG 1.3.1.