Cabeçalhos de tabela
O que a norma pede
Cada célula de dados está associada, no código, aos cabeçalhos da sua linha e da sua coluna.
- 1.3.1 (A)
Parecido na NBR 17060
A NBR 17060 trata de aplicativos. Se o seu serviço também tem app, veja o que a Bússola da NBR 17060 diz sobre o mesmo assunto:
Visões por perfil
Escolha um perfil para ver o que o requisito pede de quem ocupa esse papel:
Inclua cabeçalho de coluna em toda tabela e indique quando a primeira coluna funciona como cabeçalho de linha. Sem cabeçalho, um número numa célula não significa nada para quem ouve.
Tabela de taxas por serviço
Serviços nas linhas, valores e prazos nas colunas.
Errado: Sem cabeçalhos
No protótipo
Tabela só com os dados, sem linha de títulos.
“R$ 20,00” é valor ou prazo?
Certo: Cabeçalhos definidos
No protótipo
Colunas “Serviço”, “Valor”, “Prazo”; a coluna “Serviço” é cabeçalho de linha.
Cada célula tem contexto.
Marque os cabeçalhos com th e scope="col" ou scope="row", e não com td em negrito. Em tabelas com vários níveis de cabeçalho, ligue cada célula aos seus cabeçalhos com headers e id.
Tabela de taxas
Implementação dos cabeçalhos.
Errado: Cabeçalhos em negrito
<tr><td><b>Serviço</b></td><td><b>Valor</b></td></tr> <tr><td>Certidão</td><td>R$ 20,00</td></tr>O leitor não associa o valor ao cabeçalho.
Certo: th com scope
<tr><th scope="col">Serviço</th><th scope="col">Valor</th></tr> <tr><th scope="row">Certidão</th><td>R$ 20,00</td></tr>O leitor anuncia “Certidão, Valor, R$ 20,00”.
Garanta que o componente de tabela gere th com scope e inclua os cabeçalhos associados nos critérios de aceite. Priorize tabelas com valores financeiros e prazos.
Componente de tabela da biblioteca
O componente é usado em todas as telas de relatórios.
Errado: Componente gera só td
Situação
Todas as tabelas do sistema sem cabeçalhos no código.
Nenhum relatório é compreensível por leitor de tela.
Certo: Componente corrigido
Situação
Componente passa a gerar th e scope.
Todos os relatórios melhoram de uma vez.
Navegue pela tabela célula a célula com o leitor de tela. Ao mudar de linha ou de coluna, ele deve anunciar o cabeçalho correspondente, inclusive nos dois níveis de tabelas complexas.
Tabela de taxas
Navegação pela coluna “Valor”.
Errado: Valor solto
Leitor de tela anuncia: “R$ 20,00”
Não se sabe a que serviço o valor se refere.
Certo: Valor com contexto
Leitor de tela anuncia: “Certidão, Valor, R$ 20,00”
A célula é compreensível sozinha.
Escreva cabeçalhos curtos, porque o leitor de tela os repete a cada célula, e inclua a unidade quando houver, como “Valor (R$)”. Marque a linha de títulos como cabeçalho no editor.
Cabeçalhos da tabela de prazos
A tabela mostra prazos de cada etapa.
Errado: Cabeçalho longo
Cabeçalho
“Quantidade de dias úteis previstos para a conclusão desta etapa”
Ouvir isso em cada célula cansa.
Certo: Cabeçalho curto
Cabeçalho
“Prazo (dias úteis)”
Claro e rápido de ouvir.