5.1.1.20 - Requisitos para retorno (feedback) fornecido pela aplicação
Descrição
Todo retorno (feedback) fornecido pela aplicação deve ser percebido por todos os usuários e por recursos de tecnologia assistiva. Ações de interação do usuário, como o acionamento de botões e elementos interativos, devem fornecer um retorno (feedback) perceptível a todos os usuários. Esse retorno (feedback) pode ser visual, mas também deve oferecer alternativas para os usuários de tecnologia assistiva.
Exemplo
Uma janela de alerta é exibida para o usuário com informações sobre um erro. Essa janela contém uma mensagem visual e também é lida por usuários de leitores de tela.
Desempenho funcional
Cenários para desenvolvimento de interfaces
Escolha um perfil para ver as orientações específicas:
Compreenda que o sistema precisa funcionar bem com as tecnologias assistivas disponíveis ao usuário, pois são a forma que essas pessoas tem de acessar o conteúdo da aplicação. Dessa forma, garanta que as ações de interação (como cliques em botões ou envio de formulários) forneçam feedback claro e visível, como mudanças de cor, animações ou mensagens. Além disso, considere alternativas, como sons ou vibrações, para reforçar a percepção da ação.
Desenhe o retorno de cada ação
Toda ação precisa de uma resposta perceptível, com texto além da animação.
Certo: Retorno com mensagem
anotação de especificação
Após salvar: mensagem "Alterações salvas" + ícone ✓.
Errado: Retorno só com animação
anotação de especificação
Após salvar: o botão pisca rapidamente, sem mensagem.
Implemente feedback visual e adicional, como notificações sonoras ou vibrações, e assegure-se de que as ações dos elementos interativos sejam anunciadas por tecnologias assistivas, usando atributos como aria-live ou role="alert", para garantir que todos os usuários recebam o feedback.
O que o leitor de tela anuncia
Mensagens de retorno devem ficar numa região que o leitor de tela anuncia.
Certo: Mensagem anunciada
<div role="status"> Alterações salvas </div>Leitor de tela anuncia: "Alterações salvas"
Errado: Mensagem só visual
<div class="toast"> Alterações salvas </div>Leitor de tela anuncia: nada: a mensagem aparece, mas não é anunciada
Aprenda a fazer com conteúdos selecionados para você
Estabeleça diretrizes para garantir que toda a equipe considere múltiplas formas de fornecer feedback perceptível, tanto para usuários visuais quanto para aqueles que utilizam tecnologias assistivas, promovendo uma experiência inclusiva e satisfatória.
Liste as ações que exigem retorno
Salvar, enviar, excluir e erros precisam de retorno visual e anunciado.
Checklist do requisito 5.1.1.20: tela "Perfil"
- mensagem anunciada
Salvar perfil
ação
- progresso anunciado
Enviar foto
ação
- pendente
Excluir conta
ação
2 de 3 ações em conformidade, 1 pendente de revisão.
Verificar feedback visual e sonoro
Certifique-se de que, ao interagir com botões e outros elementos interativos, a aplicação oferece feedback visual claro (ex.: mudança de cor, animações) e, quando possível, um retorno auditivo.
Usar leitores de tela
Teste com leitores de tela para verificar se eles anunciam o feedback de ações realizadas, como "botão pressionado" ou "formulário enviado com sucesso".
Implementar feedback alternativo
Garanta que o feedback fornecido pela aplicação esteja disponível em formatos acessíveis. Se a resposta for apenas visual, adicione um retorno que possa ser captado por tecnologias assistivas (ex.: atributos de ARIA para indicar mudanças de estado).
Testar com diferentes usuários
Simule o uso com pessoas que dependem de tecnologias assistivas para confirmar que o feedback de interações é percebido por todos.
Avaliar consistência do feedback
Verifique se todas as interações semelhantes fornecem feedback consistente em todos os casos para evitar confusão.
Adicionar vibração e sons
Em dispositivos móveis, considere implementar feedback por vibração ou sons curtos, que podem ser percebidos por pessoas com baixa visão.
Execute ações com leitor de tela
Acione cada botão e confira se o resultado é anunciado sem mover o foco.
Certo: Retorno percebido
"Salvar, botão"
"Alterações salvas"
A pessoa sabe que a ação funcionou.
Errado: Retorno silencioso
"Salvar, botão"
mensagem visual não anunciada
A pessoa não sabe se salvou.
Crie textos de feedback das interações do usuário que sejam descritivos e informativos, para que os usuários compreendam o resultado de suas interações. Garanta que esses textos sejam visíveis e acessíveis também para usuários de tecnologias assistivas.
Escreva mensagens de retorno informativas
Diga o que aconteceu e, se for o caso, o próximo passo.
Certo: Mensagem específica
mensagem de retorno
"Pedido enviado. Você receberá a confirmação por e-mail."
Resultado e próximo passo.
Errado: Mensagem genérica
mensagem de retorno
"Sucesso!" · "Erro"
Não diz o que aconteceu.
Requisitos relacionados
Outros requisitos que se aplicam aos mesmos componentes.