2526Udl2.2.1-B-000
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_2/2.2_Tiempo_Suficiente/2.2.1-B
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:
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="UTF-8">
<title>Redirección temporal</title>
<meta http-equiv="refresh" content="5;url=https://www.ejemplo.com">
</head>
<body>
<h1>Serás redirigido en 5 segundos…</h1>
<p>Si no te redirige automáticamente, <a href="https://www.ejemplo.com">haz clic aquí</a>.</p>
</body>
</html>
Explicación del problema detectado:
Este código crea una página que redirige automáticamente a otra después de unos segundos. Cuando alguien entra en la página, primero ve un mensaje que dice que será redirigido. Mientras tanto, el navegador espera 5 segundos. Pasado ese tiempo, la persona es enviada automáticamente a otra dirección web sin tener que hacer nada.
Esto ocurre porque hay una instrucción dentro del código que le dice al navegador: “espera 5 segundos y luego ve a esta otra página”. Durante esos segundos de espera, también aparece un enlace por si la redirección automática no funciona y el usuario quiere hacer clic manualmente.
Indica a que personas con discapacidad afecta y explicación de las barreras que causa
Una redirección con temporizador hace que la página cambie sola tras unos segundos.
Esto puede afectar especialmente a quienes dependen de ayudas técnicas o necesitan más tiempo para leer, comprender o interactuar con la página. La barrera principal es que el usuario no controla cuándo se produce ese cambio.
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:
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="UTF-8">
<title>Redirección accesible</title>
</head>
<body>
<main>
<h1>Vas a salir de esta página</h1>
<p>
Para continuar, pulsa el siguiente botón.
No serás redirigido automáticamente.
</p>
<a href="https://www.ejemplo.com">
<button type="button">
Ir a la nueva página
</button>
</a>
<p>
Puedes permanecer en esta página el tiempo que necesites.
</p>
</main>
</body>
</html>
Explicación de la solución aplicada:
Este código muestra una página que informa al usuario de que va a salir a otro sitio, pero no lo redirige automáticamente. En lugar de cambiar la página por sí sola después de unos segundos, ofrece un botón para que la persona decida cuándo quiere continuar.
Esto es accesible porque no hay ningún temporizador que obligue a actuar rápido. La persona mantiene el control en todo momento.
