Critère 5.7 Pour chaque tableau de données, la technique appropriée permettant d’associer chaque cellule avec ses en-têtes est-elle utilisée (hors cas particuliers) ?
Texte officiel du RGAA 4.1.2. Voir aussi le critère 5.7 sur accessibilite.numerique.gouv.fr.
Tests
Test 5.7.1
Pour chaque contenu de balise <th> s’appliquant à la totalité de la ligne ou de la colonne, la balise <th> respecte-t-elle une de ces conditions (hors cas particuliers) ?
- La balise
<th>possède un attributidunique ; - La balise
<th>possède un attributscope; - La balise
<th>possède un attribut WAI-ARIArole="rowheader"ourole="columnheader".
Méthodologie du test 5.7.1
- Retrouver dans le document les tableaux de données ;
- Pour chaque en-tête (élément
<th>) s’appliquant à la totalité de la ligne ou de la colonne, vérifier que l’élément<th>possède :- Soit un attribut
idunique ; - Soit un attribut scope ;
- Soit un attribut WAI-ARIA
role="rowheader"ou"columnheader".
- Soit un attribut
- Si c’est le cas pour chaque en-tête s’appliquant à la totalité de la ligne ou de la colonne, le test est validé.
Test 5.7.2
Pour chaque contenu de balise <th> s’appliquant à la totalité de la ligne ou de la colonne et possédant un attribut scope, la balise <th> vérifie-t-elle une de ces conditions ?
- La balise
<th>possède un attributscopeavec la valeur"row"pour les en-têtes de ligne ; - La balise
<th>possède un attributscopeavec la valeur"col"pour les en-têtes de colonne.
Méthodologie du test 5.7.2
- Retrouver dans le document les tableaux de données ;
- Pour chaque en-tête (élément
<th>) s’appliquant à la totalité de la ligne ou de la colonne et pourvu d’un attributscope, vérifier que l’attributscopepossède :- Soit une valeur
"row"pour les en-têtes de ligne ; - Soit une valeur
"col"pour les en-têtes de colonne.
- Soit une valeur
- Si c’est le cas pour chaque en-tête s’appliquant à la totalité de la ligne ou de la colonne et pourvu d’un attribut
scope, le test est validé.
Test 5.7.3
Pour chaque contenu de balise <th> ne s’appliquant pas à la totalité de la ligne ou de la colonne, la balise <th> vérifie-t-elle ces conditions ?
- La balise
<th>ne possède pas d’attributscope; - La balise
<th>ne possède pas d’attribut WAI-ARIArole="rowheader"ourole="columnheader"; - La balise
<th>possède un attributidunique.
Méthodologie du test 5.7.3
- Retrouver dans le document les tableaux de données ;
- Pour chaque en-tête (élément
<th>) ne s’appliquant pas à la totalité de la ligne ou de la colonne, vérifier que l’élément<th>:- Possède un attribut
idunique ; - Et ne possède pas d’attribut
scope; - Et ne possède pas d’attribut WAI-ARIA
role="rowheader"ou"columnheader".
- Possède un attribut
- Si c’est le cas pour chaque en-tête ne s’appliquant pas à la totalité de la ligne ou de la colonne, le test est validé.
Test 5.7.4
Pour chaque contenu de balise <td> ou <th> associée à un ou plusieurs en-têtes possédant un attribut id, la balise vérifie-t-elle ces conditions ?
- La balise possède un attribut
headers; - L’attribut
headerspossède la liste des valeurs d’attributiddes en-têtes associés.
Méthodologie du test 5.7.4
- Retrouver dans le document les tableaux de données ;
- Pour chaque élément
<td>ou<th>associé à un ou plusieurs en-têtes possédant un attributid, vérifier que :- L’élément
<td>ou<th>possède un attributheaders; - Et l’attribut
headerspossède la liste des valeurs d’attributiddes en-têtes associés.
- L’élément
- Si c’est le cas pour chaque élément
<td>ou<th>associé à un ou plusieurs en-têtes possédant un attributid, le test est validé.
Test 5.7.5
Pour chaque balise pourvue d’un attribut WAI-ARIA role="rowheader" ou role="columnheader" dont le contenu s’applique à la totalité de la ligne ou de la colonne, la balise vérifie-t-elle une de ces conditions ?
- La balise possède un attribut WAI-ARIA
role="rowheader"pour les en-têtes de ligne ; - La balise possède un attribut WAI-ARIA
role="columnheader"pour les en-têtes de colonne.
Méthodologie du test 5.7.5
- Retrouver dans le document les tableaux de données ;
- Pour chaque en-tête s’appliquant à la totalité de la ligne ou de la colonne et pourvu d’un attribut WAI-ARIA
role="rowheader"ou"columnheader", vérifier que l’élément possède :- Soit un attribut WAI-ARIA
role="rowheader"pour les en-têtes de ligne ; - Soit un attribut WAI-ARIA
role="columnheader"pour les en-têtes de colonne.
- Soit un attribut WAI-ARIA
- Si c’est le cas pour chaque en-tête s’appliquant à la totalité de la ligne ou de la colonne et pourvu d’un attribut WAI-ARIA
role="rowheader"ou"columnheader", le test est validé.
Cas particuliers
Dans le cas de tableaux de données ayant des en-têtes sur une seule ligne ou une seule colonne, les en-têtes peuvent être structurés à l’aide de balise <th> sans attribut scope.
Notes techniques
Si l’attribut headers est implémenté sur une cellule déjà reliée à un en-tête (de ligne ou de colonne) avec l’attribut scope (avec la valeur col ou row), c’est l’en-tête ou les en-têtes référencés par l’attribut headers qui seront restitués aux technologies d’assistance. Les en-têtes reliés avec l’attribut scope seront ignorés.
Références WCAG 2.1
- 1.3.1 Info and Relationships (niveau A)
Techniques WCAG : H43, H63, F90
Ce que l’audit automatique peut détecter
Règles qui vérifient directement ce critère
Ces règles d’axe-core 4.14.0 citent un test de ce critère. Elles repèrent une partie des erreurs ; le reste du critère demande une vérification humaine.
td-headers-attr: Ensure that each cell in a table that uses the headers attribute refers only to other <th> elements in that tableTest 5.7.4.th-has-data-cells: Ensure that <th> elements and elements with role=columnheader/rowheader have data cells they describeTest 5.7.1.
Règles de bonne pratique ou expérimentales — à confirmer par un humain
Ces règles citent un test de ce critère, mais axe-core les classe comme bonnes pratiques ou comme expérimentales : ce qu’elles signalent ne prouve pas une non-conformité, et elles ne comptent pas comme une vérification de ce critère.
td-has-header: Ensure that each non-empty data cell in a <table> larger than 3 by 3 has one or more table headersTest 5.7.4. Règle expérimentale.
Source : RGAA 4.1.2 (WCAG 2.1), © DINUM, publié dans le dépôt DISIC/accessibilite.numerique.gouv.fr (commit ca4019f), sous Licence Ouverte 2.0. Texte officiel reproduit sans modification de contenu ; certains attributs de mise en forme (liens ouverts dans une nouvelle fenêtre, lien mort) sont retirés. Seuls les encadrés « Explication Rampe — non normative » sont rédigés par Rampe.