2526UdL4.1.3-A-001

De WCAG Wiki
Revisión del 21:28 18 feb 2026 de 202526UdL20 (discusión | contribs.) (Página creada con «{{ActividadWCAG |id_criterio=4.1.3 - Mensajes de estado (Nivel: AA) |id_subcriterio=4.1.3-A |id_universidad=UdL |curso_academico=2025-26 |enlace=https://wikiwcag.udl.cat/Principio_4/4.1_Compatible/4.1.3-A |noa_barrera_evidencia_img=Captura de pantalla 2026-02-18 215920.png |noa_barrera_evidencia_url=https://www.temu.com |noa_barrera_evidencia_html=<nowiki> </svg> "¡Selecciona color!" </span> </nowiki> |noa_barrera_explicacion=Esta alerta debería indicarse con una pr…»)
(difs.) ← Revisión anterior | Revisión actual (difs.) | Revisión siguiente → (difs.)

Edición de la página como formulario

1. Información básica

Id del criterio: 4.1.3 - Mensajes de estado (Nivel: AA)
Título del subcriterio: 4.1.3-A
Universidad participante: UdL
Curso académico: 2025-26

Enlace directo a la página del subcriterio en la wiki https://wikiwcag.udl.cat/Principio_4/4.1_Compatible/4.1.3-A



2. Ejemplos prácticos

2.1. Ejemplo NO accesible

2.1.1. Evidencia en imagen y enlace:
a) Imagen

b) Enlace de donde se ha obtenido la imagen:
https://www.temu.com

2.1.2. Código HTML:

</svg> "¡Selecciona color!" </span>



Explicación del problema detectado:
Esta alerta debería indicarse con una propiedad ARIA de role="alert", para que el asistente de voz pueda leer el cambio que ha ocurrido en pantalla y que el usuario no pierda nada de información y pueda terminar la tarea que estaba realizando.

Indica a que personas con discapacidad afecta y explicación de las barreras que causa
Las personas que se ven afectadas por este error son los usuarios con discapacidad visual total; estos necesitan asistentes de voz, por eso es necesario que cada elemento tenga una etiqueta marcada y ordenada.


2.2. Ejemplo Accesible

2.2.1. Evidencia de imagen:
a) Imagen

b) Enlace de donde se ha obtenido la imagen:
https://www.bershka.com


2.2.2 Código HTML:

<div role="alert" aria-labelledby="....">....<h4> Has de seleccionar una talla </h4> </div>



Explicación de la solución aplicada:
A diferencia del anterior, en esta tienda vemos que el error puede ser leído gracias a la linea role=alert.