Cómo corregir accesibilidad HTML sin alterar la interacción.
Las correcciones de HTML semántico deben conservar la funcionalidad y probarse en contexto. Añadir ARIA no sustituye elegir el elemento nativo correcto.
Adapta el flujo de trabajo a tu tarea.
Identifica el propósito real del control y elige semántica nativa adecuada, conservando su comportamiento. Añade los nombres o información de estado necesarios y verifica teclado, foco e interacción con formularios en el contexto completo.
- Qué aportas
- Fragmento HTML y problema de accesibilidad indicado.
- Qué obtienes
- Corrección propuesta del marcado semántico con notas de revisión.
Mira la entrada y el resultado.
Entrada y salida ilustrativas · ejemplo didáctico, no una ejecución de WebAct en directo
Ejemplo campo
Replace <div onclick="submitForm()">Send message</div> in an existing HTML form. The form's submit handler already performs validation and calls submitForm().
Ejemplo completo
<button type="submit">Send message</button> The native submit button uses the existing form submission path. Verify Enter/Space interaction, visible focus, validation errors and prevention of duplicate sends. Do not retain a second click handler that also calls submitForm().
Carga esta entrada en el prompt y cópialo en WebAct para probar la tarea. Tu resultado puede diferir del ejemplo.
Decisiones y solución de problemas.
¿Añadir solo un rol ARIA convierte un div en un botón completo?
No implementa automáticamente el comportamiento de teclado ni la semántica de formulario. Prefiere un botón nativo si corresponde al control previsto.
¿Por qué sustituir un elemento clicable envía el formulario inesperadamente?
Comprueba el tipo de botón. Un control para una acción normal puede necesitar type="button" en lugar del comportamiento de envío.
Pruébalo con tu propia fuente.
Sustituye el ejemplo por tu material en el prompt. Conserva los requisitos que necesites y copia la tarea en WebAct.
Personalizar y copiar la tarea ↑