← Todos os guias
Acessibilidade

Acessibilidade para quem está começando

Uma revisão prática de teclado, foco, rótulos, contraste e movimento — sem tratar uma lista como certificação.

Acessibilidade faz parte da forma como a interface funciona. Não é uma camada aplicada ao fim. Comece pelos elementos nativos do navegador e só acrescente comportamentos personalizados quando eles forem necessários.

Faça a tarefa usando apenas o teclado

Use Tab e Shift+Tab para percorrer controles. O foco precisa estar visível e seguir uma ordem compreensível. Links devem navegar e botões devem executar ações. Uma janela modal deve manter a interação no contexto da janela e permitir uma saída previsível.

Todo controle precisa de nome

Campos precisam de rótulos persistentes. Botões só com ícones precisam de um nome acessível. Ajudas e erros devem estar associados ao campo correto. Um placeholder não substitui o rótulo.

Cor não pode trabalhar sozinha

Use texto, ícones ou forma para reforçar sucesso, erro e seleção. Como referência WCAG AA, texto comum pede contraste de pelo menos 4,5:1; texto grande pode usar 3:1 conforme a definição do critério. A avaliação completa inclui outras condições e critérios.

Respeite espaço e movimento

Teste zoom e aumento de texto sem perda de informação. Não faça uma ação depender só de um gesto de arrastar. Animações devem respeitar a preferência por movimento reduzido e oferecer pausa quando necessário.

Teste com tecnologias assistivas

Um verificador automático detecta parte dos problemas, mas não comprova usabilidade. Combine inspeção técnica com testes de tarefas e leitura por tecnologia assistiva no ambiente do público.

Comece por um fluxo: buscar um termo, abrir detalhes, copiar o prompt e voltar à busca. Confirme que cada etapa pode ser percebida e executada sem mouse.

Para aprofundar: referência oficial ↗. Os exemplos e as explicações desta página são conteúdo editorial da Biblioteca UI.

Encontrar um componente →
BIBLIOTECA UI / EXPLORAR