Un campo de formulario sin una etiqueta correctamente vinculada es el error más común que encontramos en formularios de contacto, pasos de compra y pantallas de inicio de sesión. La etiqueta suele estar presente, visualmente bien colocada encima o al lado del campo de entrada, pero en el código fuente no está vinculada a ese campo. Un lector de pantalla entonces lee el campo como "editar, vacío" sin indicar para qué sirve.
El problema suele surgir porque una etiqueta y un campo de entrada se ven visualmente relacionados, pero el programador (o el sistema de construcción) no ha establecido una relación técnica entre ambos. Para un usuario vidente esto no importa: simplemente ve la etiqueta. Para alguien que usa un lector de pantalla, esa proximidad visual no existe. Lo que cuenta es la vinculación en el código, y con frecuencia está ausente, incluso en sitios que se ven bien presentados.
Tres variantes del mismo error
La forma más común es la etiqueta que está en pantalla pero existe de forma independiente del campo en el código, sin vinculación técnica. La segunda forma es el uso de texto de marcador de posición en el campo mismo como única explicación: cuando el usuario comienza a escribir, ese texto desaparece, y además un lector de pantalla no siempre trata un marcador de posición como una etiqueta completa. La tercera forma la ve principalmente con iconos: un campo de búsqueda solo con un icono de lupa, o un botón solo con un pictograma, sin texto que un lector de pantalla pueda leer.
Todas estas variantes tienen en común que el error generalmente no es intencional. Nadie construye un formulario para hacerlo inaccesible. Sucede porque una etiqueta se ve correcta visualmente y el constructor asume que eso es suficiente, mientras que la vinculación técnica es un paso separado que fácilmente se omite, especialmente bajo presión de tiempo o en una plantilla que originalmente no se construyó pensando en la accesibilidad.
Por qué esto tiene más peso de lo que parece
Un formulario suele ser el punto en el que un visitante realmente quiere resolver algo: completar un pedido, crear una cuenta, ponerse en contacto. Si la etiqueta falta precisamente en ese momento, el proceso se interrumpe para parte de sus visitantes, mientras que el resto del sitio funciona perfectamente. Los organismos de supervisión y los evaluadores suelen revisar primero este tipo de problemas en formularios, porque tienen un impacto directo en si alguien puede utilizar un servicio.
Además, este error se propaga fácilmente. Una etiqueta sin vinculación en una plantilla para un campo de dirección aparece a menudo en decenas de páginas a la vez, porque el mismo componente se reutiliza en todas partes. Una vinculación omitida en la base afecta así a todo el paso de compra o toda la pantalla de inicio de sesión.
Cómo lo prueba, y dónde un escaneo automático tiene sus límites
Un escaneo automático detecta bien parte de estos errores: ve si una etiqueta está técnicamente vinculada a un campo y si un campo de entrada no tiene nombre en absoluto. Lo que un escaneo evalúa con más dificultad es si una etiqueta es apropiada en contenido, si un marcador de posición como única explicación es suficientemente claro, y si el orden de lectura para un lector de pantalla parece lógico. Es precisamente por eso que en cada informe mencionamos qué valida una prueba automática y qué no; así sabrá qué más necesita revisarse manualmente.
Si desea formarse una primera impresión por su cuenta, la prueba más simple es navegar por el formulario solo con el teclado y verificar que cada campo reciba un nombre claro cuando navegue a él. Para una visión más completa, incluyendo el paso de compra y el flujo de inicio de sesión, le ayuda el escaneo completo que mira más allá de la página de inicio para ver dónde faltan etiquetas o están desvinculadas de su campo.
Lo que un widget de superposición no resuelve aquí
Un widget de accesibilidad pegado encima del sitio no puede reparar una vinculación faltante entre una etiqueta y un campo; esa vinculación está en el código fuente y debe modificarse allí. Esta es una de las razones por las que no vendemos superposiciones: ocultan este tipo de errores a la vista, pero un lector de pantalla no nota nada.
La solución en sí suele ser limitada en alcance: el desarrollador vincula la etiqueta al campo, reemplaza un marcador de posición usado como etiqueta por una etiqueta real, o añade texto invisible a un botón de icono. No es una gran reforma, pero sí es trabajo que debe realizarse de forma dirigida, por cada formulario y por cada plantilla. En la base de conocimientos con explicaciones por tema descubrirá cómo estos errores y otros similares se relacionan con los requisitos de EN 301 549.
Después de la reparación: documentar y controlar
Una etiqueta que repara ahora puede desaparecer en la siguiente modificación de la plantilla, por ejemplo cuando un diseñador rediseña el formulario sin volver a verificar la vinculación. Por eso, una corrección no solo debe resolverse técnicamente, sino también incluirse en el plan de mejora, de modo que quede claro quién es responsable y cuándo se volverá a verificar. Cómo organizamos ese control y esa repetición se explica en la página sobre cómo se realiza la evaluación.
Si duda de si sus propios formularios contienen este error, a menudo puede verlo con unos pocos minutos de navegación por teclado. Si quiere un enfoque estructurado con una lista priorizada, eso comienza con el análisis rápido gratuito, o primero consulte las preguntas frecuentes sobre qué controla y qué no controla un análisis.