Principio 1/1.3 Adaptable/1.3.1-F
De WCAG Wiki
< Principio 1 | 1.3 Adaptable
1.3.1-F. Tablas estructuradas
- Nivel: A
- Versión: 2.0
- Principio: 1_Perceptible
- Pauta: 1.3_Adaptable
- Grupo: Estructura y relaciones
- Subgrupo: Tablas de datos
Discapacidades afectadas
Este criterio puede afectar a distintas personas con discapacidad. A continuación se indican las más relevantes.
-
Visual total –
Barrera leve
-
Sordoceguera –
Barrera leve
Enunciado del criterio (Observatorio de Accesibilidad Web)
- La información tabular se debe estructurar mediante elementos de tablas de datos (
<table>,<tr>,<th>,<td>).
Comprensión del criterio
Descripción resumida
La información tabular debe estar marcada con etiquetas semánticas de tabla.
Esto permite que los usuarios de lectores de pantalla comprendan correctamente la estructura y relaciones entre los datos.
Objetivo
Garantizar que los lectores de pantalla puedan interpretar correctamente las relaciones entre encabezados y celdas de datos al usar marcado de tablas (
<table>,<tr>, <th>,<td>).Importancia de cumplir el criterio
Las tablas mal estructuradas o simuladas visualmente rompen la interpretación del contenido para los usuarios con discapacidad visual y otros usuarios que dependen de tecnologías de apoyo.
Referencias WCAG
Recursos de apoyo
- Usar etiquetas (
<table>,<th>,<tr>,<td>) para datos tabulares presentados en tabla - Evitar combinar celdas para mejorar comprensión y accesibilidad
Evaluación del criterio
Tipo de evaluación
Evaluación Semiautomática
Procedimiento de evaluación
Usa la herramienta de Wave.
- Paso 1. Seleccionar Details – Structural elements.
- Paso 2. Comprobar que la información tabular se identifica en la herramienta mediante elementos data table.
Resultado esperado
La información tabular está estructurada correctamente con codigo HTML
<table>,<tr>, <th>,<td>Ejemplo
Se presenta un codigo con etiquetas HTML correctas para incluir una tabla.
<table> <tr> <th>Producto</th> <th>Precio</th> </tr> <tr> <td>Café</td> <td>2€</td> </tr> </table>
Otras herramientas de evaluación
- Bookmarklet Get table data pemite obtener los datos de una tabla.
- Web developer Toolbar Tiene la opción de outline - outline table que permite mostrar donde estan situadas las tablas y luego mirar que codigo HTML presentan
- Inspección del navegador Observar si elementos que visualmente son tablas están marcados como tañ en el código fuente
Ejemplos accesibles y no accesibles creados por alumnos
Comentarios
A continuación se muestran comentarios sobre el criterio 1.3.1-F. Tablas estructuradas
Loading comments...
