TL;DR (Too Long; Didn’t Read... o básicamente: mucho texto, dame el resumen rápido)
Las celdas de datos <td> no tienen significado inherente sin su encabezado padre <th>. Si omites el encabezado o lo dejas en blanco, el lector de pantalla dictará un número (ej. "45.000") y la persona usuaria ciego no sabrá si es un monto en dinero, un saldo adeudado o un código postal.
La pérdida de coordenadas en la matriz de datos
Los sistemas de asistencia cruzan las coordenadas de una celda (Fila 3, Columna 2) para leer primero el encabezado y luego el dato. Si la primera fila de la tabla usa <td> en vez de <th>, el motor de accesibilidad jamás establecerá la relación entre la columna "Fecha" y el dato "05/03/2026".
El patrón erróneo: Código Accesible Deficiente
Aplicar CSS a una celda de datos normal para que parezca un encabezado no genera ningún vínculo programático.
<!-- MAL: Encabezados simulados sin poder relacional -->
<table>
<tr>
<td class="font-weight-bold">Monto</td>
<td class="font-weight-bold">Estado</td>
</tr>
<tr>
<td>$45.000</td>
<td>Pendiente</td>
</tr>
</table>La Solución Accesible: Código Recomendado
Utilizar estrictamente la etiqueta <th> con el atributo scope para definir si rige sobre la columna (col) o la fila (row).
<!-- BIEN: Relación matricial establecida matemáticamente -->
<table>
<thead>
<tr>
<th scope="col">Monto</th>
<th scope="col">Estado</th>
</tr>
</thead>
<tbody>
<tr>
<td>$45.000</td>
<td>Pendiente</td>
</tr>
</tbody>
</table>Metodología de Verificación y Testing
Pruebas Manuales con Lectores de Pantalla
Con NVDA, presionar T para saltar entre tablas. Una vez dentro de la tabla, usar Ctrl+Alt+Flechas para navegar celda por celda. Verificar que al moverse horizontalmente, el lector anuncie primero el encabezado de columna correspondiente y luego el dato de la celda.
Inspección del Árbol de Accesibilidad
En Chrome DevTools, seleccionar el elemento afectado en el panel Elements, luego abrir la pestaña Accessibility. Verificar que las propiedades Role, Name y State reflejen correctamente la intención del componente según el criterio WCAG 1.3.1.
Herramientas Automatizadas
Ejecutar Axe DevTools: las reglas relacionadas con estructura (ej: list, listitem, landmark-*) son altamente confiables para detectar violaciones del Criterio 1.3.1. Complementar con el validador HTML del W3C para errores de modelo de contenido.
