Tablas

Listado de buenas prácticas sobre Tablas

¿Cómo se deben asociar los encabezados de las tablas con sus respectivas celdas de datos?

En una tabla de datos compleja (aquella que posee dos o más niveles de encabezado) la asociación de sus encabezados con sus respectivas celdas de datos se realiza por medio de los atributos id y headers. De esta forma cada celda de datos incluirá en su atributo headers el identificador unívoco (id) de todos los encabezados relacionados con ésta.

Ejemplo de código:

<table summary=”Datos de extensión y habitantes de ciudades”>
 <tr>
  <th id=”ciudad”>Ciudad</th>
  <th id=”habitantes”>Habitantes</th>
  <th id=”extension”>Extensión (<abbr title="kilómetros cuadrados">km<sub>2</sub></abbr>)</th>
 </tr>
 <tr>
  <th headers=”ciudad” id=”leon”>León</th>
  <td headers=”habitantes leon”>135000</td>
  <td headers=”extension leon”>39</td>
 </tr>
</table>

Para ampliar la información sobre tablas se recomienda descargar la Guía de Comprobación de la Accesibilidad: Tablas.

Volver al listado de buenas prácticas

¿Cómo se deben incluir los resúmenes de las tablas de datos y que información se debe incluir en ellos?

Es importante incluir en las tablas un resumen de los contenidos de la misma y de las relaciones entre las celdas, especialmente para las tablas con encabezamientos anidados, celdas que ocupan varias columnas o filas, u otras relaciones que solo son evidentes cuando la tabla se muestra visualmente.

Para aportar dicho resumen en las tablas de datos complejas se deberá utilizar el atributo summary, usando de forma adicional si se desea el elemento CAPTION. En las tablas de datos simples se deberá utilizar al menos el elemento CAPTION aunque se recomienda el uso del atributo summary.

Ejemplo de código:

<table summary="La tabla muestra la nota final de los alumnos de 1º B en la asignatura de Matemáticas">
<caption>Calificaciones: asignatura Matemáticas</caption>

<tr> <th scope="col">Alumno/a</th>
<th scope="col">Matemáticas</th> </tr>
<tr> <td>Javier González Rodríguez</td>
<td>8,3</td> </tr>
<tr> <td>María del Carmen Martín Pérez</td>
<td>5</td> </tr>
</table>

Para ampliar la información sobre tablas se recomienda descargar la Guía de Comprobación de la Accesibilidad: Tablas.

Volver al listado de buenas prácticas

¿Cuál es la mejor manera para colocar una leyenda en una tabla?

Para colocar un recuadro con una leyenda en una tabla de datos, y que sea accesible para todos los usuarios, existen dos posibilidades:

  • Si el texto de la leyenda no es muy extenso se puede incluir en las propias celdas de datos.
  • En el caso de que la leyenda sea muy amplia, lo mejor es colocarla después de la tabla, y hacer referencias desde las celdas de datos correspondientes mediante enlaces a dicha leyenda.

    Tabla de datos con la leyenda situada al pie de la misma

Se debe identificar adecuadamente la leyenda mediante un texto que la asocie a la tabla correspondiente. Así mismo se debería indicar, mediante el atributo summary de la tabla, que existe dicha leyenda y está situada después de la tabla.

Volver al listado de buenas prácticas