Como corrigir acessibilidade HTML preservando a interação.
Correções semânticas de HTML devem preservar funcionalidade e ser testadas no contexto. Adicionar ARIA não substitui escolher o elemento nativo correto.
Adapte o fluxo à sua tarefa.
Identifique o propósito real do controle e escolha semântica nativa adequada, preservando o comportamento. Acrescente nomes ou estados necessários e verifique teclado, foco e interações de formulário no contexto completo.
- O que você fornece
- Trecho HTML e problema de acessibilidade especificado.
- O que você recebe
- Correção semântica proposta com notas de revisão.
Veja a entrada e o resultado.
Entrada e saída ilustrativas · exemplo didático, não uma execução real do WebAct
Exemplo campo
Replace <div onclick="submitForm()">Send message</div> in an existing HTML form. The form's submit handler already performs validation and calls submitForm().
Exemplo 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().
Carregue esta entrada no prompt e copie para o WebAct para testar a tarefa. Seu resultado pode ser diferente da ilustração.
Decisões e solução de problemas.
Adicionar apenas um papel ARIA transforma uma div em um botão completo?
Isso não implementa automaticamente comportamento de teclado nem semântica de formulário. Prefira um botão nativo quando corresponder ao controle pretendido.
Por que trocar um elemento clicável envia o formulário inesperadamente?
Confira o tipo do botão. Um controle para ação comum pode precisar de type="button" em vez de comportamento de envio.
Teste com sua própria fonte.
Substitua o exemplo pelo seu material no prompt. Mantenha os requisitos necessários e copie a tarefa para o WebAct.
Personalizar e copiar a tarefa ↑