Acessibilidade ≠ Overlay: quando uma janela modal bloqueia a navegação por teclado

Ao selecionar «Continuar», abre-se uma janela. O ecrã muda, mas o leitor de ecrã continua a ler o conteúdo de fundo ou o teclado não chega ao botão «Fechar».

Uma janela modal concentra temporariamente a interação numa tarefa. Enquanto está aberta, o conteúdo de fundo não deve receber o foco. Nem todas as janelas emergentes precisam de ser modais.

Ao abrir a janela, o foco deve passar para um elemento adequado no seu interior. Tab e Shift+Tab percorrem os controlos sem regressar ao fundo. Ao fechar, o foco regressa normalmente ao elemento que abriu a janela.

A janela precisa de um nome acessível e, quando útil, de uma descrição. Os botões devem indicar claramente «Guardar alterações», «Cancelar» ou «Fechar». Um X isolado pode não ser anunciado.

Em geral, Escape deve fechar a janela. Confirmações importantes exigem cuidado adicional, mas as opções para prosseguir ou voltar devem ser compreensíveis.

Foco perdido atrás da janela, controlos de fundo ativos, mensagens não anunciadas e botões inacessíveis quando o texto é ampliado.

Abra a janela apenas com teclado. Verifique o foco inicial, Tab, Shift+Tab, Escape quando aplicável e o regresso do foco. Repita com leitores de ecrã e dispositivos relevantes.

O Blind Reader apoia a orientação e a navegação com os leitores de ecrã habituais. As suas correções pontuais podem facilitar certas interações; a própria janela deve gerir corretamente o foco.

Uma janela modal acessível permite compreender, decidir e retomar a tarefa sem perder o rumo.

• W3C WAI — Dialog (Modal) Pattern
• W3C WAI — Understanding Keyboard
• W3C WAI — Understanding Focus Order
• W3C WAI — Understanding Name, Role, Value

Episódio 20 · Acessibilidade ≠ Overlay