Cómo usar esta herramienta de texto
- Pega el HTML del formulario.
- Elige si aria-label debe contar como nombre alternativo en este primer filtro.
- Ejecuta el análisis.
- Corrige asociaciones for/id y verifica después el árbol de accesibilidad.
Comprobador de etiquetas de formularios
Analiza un fragmento de formulario HTML para comprobar si inputs, selects y textareas tienen una etiqueta asociada de forma reconocible. Detecta label for sin destino, controles sin id, labels vacíos y campos que dependen solo de placeholder o aria-label. El informe ayuda a localizar omisiones rápidamente, aunque el nombre accesible final debe confirmarse en la interfaz real.
Entrada de texto
Procesamiento localEspacio publicitario
Qué hace esta herramienta
Comprueba asociaciones explícitas y labels envolventes, además de un apoyo opcional para aria-label. El placeholder por sí solo se marca como insuficiente.
DOMParser analiza controles input, select y textarea. Para cada uno busca label[for=id], un label ancestro o aria-label según la opción. También valida labels for que apuntan a ids inexistentes.
Un control puede obtener un nombre mediante aria-labelledby u otros patrones que esta revisión no resuelve por completo.
Ejemplo
Correcto: <label for="email">Correo</label> + <input id="email">.
Revisar: un input con solo placeholder="Correo".
Casos de uso
- Auditar formularios antes de QA.
- Revisar snippets de un CMS.
- Detectar asociaciones for/id rotas tras refactorizar componentes.
- Comprobar campos que dependen solo de placeholder.
Consejos para obtener mejores resultados
- Asocia cada etiqueta visible con su control mediante for/id o envolviendo el control.
- No uses placeholder como sustituto de una etiqueta persistente.
- Mantén ids únicos dentro del documento.
- Agrupa conjuntos de opciones con fieldset y legend cuando corresponda.
- Comprueba mensajes de error y ayudas además del nombre del campo.
Detalles del procesamiento
El HTML se analiza de forma local y aislada. La herramienta no envía formularios ni ejecuta scripts contenidos en el fragmento.
No reproduce completamente el algoritmo de nombre accesible ni analiza componentes encapsulados en Shadow DOM o generados después mediante JavaScript.
Preguntas frecuentes
¿Un placeholder cuenta como etiqueta accesible de un campo de formulario?
No debería usarse como sustituto de una etiqueta persistente. Puede desaparecer al escribir y no ofrece la misma relación semántica que un label correctamente asociado.
¿Cómo detecta la herramienta un label asociado a un input?
Busca una coincidencia entre for e id, o un elemento label que envuelva directamente el control. Opcionalmente también puede considerar aria-label.
¿Qué ocurre si un label tiene for pero el id no existe?
Se marca como asociación rota porque esa etiqueta no queda vinculada al control esperado.
¿aria-label puede reemplazar siempre a un label visible?
No. Puede proporcionar un nombre accesible en algunos casos, pero una etiqueta visible suele ser importante para todas las personas usuarias y debe preferirse cuando corresponde.
¿El comprobador revisa fieldset, legend y mensajes de error?
Esta versión se centra en la presencia y asociación básica de labels para inputs, selects y textareas; los grupos y errores requieren una revisión adicional.
Herramientas de texto relacionadas
Resumen del formulario
| Métrica | Qué indica |
|---|---|
| Controles | Controles de formulario |
| Con nombre | Controles con nombre detectado |
| Avisos | Elementos con avisos |
Más herramientas de Herramientas de accesibilidad
Explora herramientas relacionadas dentro de esta categoría.
Ver categoría: Herramientas de accesibilidad