2526UPSA1.4.1-A-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.4_Distinguible/1.4.1-A
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:
<p>Estado de las tareas:</p>
<ul>
<li><span style="color: green;">●</span> Enviar documentación</li>
<li><span style="color: red;">●</span> Pagar matrícula</li>
<li><span style="color: green;">●</span> Revisar correo</li>
</ul>
<p>Leyenda: Verde = Listo, Rojo = Pendiente</p>
Explicación del problema detectado:
En este listado de tareas, el estado ("listo" o "pendiente") se indica únicamente mediante el color de un círculo (verde o rojo). No hay ningún texto ni forma alternativa que diferencie un estado del otro.
Indica a que personas con discapacidad afecta y explicación de las barreras que causa
Las personas con daltonismo (dificultad para distinguir rojo y verde) o personas que utilizan dispositivos con pantalla monocroma (blanco y negro) no pueden diferenciar qué tareas están pendientes y cuáles están terminadas, perdiendo información crítica.
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:
<p>Estado de las tareas:</p>
<ul>
<li>
<span style="color: green;"><strong>[LISTO]</strong></span>
Enviar documentación
</li>
<li>
<span style="color: red;"><strong>[PENDIENTE]</strong></span>
Pagar matrícula
</li>
<li>
<span style="color: green;"><strong>[LISTO]</strong></span>
Revisar correo
</li>
</ul>
Explicación de la solución aplicada:
Se ha añadido una etiqueta de texto explícita ([LISTO] y [PENDIENTE]) junto al color. De esta forma, la información se transmite por dos canales: el color (para quien pueda verlo) y el texto (para todos los usuarios). Ya no se depende exclusivamente de la percepción cromática.
