Acessibilidade web

Quando usar

Acionar ao implementar ou auditar páginas, componentes, formulários, dashboards, mídia e fluxos críticos contra WCAG e semântica da plataforma.
Acionar para bugs de teclado, foco, nome acessível, contraste, zoom, reflow, leitor de tela ou outras tecnologias assistivas.
Não acionar apenas para preferência visual sem barreira observável; usar $specsfy-specialist-ui-design.
Combinar com a skill do framework para corrigir o código sem transferir a responsabilidade de conformidade ao framework.

Descobrir política, nível WCAG, navegadores, tecnologias assistivas, público e fluxos críticos; separar auditoria de conformidade de teste de usabilidade.
Inventariar barreiras por estrutura, percepção, teclado, foco, formulário, atualização dinâmica, mídia e autenticação usando references/standards.md.
Corrigir HTML e comportamento nativos antes de adicionar ARIA ou widget customizado; verificar nome, papel, valor, estado e relações calculados.
Implementar teclado, ordem lógica, foco visível, foco não encoberto e gestão após abertura, fechamento, navegação e atualização assíncrona.
Validar contraste, zoom, reflow, espaçamento de texto, target size, forced colors, orientação, movimento e alternativas de mídia.
Executar análise automática e inspeção manual; classificar cada achado por critério, impacto, caminho de reprodução e correção verificável.
Exercitar tarefas críticas com tecnologia assistiva representativa e documentar cobertura, limitações, exceções e risco residual.

Declarar conformidade porque axe ou um linter zerou; automação não confirma ordem de foco, linguagem, alternativas equivalentes ou fluxo completo.
Aplicar role, tabindex e handlers a div quando um elemento nativo cobre o contrato; recria parcialmente teclado e semântica do browser.
Usar aria-label para substituir texto visível sem necessidade; nomes divergentes quebram reconhecimento por voz e manutenção.
Mover foco em toda atualização assíncrona; interrompe leitura e contexto. Anuncie status proporcional e mova foco somente quando a tarefa exigir.
Ocultar overflow para “resolver” reflow; o conteúdo continua inacessível, apenas deixa de ser alcançável visualmente.

Executar fluxo completo por teclado, sem armadilha, perda ou foco encoberto; conferir ordem e retorno de foco em overlays.
Verificar resize de texto a 200% e reflow equivalente a 320 CSS px para conteúdo vertical, além de spacing de texto e orientação suportada.
Medir contraste de texto, componentes e indicadores de foco e testar forced colors e reduced motion quando aplicáveis.
Combinar axe/linter com inspeção do accessibility tree e leitor de tela nos fluxos de maior risco.
Não declarar conformidade WCAG sem mapear critérios, escopo, evidência, limitações e exceções; “acessível” não é sinônimo de teste automatizado verde.

$specsfy-specialist-react-ui-components e $specsfy-specialist-shadcn-ui fornecem componentes que esta skill audita por semântica, foco, teclado e nome acessível.
$specsfy-specialist-tailwind-css implementa contraste, forced colors, reflow e reduced motion nos utilitários e tokens observados.
$specsfy-specialist-ui-design governa hierarquia, tokens e estados visuais que precisam satisfazer contraste, reflow e foco.
$specsfy-specialist-ux-design pesquisa compreensão e sucesso de tarefa, inclusive com pessoas que usam tecnologias assistivas.
$specsfy-specialist-react e $specsfy-specialist-astro ou $specsfy-specialist-nextjs implementam a correção no framework observado.
$specsfy-specialist-code-review amplia a revisão para riscos além do recorte de acessibilidade.

Leia references/standards.md para critérios WCAG 2.2, contratos de componentes, formulários, conteúdo dinâmico e matriz de testes.