Principio 3/3.3 Assistencia en los input/3.3.2-B

De WCAG Wiki

3.3.2-B. Ubicación de etiquetas

Discapacidades afectadas

Este criterio puede afectar a distintas personas con discapacidad. A continuación se indican las más relevantes.

Enunciado del criterio (Observatorio de Accesibilidad Web)

  • Las etiquetas de los campos del formulario deben colocarse de forma que su relación con el campo sea evidente.

Comprensión del criterio

Descripción resumida

Las etiquetas se deben ubicar cerca del campo correspondiente y de forma consistente para facilitar su asociación.

Objetivo

Asegurar claridad visual y semántica entre etiqueta y campo, reduciendo errores y carga cognitiva.

Importancia de cumplir el criterio

Una etiqueta ubicada lejos o mal alineada confunde a usuarios con discapacidad cognitiva o baja visión y genera errores al completar formularios.

Referencias WCAG

  • Understanding SC 3.3.2

    • Recursos de apoyo

    Evaluación del criterio

    Tipo de evaluación

    Evaluación Manual

    Procedimiento de evaluación

    1. Paso 1. Localizar los formularios existentes.
    2. Paso 2. Verificar que la posición de las etiquetas respecto a su campo de formulario respectivo resulta obvia.

    Resultado esperado

    Las etiquetas están próximas a los campos y su relación es clara.

    Ejemplo

    Etiqueta encima del campo 

    <label for="email">Correo electrónico</label>
<input id="email" type="email">

    Otras herramientas de evaluación

    • Inspección visual: comprobar que las etiquetas están colocadas de forma que su relación con el campo correspondiente sea clara (p. ej., justo encima o a la izquierda del campo, o alineadas consistentemente en formularios).
    • Prueba de proximidad y alineación: verificar que la separación entre etiqueta y campo no genera ambigüedad y que la alineación visual facilita la lectura y la asociación inmediata.
    • Lectores de pantalla: (NVDA, JAWS, VoiceOver) confirmar que las etiquetas están correctamente asociadas y se anuncian cuando el usuario entra en el campo, incluso si la posición visual está personalizada.
    • Inspección del DOM: revisar el uso de <label for> y la estructura del formulario para garantizar que la presentación CSS no rompe la relación visual entre etiqueta y campo.










    Ejemplos accesibles y no accesibles creados por alumnos

    Comentarios

    A continuación se muestran comentarios sobre el criterio 3.3.2-B. Ubicación de etiquetas

    Loading comments...




    Obtenido de «https://wikiwcag.udl.cat/index.php?title=Principio_3/3.3_Assistencia_en_los_input/3.3.2-B&oldid=3560»