2526UdL2.4.6-A-003

De WCAG Wiki

Edición de la página como formulario

1. Información básica

Id del criterio: 2.4.6 - Encabezados y etiquetas (Nivel: AA)
Título del subcriterio: 2.4.6-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_2/2.4_Navegable/2.4.6-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.whitehouse.gov/contact/

2.1.2. Código HTML:

<label for="form_1_Address1" class="whitehouse-form__label">Address 1 Required</label><input autocomplete="address-line1" name="Address1" id="form_1_Address1" class="whitehouse-form__input whitehouse-form__field" required="" maxlength="200" type="text">

<label for="form_1_Address1" class="whitehouse-form__label">Address 1 Required</label>

<label for="form_1_Address2" class="whitehouse-form__label">Address 2</label><input autocomplete="address-line2" name="Address2" id="form_1_Address2" class="whitehouse-form__input whitehouse-form__field" maxlength="200" type="text">

<label for="form_1_Address2" class="whitehouse-form__label">Address 2</label>



Explicación del problema detectado:
En aquest formulari, els camps d'adreça estan etiquetats com a "Address 1" i "Address 2", que no són descriptius del seu propòsit o contingut.

Això fa que no es descriguin clarament què s'ha d'introduir en cada camp

Indica a que personas con discapacidad afecta y explicación de las barreras que causa
Persones amb discapacitats cognitives o de lectura.

Persones cegues o amb baixa visió que utilitzen NVDA, VoiceOver, JAWS, etc.

Persones amb limitacions físiques, dolor crònic, o que naveguen només amb teclat o control per veu.

2.2. Ejemplo Accesible

2.2.1. Evidencia de imagen:
a) Imagen

b) Enlace de donde se ha obtenido la imagen:
https://www.section508.gov/test/


2.2.2 Código HTML: 

     <header class="usa-card__header">

<a href="/test/testing-lifecycle-overview/">Testing Lifecycle</a>

     </header>

         <img src="/assets/images/thumbnails/thumb-test-lifecycle.png" alt="" aria-hidden="true">

Learn about the testing lifecycle: planning, scoping, testing, remediating issues and ongoing monitoring.

<header class="usa-card__header">

<a href="/test/testing-lifecycle-overview/">Testing Lifecycle</a>

     </header>

Learn about the testing lifecycle: planning, scoping, testing, remediating issues and ongoing monitoring.



Explicación de la solución aplicada:
En aquesta web com es pot veure a la captura i al codi si fa servir el criteri ja que els titols i subtitols descriuen a la perfecció el que mostra a continuació





Obtenido de «https://wikiwcag.udl.cat/index.php?title=2526UdL2.4.6-A-003&oldid=4746»