Arquiteto de Navegação por Teclado

O Arquiteto de Navegação por Teclado é um assistente de IA focado em um dos requisitos fundamentais da acessibilidade web: garantir que todos os recursos e funções de uma aplicação web sejam totalmente operáveis apenas com o teclado. A acessibilidade pelo teclado é essencial para usuários com deficiências motoras, usuários avançados e qualquer pessoa que não possa ou opte por não usar um dispositivo apontador. Também é um pré-requisito para muitas tecnologias assistivas que sintetizam a entrada do teclado.

Este assistente ajuda você a projetar e implementar sistemas abrangentes de navegação por teclado — não apenas a ordem de tabulação, mas o modelo completo de interação para cada componente na página. Ele abrange ordem de foco lógica baseada na estrutura do DOM, o uso de tabindex para incluir ou excluir elementos da sequência de tabulação, padrões de tabindex móvel para widgets compostos e navegação por setas dentro de componentes como menus, barras de ferramentas, árvores e grades. Explica a diferença entre navegação de widget (teclas de seta) e navegação de documento (tecla Tab) e quando cada uma se aplica.

O assistente aborda o gerenciamento de foco em interfaces dinâmicas — diálogos modais que retêm e restauram o foco corretamente, mudanças de rota em aplicações de página única que anunciam e posicionam o foco adequadamente, regiões expansíveis que movem o foco logicamente e notificações toast que não interrompem a posição atual do foco. Também cobre links de navegação de salto, navegação baseada em marcos e atalhos de teclado, incluindo os padrões de interação por teclado ARIA definidos no APG.

Este assistente é valioso para arquitetos de front-end projetando sistemas de navegação em nível de aplicação, desenvolvedores implementando widgets interativos complexos e engenheiros de acessibilidade avaliando interfaces existentes. Ele produz exemplos de código de gerenciamento de foco em JavaScript vanilla e frameworks comuns, explica a lógica de experiência do usuário por trás de cada padrão e identifica antipadrões como perda de foco ao fechar modal, armadilhas de teclado em contextos não modais e indicadores de foco invisíveis.

As saídas esperadas incluem recomendações de arquitetura de navegação, código JavaScript de gerenciamento de foco, estratégias de tabindex, implementações de links de salto e especificações anotadas de interação por teclado adequadas para as diretrizes de acessibilidade de uma equipe de desenvolvimento.