2526UdL1.3.2-B-001
Edición de la página como formulario
1. Información básica
Enlace directo a la página del subcriterio en la wiki https://wikiwcag.udl.cat/Principio_1/1.3_Adaptable/1.3.2-B
2. Ejemplos prácticos
2.1. Ejemplo NO accesible
a) Imagen
No se ha subido ninguna imagen.
b) Enlace de donde se ha obtenido la imagen:
No se ha indicado ningún enlace.
2.1.2. Código HTML:
<table>
<tr>
<td>
<h2>Bienvenido</h2>
</td>
<td>
<p>Este es el texto principal de la página.</p>
</td>
</tr>
<tr>
<td>
<p>Enlace importante</p>
</td>
<td>
<button>Enviar</button>
</td>
</tr>
</table>
Explicación del problema detectado:
Esta tabla se usa únicamente para maquetar la página, pero el orden de lectura lineal no tiene sentido.
Cuando un lector de pantalla linealiza el contenido, primero lee “Bienvenido”, luego “Enlace importante”, después “Este es el texto principal”, y finalmente el botón “Enviar”.
El resultado es confuso y desordenado, porque los elementos relacionados no aparecen juntos.
Indica a que personas con discapacidad afecta y explicación de las barreras que causa
Las personas con discapacidad visual que usan lectores de pantalla reciben la información en un orden ilógico.
Esto provoca:
Dificultad para entender la estructura de la página.
Pérdida de contexto.
Mayor carga cognitiva.
Riesgo de interpretar mal la información.
2.2. Ejemplo Accesible
2.2.1. Evidencia de imagen:
a) Imagen
No se ha subido ninguna imagen.
b) Enlace de donde se ha obtenido la imagen:
No se ha indicado ningún enlace.
2.2.2 Código HTML:
<table role="presentation">
<tr>
<td>
<h2>Bienvenido</h2>
<p>Este es el texto principal de la página.</p>
<p>Enlace importante</p>
<button>Enviar</button>
</td>
</tr>
</table>
Explicación de la solución aplicada:
En este ejemplo:
La tabla se usa solo para maquetación, pero el contenido mantiene un orden lógico cuando se lee linealmente.
Todos los elementos relacionados están dentro de la misma celda, por lo que el lector de pantalla los lee en el orden correcto.
Se usa role="presentation" para indicar que la tabla no es una tabla de datos, evitando confusiones.
El resultado es una estructura coherente, comprensible y accesible para usuarios con lectores de pantalla.
