Tabelas complexas: associação de headers e id

Algumas tabelas abrangem células ou empilham vários níveis de cabeçalho. O scope simples não consegue descrever uma célula governada por dois ou três cabeçalhos ao mesmo tempo.

Um cabeçalho que usa colspan para abranger várias colunas confunde o modelo simples. O navegador já não consegue adivinhar quais células ele abrange.

Em tabelas complexas, dê um id a cada th e associe cada td aos seus cabeçalhos por id. Isso conecta explicitamente as células aos cabeçalhos, sem suposições.

Uma célula de dados pode indicar vários cabeçalhos no atributo headers, separados por espaços. O leitor anuncia todos na ordem em que você os lista.

Dê um id ao cabeçalho da linha e outro ao cabeçalho da coluna; depois, faça referência aos dois a partir da célula. Agora o valor está totalmente descrito nos dois eixos.

Para cabeçalhos agrupados, scope pode ser colgroup ou rowgroup. Use-os quando um cabeçalho abranger uma faixa de colunas ou linhas acima dos cabeçalhos detalhados.

Um cabeçalho de ano acima dos cabeçalhos de mês precisa que os dois níveis sejam descritos. Com id e headers, cada célula pode fazer referência ao ano e ao mês juntos.

Cada id na página deve ser único. ids de cabeçalho duplicados rompem silenciosamente a associação, então uma rápida verificação do validador evita problemas reais mais tarde.

Liste os ids na ordem em que deseja que sejam lidos, geralmente começando pelo cabeçalho mais abrangente. O leitor de tela segue exatamente sua ordem ao fazer o anúncio.

Antes de recorrer a id e headers, pergunte se é possível dividir uma tabela enorme em tabelas simples menores. Uma estrutura mais simples quase sempre é mais acessível.

A técnica de id e headers é poderosa, mas fácil de digitar incorretamente. Confirme sempre se algumas células são lidas corretamente com um leitor de tela de verdade, não apenas visualmente.

Quando extensões ou níveis empilhados tornam scope inadequado, atribua um id aos cabeçalhos e faça referência a eles em cada célula com headers. Mantenha os ids exclusivos e verifique ouvindo.