2526UFV1.3.1-O-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.1-O
2. Ejemplos prácticos
2.1. Ejemplo NO accesible
a) Imagen
b) Enlace de donde se ha obtenido la imagen:
No se ha indicado ningún enlace.
2.1.2. Código HTML:
<label for="pais">País</label>
<select id="pais" name="pais">
<option>España</option>
<option>Francia</option>
<option>Japón</option>
<option>India</option>
<option>Marruecos</option>
<option>Egipto</option>
</select>
Explicación del problema detectado:
En este selector hay opciones que pertenecen a categorías (por ejemplo, continentes), pero en el código no se expresa esa relación de forma programática.
Cuando no se agrupan, el desplegable se convierte en una lista plana, y se pierde el “contexto” de qué opciones están relacionadas entre sí (Europa, Asia, África, etc.).
Indica a que personas con discapacidad afecta y explicación de las barreras que causa
Visual total: con lector de pantalla o línea braille, al no existir grupos anunciables, cuesta más entender la organización del listado y localizar opciones relacionadas, sobre todo si hay muchas.
Sordoceguera: al depender mucho de la estructura (braille y navegación por elementos), la ausencia de agrupación hace más lenta la búsqueda y aumenta la carga cognitiva, porque no hay “bloques” por categorías.
2.2. Ejemplo Accesible
2.2.1. Evidencia de imagen:
a) Imagen
b) Enlace de donde se ha obtenido la imagen:
No se ha indicado ningún enlace.
2.2.2 Código HTML:
<label for="pais">País</label>
<select id="pais" name="pais">
<optgroup label="Europa">
<option>España</option>
<option>Francia</option>
</optgroup>
<optgroup label="Asia">
<option>Japón</option>
<option>India</option>
</optgroup>
<optgroup label="África">
<option>Marruecos</option>
<option>Egipto</option>
</optgroup>
</select>
Explicación de la solución aplicada:
He añadido <optgroup> con label para que la agrupación sea detectable por software (navegador/tecnologías de apoyo) y pueda anunciarse como “grupo Europa”, “grupo Asia”, etc., antes de leer sus opciones.
Así, quienes navegan con lector de pantalla o braille pueden orientarse mejor dentro del desplegable, saltar mentalmente por categorías y encontrar la opción correcta con menos esfuerzo.
