Tabelas
headers precisa apontar para células da mesma tabela
- Regra:
td-headers-attr - Gravidade: Grave
- Nível WCAG A
Por que isso importa
Um atributo headers que referencia um id ausente, ou em outra tabela, perde a associação silenciosamente — a célula passa a ser anunciada sem cabeçalho algum.
Como corrigir
- Confira se cada id do atributo headers existe em um <th> da mesma tabela.
- Não faça uma célula apontar para si mesma.
- Use scope quando a tabela for uma grade simples: é muito mais fácil de manter correto.
Na marcação
<td headers="region-h">Berlin</td>
<!-- no cell with id="region-h" in this table --><th id="region-h">Region</th>
<td headers="region-h">Berlin</td>A exigência por trás disso
Esta regra é uma das formas de falhar nos seguintes critérios de sucesso das WCAG 2.2. O W3C, que publica a norma, explica cada um deles:
- 1.3.1 Informação e relações (abre em nova aba) — Nível WCAG A
Para aprofundar
Deque University sobre td-headers-attr (abre em nova aba)
A Deque mantém o axe-core, o motor de código aberto que o nosso scanner executa. A página deles documenta a regra como o motor a implementa.
Verificações automáticas encontram falhas que o navegador consegue comprovar. Elas não julgam se uma legenda está correta, se um texto alternativo é útil, nem se a página pode ser operada de ponta a ponta pelo teclado — isso exige uma pessoa.