2526UFV1.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><span style="color:#c00;">Fields in red are required</span></p>
<label style="color:#c00;">Email</label>
<input type="email" />
<label>Phone (optional)</label>
<input type="tel" />
Explicación del problema detectado:
The form indicates required fields only through red color. Users who cannot perceive color differences may not know which fields are required. This fails because color is used as the only way to convey information.
Indica a que personas con discapacidad afecta y explicación de las barreras que causa
Users with color vision deficiency or low vision may miss required fields and be unable to complete the form successfully, causing errors and frustration.
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>Fields marked with <strong>*</strong> are required.</p>
<label for="email">
Email <span aria-hidden="true" style="color:#c00;">*</span>
<span style="position:absolute;left:-9999px;">(required)</span>
</label>
<input id="email" type="email" required />
<label for="phone">Phone (optional)</label>
<input id="phone" type="tel" />
Explicación de la solución aplicada:
Required status is communicated through an asterisk and text (“(required)”) in addition to color, so the information is not conveyed by color alone.
