Tablas accesibles

Una tabla de datos definida con la etiqueta table es muy fácil de entender si se
puede ver toda ella en su conjunto, pero es muy difícil de entender si sólo se puede ver un
dato aislado cada vez. Este problema lo sufren los usuarios que emplean navegadores no visuales, ya que ellos tienen que recorrer las tablas de formal lineal y pierden la visión global de la tabla que permite identificar el significado de cada dato de una celda.

Para evitar este problema, tenemos que etiquetar correctamente las tablas para definir su título, los encabezamientos de las columnas y las filas y tenemos que incluir un resumen que describa brevemente el contenido de la tabla.

El título
Una tabla debe de tener un título que proporcione una descripción breve de la tabla. Para evitar que existan dudas, el título se tiene que definir dentro de la tabla. Para definir correctamente el título de una tabla, se tiene que emplear la etiqueta caption. De acuerdo con la especificación de HTML, la etiqueta caption es opcional y tiene que ser el primer elemento que contenga una tabla.

Encabezamientos
Al recorrer una tabla de forma lineal, se pierde la visión global y es muy difícil identificar el significado de un dato. Para evitar esta situación, podemos usar los encabezamientos, que permiten asociar un dato con su encabezado.

Un encabezado de una tabla se define con la etiqueta th. Esta etiqueta es similar a la etiqueta td (se puede usar una en el lugar de la otra) y por tanto ambas definen una celda de una tabla, pero th indica que la celda contiene un encabezado.

Encabezamientos más complejos
Para tablas con encabezamientos más complejos, donde pueden existir varios niveles de encabezamiento, podemos emplear los atributos scope y headers para definir la relación que existe entre las celdas de encabezamiento y las celdas de datos. En tablas sencillas ambos atributos se pueden emplear de forma equivalente, pero para tablas más complejas se tiene que emplear el atributo headers. El uso del atributo scope y headers no afecta a la presentación visual de la tabla.

El atributo scope define el conjunto de celdas para las cuales la celda sobre la que se aplica proporciona información de encabezamiento. Puede tomar cuatro posibles valores:

• row: La celda proporciona información de encabezamiento para el resto de celdas
  de la fila que la contiene.
• col: La celda proporciona información de encabezamiento para el resto de celdas
  de la columna que la contiene.
• rowgroup: La celda proporciona información de encabezamiento para el resto del
  grupo de filas que la contiene.
• colgroup: La celda proporciona información de encabezamiento para el resto del
  grupo de columnas que la contiene.

El atributo headers permite definir una lista de celdas de la tabla que proporcionan información de encabezamiento para la celda actual. El valor de este atributo es una lista separada por espacios en blanco de los identificadores de las celdas de encabezamiento; las celdas se identifican con el atributo id. Por tanto, el atributo headers permite definir encabezamientos más complejos que con el atributo scope.

Resúmenes
El resumen permite definir una descripción larga de la tabla que complemente al título de la tabla. La descripción tiene que incluir una explicación sobre el contenido y sobre la estructura de la tabla (número de filas y de columnas, descripción de los encabezamientos). Además, también puede explicar la relación que guarda la tabla con el resto de la página. En HTML, el resumen de una tabla se define con el atributo summary de la etiqueta table.

Para obtener más información, consulta las siguientes páginas:

• Tablas accesibles, en español.
• Accesible Data Tables, en inglés.