Técnicas para as WCAG 2.0

Ir para o conteúdo (Pressione a tecla Enter)

-

H51: Utilizar table para marcar informação tabular

Aplicabilidade

HTML e XHTML.

Esta técnica está relacionada com:

Descrição

O objectivo desta técnica é apresentar informações dispostas em tabelas de forma a preservar as relações nas informações, mesmo quando os utilizadores não conseguem ver a tabela ou o formato de apresentação tiver sido alterado. As informações são consideradas como dispostas em tabelas quando existem relações lógicas a duas dimensões (vertical e horizontal) entre texto, números, imagens ou outros dados. Estas relações são representadas em colunas e linhas, e as colunas e as linhas têm de ser reconhecíveis por ordem para as relações lógicas serem percebidas.

A utilização do elemento table com os elementos subordinados tr, the td torna estas relações perceptíveis. As técnicas, tais como inserir separadores para criar colunas ou utilizar o elemento pre, são meramente visuais, e as relações lógicas visualmente implícitas são perdidas se o utilizador não puder ver a tabela ou a apresentação visual tiver sido alterada.

Exemplos

Exemplo 1: Um calendário marcado como uma tabela de dados simples com cabeçalhos de coluna e de linha

Este exemplo utiliza a marcação para uma tabela de dados simples. A primeira linha mostra os dias da semana. Os intervalos de tempo são apresentados na primeira coluna. Estas células são assinaladas com o elemento th . Isto identifica os dias da semana como cabeçalhos de coluna e os intervalos de tempo como cabeçalhos de linha.

Os leitores de ecrã lêem informações de cabeçalho que são alteradas à medida que o utilizador navega na tabela. Assim, quando os utilizadores de leitores de ecrã se deslocam para a esquerda ou para a direita ao longo de uma linha, irão ouvir o dia da semana (o cabeçalho da coluna) seguido da hora marcada (se existir alguma) e irão ouvir o intervalo de tempo à medida que se deslocam para cima ou para baixo na mesma coluna.

Código Exemplo:

                                 <table>
  <tr>
    <td> </td>
    <th>Monday</th>
    <th>Tuesday</th>
    <th>Wednesday</th>
    <th>Thursday</th>
    <th>Friday</th>
  </tr>
  <tr>
    <th>8:00-9:00</th>
    <td>Meet with Sam</td>
    <td> </td>
    <td> </td>
    <td> </td>
    <td> </td>
  </tr>
  <tr>
    <th>9:00-10:00</th>
    <td> </td>
    <td> </td>
    <td>Doctor Williams</td>
    <td>Sam again</td>
    <td>Leave for San Antonio</td>
  </tr>
</table> 

Recursos

Os recursos são indicados apenas a título informativo, não implica que tenham sido aprovados.

Testes

Procedimento

  1. Verifique se existem informações dispostas em tabelas.

  2. Para cada ocorrência de informações dispostas em tabelas:

    1. Verifique se é utilizada a marcação da tabela com, no mínimo, os elementos table, tr, th e td .

Resultados Esperados