Esta traducción aún no ha sido revisada editorialmente. La versión alemana es la vinculante. Deutsche Fassung →
Barrierefreiheit
¿Por qué cada campo de formulario necesita una etiqueta?
Todo campo de formulario necesita una etiqueta porque los visitantes de otro modo adivinarían qué va allí. La etiqueta se encuentra permanentemente visible junto al campo — «Nombre», «Dirección de correo», «Mensaje» — y está técnicamente vinculada a él para que los lectores de pantalla la anuncien. El texto de ejemplo gris en el campo no es suficiente: desaparece al escribir. El criterio WCAG 3.3.2 requiere etiquetas o instrucciones para cada entrada.
El texto de ejemplo en el campo no reemplaza una etiqueta
Muchos formularios modernos omiten las etiquetas visibles e insertan texto de ejemplo gris directamente en los campos. Se ve ordenado, pero crea tres problemas. Primero: tan pronto como el visitante comienza a escribir, el texto desaparece — quien fue distraído brevemente no sabe qué era cada campo en un formulario parcialmente lleno. Segundo: el texto gris tiene poco contraste y es difícil de leer para las personas con baja visión. Tercero: sin vinculación técnica, el lector de pantalla solo dice «campo de entrada» cuando accede al campo — el visitante ciego nunca se entera de qué va allí. Una etiqueta permanente arriba o al lado del campo, técnicamente vinculada a él, resuelve los tres problemas a la vez.
Así mide el servicio de comprobación las etiquetas
El servicio de comprobación cuenta todos los campos de entrada visibles en su página en un navegador real y comprueba para cada uno si existe una etiqueta técnicamente vinculada — como etiqueta clásica, como etiqueta envolvente o como nombre accesible en el código. Si todos los campos están etiquetados, el criterio se considera cumplido. Si falta la etiqueta de incluso un campo, el informe emite una infracción y nombra el número de campos afectados junto con evidencia. Un campo sin etiqueta también cuenta contra el criterio de robustez 4.1.2, ya que le falta al campo su nombre accesible. Si las etiquetas existentes están formuladas claramente, una persona lo juzga en el estándar Oro.
Beispiele
Platzhalter als einzige Beschriftung
<input type="text" placeholder="Nachname"><label for="nachname">Nachname</label>
<input id="nachname" type="text">Der Platzhalter verschwindet beim Tippen. Ein label bleibt und ist für Vorleseprogramme der Name des Feldes.
- Revise cada formulario en su sitio web y compruebe: ¿hay una etiqueta permanentemente visible en cada campo?
- Reemplace las soluciones de texto de ejemplo con etiquetas reales sobre el campo — el texto de ejemplo puede permanecer adicionalmente.
- Pida a su agencia que vincule técnicamente cada etiqueta con su campo para que los lectores de pantalla la anuncien.
- Agregue una instrucción para campos con requisitos de formato, como «Fecha en formato DD.MM.AAAA», visible antes de la entrada.
- Escriba un formulario a mitad y compruebe si posteriormente puede asignar cada campo.