2526UdL1.3.2-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.3_Adaptable/1.3.2-A
2. Ejemplos prácticos
2.1. Ejemplo NO accesible
a) Imagen
b) Enlace de donde se ha obtenido la imagen:
https://www.ticketmaster.es/artist/bruno-mars-entradas/346863#galeria
2.1.2. Código HTML:
<span id="galeria">
<h2>Galeria</h2>
<div role="group">
<span role="status" aria-live="polite">
<button disabled>...</button>
<ul>...</ul>
<button>...</button>
</div>
Explicación del problema detectado:
Se observa que la sección de galería presenta una estructura donde los controles interactivos del carrusel aparecen inmediatamente después del encabezado de sección, incluyendo elementos con roles dinámicos y regiones aria-live. Esta organización puede provocar que tecnologías de asistencia anuncien controles antes de proporcionar contexto suficiente sobre el contenido, generando una secuencia de lectura potencialmente incoherente y susceptible de incumplir el criterio WCAG 1.3.2.
Indica a que personas con discapacidad afecta y explicación de las barreras que causa
Sobre todo afecta a personas con dificultades visuales que deben usar un lector de web provocando que les falte contexto, desorganizacion mental, desconcierto y no poder navegar con tranquilidad o certeza
2.2. Ejemplo Accesible
2.2.1. Evidencia de imagen:
a) Imagen
b) Enlace de donde se ha obtenido la imagen:
https://www.bbc.com/sport/articles/c78v857elp9o
2.2.2 Código HTML:
<header>
<h1>BBC News</h1>
<nav>
<ul>
<li><a href="/news">News</a></li>
<li><a href="/sport">Sport</a></li>
<li><a href="/weather">Weather</a></li>
</ul>
</nav>
</header>
<main>
<article>
<h2>Latest Headlines</h2>
<p>Here are the top stories today...</p>
</article>
</main>
<footer>
<p>© BBC</p>
</footer>
Explicación de la solución aplicada:
La BBC es considerada un ejemplo de accesibilidad web porque su contenido está estructurado semánticamente con el orden del contenido en el código siguiendo un sentido lógico (facilitando la lectura por pantallas y otros dispositivos). Tiene patrones internalizados para que todos sus desarrolladores sigan buenas prácticas accesibles y ofrece herramientas como navegación por teclado, subtítulos, roles ARIA y jerarquía lógica de encabezados.
