Ferramentas & Leitores de Tela — Acessibilidade na Web

Limitação importante: ferramentas automáticas detectam apenas 30–40% dos problemas de acessibilidade. O restante exige testes manuais: navegação por teclado, leitor de tela, avaliação cognitiva e testes com usuários com deficiência.

Avaliação Automática

WAVE

Visualiza erros e alertas diretamente na página com ícones sobrepostos. Extensão para Chrome e Firefox. Ideal para revisões rápidas e apresentações.

Grátis · Extensão de browser · WebAIM

axe DevTools

Extensão da Deque. Zero falsos positivos por design. Base para muitas outras ferramentas. Integra com CI/CD via axe-core (npm).

Grátis (básico) / Pago (avançado) · Deque

Lighthouse (Chrome DevTools)

Auditoria integrada ao Chrome. Acesse via DevTools → Lighthouse → Acessibilidade. Verifica contraste, alt texts, ARIA e mais. Também disponível como CLI.

Grátis · Integrado ao Chrome · Google

Accessibility Checker

Análise online por URL com relatório detalhado por critério WCAG. Bom para relatórios executivos e auditorias iniciais.

Grátis · Online

IBM Equal Access Checker

Extensão e API da IBM. Mapeamento direto para critérios WCAG. Inclui guias de remediação e relatórios estruturados.

Grátis · Open Source

Siteimprove / Silktide

Plataformas pagas com monitoramento contínuo, dashboards de progresso, relatórios de conformidade WCAG e integração com CMS populares.

Pago · Empresarial

Contraste e Cor

Contrast Ratio

Calculadora rápida de contraste com suporte a cores CSS (hex, rgb, hsl, named). Resultado imediato com indicação de nível WCAG.

Colour Contrast Analyser (TPGI)

App desktop (Windows/Mac) com eyedropper. Mede o contraste de qualquer pixel na tela — funciona até com imagens e PDFs.

Who Can Use

Simula como pessoas com diferentes deficiências visuais enxergam uma combinação de cores. Mostra a porcentagem de usuários afetados.

Chrome DevTools — Vision Deficiencies

DevTools → Rendering → Emulate vision deficiencies. Simula deuteranopia, protanopia, tritanopia, acromatopsia e visão borrada diretamente no browser.

Integração em Desenvolvimento (CI/CD)

axe-core

Biblioteca JavaScript open source. Integra com Playwright, Cypress, Jest, Puppeteer. Base do axe DevTools. npm install axe-core.

eslint-plugin-jsx-a11y

Regras de lint de acessibilidade para projetos React/JSX. Identifica problemas durante o desenvolvimento, antes do build. npm install eslint-plugin-jsx-a11y.

pa11y

CLI e API Node.js para testes em pipelines CI/CD. Suporta configuração por arquivo, relatórios em múltiplos formatos e testes em múltiplas URLs.

Storybook + a11y addon

Verifica componentes de UI no Storybook com axe-core. Cada história exibe um painel com violations, passes e incompletos.

Exemplo: Playwright + axe-core

import { test, expect } from '@playwright/test';
import AxeBuilder from '@axe-core/playwright';

test('página inicial não tem violações WCAG AA', async ({ page }) => {
  await page.goto('/');
  const results = await new AxeBuilder({ page })
    .withTags(['wcag2a', 'wcag2aa', 'wcag21aa', 'wcag22aa'])
    .analyze();
  expect(results.violations).toEqual([]);
});

Leitores de Tela

NVDA (Windows)

Leitor de tela gratuito e open source para Windows. O mais usado por usuários cegos. Use com Firefox para melhor compatibilidade com ARIA.

Modificador: Caps Lock ou Insert

Download: nvaccess.org

JAWS (Windows)

Mais usado em ambientes corporativos. Pago, com versão de demonstração (40 min). Excelente integração com apps do Office.

Modificador: Insert

freedomscientific.com

VoiceOver (macOS/iOS)

Leitor de tela nativo da Apple. Presente em todos os dispositivos sem custo. Use com Safari para melhor suporte.

macOS: Cmd + F5

iOS: Ajustes → Acessibilidade → VoiceOver

Narrator (Windows)

Leitor de tela nativo do Windows. Melhorou muito no Windows 11. Útil para testes rápidos sem instalação adicional.

Ativação: Win + Ctrl + Enter

TalkBack (Android)

Leitor de tela do Android. Navegação por gestos de deslize. Combine com Switch Access para usuários com mobilidade reduzida.

Ajustes → Acessibilidade → TalkBack

Orca (Linux)

Leitor de tela open source para Linux com GNOME. Suporta braille e síntese de voz. Padrão em distribuições como Ubuntu.

Modificador: Caps Lock

Pares mais comuns para teste

NVDA + Firefox — combinação mais popular entre usuários com deficiência
JAWS + Chrome/Edge — ambiente corporativo Windows
VoiceOver + Safari — iOS e macOS
TalkBack + Chrome — Android

Fonte: WebAIM Screen Reader User Survey 2024