Inicio › Recursos › Criterio WCAG

Etiquetado de formularios según las WCAG

Cada campo de formulario debe tener una etiqueta asociada por programa, para que quienes usan lector de pantalla sepan qué introducir y para que al hacer clic en la etiqueta el foco pase al campo.

El camino correcto

<label for="email">Correo electrónico</label><input id="email"> — o incluir el campo dentro del <label>. aria-label / aria-labelledby solo cuando no es posible una etiqueta visible.

Por qué un placeholder no basta

El placeholder desaparece al escribir, a menudo tiene poco contraste y algunos lectores de pantalla no lo reconocen como etiqueta.

Mensajes de error

Vincular el error al campo (aria-describedby) y formular el texto de forma concreta («Introduce un correo electrónico válido», no «Error»).

Cómo ayuda a11yglass

El escaneo gratuito comprueba el HTML y el CSS entregados en busca de incumplimientos de las WCAG detectables automáticamente e indica en cada hallazgo el criterio de conformidad y una medida concreta. Detecta aproximadamente el 20–35 % de los problemas y no sustituye una auditoría completa.

Seguir leyendo

• Textos alternativos según WCAG 1.1.1
• Manejo por teclado según WCAG 2.1.1
• Foco visible según WCAG 2.4.7

Información general según nuestro leal saber y entender, sin valor de asesoramiento jurídico. Para un caso concreto, consultar a un despacho especializado en derecho de las tecnologías de la información.