Como garantir que toda funcionalidade seja acessível só por teclado, com foco visível e ordem de tabulação lógica, incluindo botões, links, menus, janelas sobrepostas (modais), formulários, controles de mídia e atividades interativas.
Regras para permitir navegação completa apenas com teclado, com foco visível e sequência lógica.
Foco sempre visível, ordem coerente de tabulação, saída de menus sem armadilhas e gestão correta de atalhos de teclas garantem que elementos interativos possam ser alcançados e ativados via teclado (Tab, Shift+Tab, Enter, Espaço, ESC, setas).
Pessoas que não usam mouse dependem do teclado. Sem foco visível e ordem lógica, a navegação é inviável.
Usuários com deficiência motora, pessoas cegas (que usam leitores de tela) e pessoas com baixa visão dependem do teclado. Mesmo em situações temporárias, na ausência de mouse, o uso pelo teclado garante o acesso. Se não ficar claro qual elemento está selecionado (foco visível), o usuário pode “se perder” na página. “Armadilhas”, como modais (janelas) ou carrosséis que travam a navegação, tornam o conteúdo inutilizável. Cumprir as normas garante inclusão, usabilidade e atende às exigências legais.
Sempre que houver elementos interativos.
Deve ser aplicado a todo produto digital. Exemplos: Ambientes Virtuais de Aprendizagem (como o Moodle), páginas web, formulários PDF, vídeos com controles, menus, carrosséis, atividades interativas (como H5P, ferramenta educacional) e sistemas administrativos.
Garanta operabilidade por teclado, ordem lógica e foco visível.
Realize testes com Tab, Shift+Tab, Enter, Espaço e ESC; verificar foco visível.
Site com outline e Modal com foco visível e ESC promovem acessbilidade. Site sem outline prejudica.
Corretos:
• Modal abre com Enter, o foco vai para o título; ESC fecha e o foco retorna ao botão.
• Formulário com ordem lógica de campos e mensagens de erro anunciadas no foco.
Incorretos:
• Site com outline: none, ou seja, sem indicação de foco.
• Menu que só abre com clique de mouse.
• Modal que abre, mas o foco continua atrás e não retorna ao acionador.
Não remova outline (contorno); não prenda foco; não crie menus inacessíveis.
WCAG 2.1.1; WCAG 2.4.7; WCAG 2.1.2; WCAG 2.4.3; WCAG 2.1.4; NBR 17225; eMAG.
Outras normas relacionadas:
Recursos práticos sobre navegação por teclado e foco.
