Diferencia entre revisiones de «2526Udl1.3.1-O-001»
Página creada con «{{ActividadWCAG |id_criterio=1.3.1 - Información y relaciones (Nivel: A) |id_subcriterio=1.3.1-O |id_universidad=UdL |curso_academico=2025-26 |enlace=https://wikiwcag.udl.cat/Principio_1/1.3_Adaptable#1.3.1_-_Informaci%C3%B3n_y_relaciones_-_Nivel:_A |noa_barrera_evidencia_img=Noaccessible1.png |noa_barrera_evidencia_html=<nowiki> <option> -- Selecciona una categoria --</option> <option>Problemes web</option> <option>Accés al compte…» |
Sin resumen de edición |
||
| Línea 42: | Línea 42: | ||
</select> | </select> | ||
</nowiki> | </nowiki> | ||
|acc_barrera_explicacion= | |acc_barrera_explicacion=L’etiqueta <optgroup> amb l’atribut label per tal que l’agrupació sigui detectable pel programari. Això permet que l’estructura lògica pugui ser interpretada correctament per les eines d’accessibilitat. | ||
Així, les persones poden comprendre millor l’organització interna del desplegable abans d’explorar-ne els elements. El fet que el lector anunciï primer el nom del grup proporciona un context previ que facilita la presa de decisions i evita haver de recórrer tota la llista sense referències clares. | Així, les persones poden comprendre millor l’organització interna del desplegable abans d’explorar-ne els elements. El fet que el lector anunciï primer el nom del grup proporciona un context previ que facilita la presa de decisions i evita haver de recórrer tota la llista sense referències clares. | ||
}} | }} | ||
Revisión actual - 14:27 14 feb 2026
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_-_Informaci%C3%B3n_y_relaciones_-_Nivel:_A
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:
<option> -- Selecciona una categoria --</option>
<option>Problemes web</option>
<option>Accés al compte</option>
<option>Dubtes factura</option>
<option>Devolució</option>
<option>Suggeriments</option>
<option>Treballa amb nosaltres</option>
Explicación del problema detectado:
En aquest selector hi ha opcions que pertanyen a diferents categories, però en el codi no s’han agrupat de cap manera que en faciliti la comprensió. Quan es mostra el desplegable, totes les opcions apareixen en una llista plana, sense cap classe d’estructura visual que ajudi a identificar a quina categoria correspon cada element. Això fa que es perdi el fil amb facilitat i dificulta la lectura.
Indica a que personas con discapacidad afecta y explicación de las barreras que causa
Discapacitat cognitiva o dificultats d’atenció: sense categories que estructurin el contingut, la llista es percep com un conjunt desordenat. Això pot generar desorientació i dificultar la presa de decisions.
Persones amb dislèxia: una llista llarga i sense jerarquia visual clara pot resultar més difícil de processar, especialment si no hi ha patrons o agrupacions que ajudin a anticipar el contingut.
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="motivo-consulta">Selecciona el motiu de la teva consulta:</label>
<select id="motivo-consulta" name="consulta" required>
<option>-- Tria una opció --</option>
<optgroup label="Suport Tècnic">
<option>Problemes amb la pàgina web</option>
<option>No puc accedir al meu compte</option>
</optgroup>
<optgroup label="Facturació i Vendes">
<option>Dubtes sobre una factura</option>
<option>Sol·licitar una devolució</option>
</optgroup>
<optgroup label="Altres">
<option>Suggeriments de millora</option>
<option>Treballa amb nosaltres</option>
</optgroup>
</select>
Explicación de la solución aplicada:
L’etiqueta <optgroup> amb l’atribut label per tal que l’agrupació sigui detectable pel programari. Això permet que l’estructura lògica pugui ser interpretada correctament per les eines d’accessibilitat.
Així, les persones poden comprendre millor l’organització interna del desplegable abans d’explorar-ne els elements. El fet que el lector anunciï primer el nom del grup proporciona un context previ que facilita la presa de decisions i evita haver de recórrer tota la llista sense referències clares.
