Semântica nativa primeiro
Cada componente parte do controle da plataforma que já tem o papel e o comportamento de teclado adequados: <button>, <dialog>, <details>, campos de checkbox e radio e a Popover API. ARIA é a alternativa.
Navegação por teclado
- Ativação — Enter e Space ativam botões e botões de alternância; Space alterna caixas de seleção e interruptores.
- Widgets compostos — as setas movem o foco entre itens de menus, abas, grupos de opções e barras de ferramentas; Home e End vão para o primeiro e o último item.
- Sobreposições — Escape fecha diálogos, janelas flutuantes e menus e devolve o foco ao acionador.
- Ordem de tabulação — apenas elementos interativos entram na sequência de Tab; controles desabilitados são ignorados.
Cada página de componente lista suas interações por teclado.
Gerenciamento de foco
Os modais mantêm o foco dentro deles enquanto estão abertos e o restauram ao fechar. Janelas flutuantes e menus usam tabindex móvel em seus itens. A aparência do foco visível cabe ao CSS da sua aplicação, com data-state e :focus-visible.
Como isso é verificado
Cada afirmação desta página é um critério de aprovação para a publicação: zero violações do axe no Chromium, Firefox e WebKit, além da suíte sem JavaScript que os componentes Tier 0 passam integralmente. Veja as evidências