Dashboard de Testes de Acessibilidade

Sobre a Ferramenta

Projeto de Conclusão de Curso

Este projeto foi desenvolvido como Trabalho de Conclusão de Curso (TCC) de Engenharia de Computação.

Autor: Pedro Celso Miranda

O que é esta ferramenta?

O Dashboard de Testes de Acessibilidade é uma aplicação web que integra três das principais ferramentas de análise de acessibilidade do mercado: Pa11y, Equal Access (IBM) e Axe (Deque Systems).

O objetivo é facilitar a identificação e correção de problemas de acessibilidade em websites, consolidando os resultados de múltiplas ferramentas em uma única interface intuitiva e oferecendo sugestões de correção geradas por Inteligência Artificial.

Como funciona?

1. Testando um Website

  • Escolha uma das abas de ferramentas (Pa11y, Equal Access ou Axe)
  • Digite a URL completa do site que deseja analisar (exemplo: https://exemplo.com)
  • Clique em "Testar" e aguarde o processamento
  • Os resultados aparecerão automaticamente na mesma aba

2. Visualizando Resultados

  • Cada problema encontrado é exibido com descrição detalhada
  • Você verá o código HTML do elemento problemático
  • Uma solução em português é sugerida por IA para cada erro
  • Os erros são categorizados por tipo e severidade

3. Buscando Análises Anteriores

  • Acesse a aba "Resultados" para buscar testes já realizados
  • Digite a URL do site que deseja consultar
  • Visualize o histórico de análises e compare resultados ao longo do tempo

4. Recursos para Usuários Logados

  • Fast Scan: Opção de análise rápida (disponível apenas após login)
  • Aba URLs: Visualize todas as URLs já testadas no sistema
  • Aba Relatórios: Acesse relatórios consolidados e métricas de uso

Ferramentas de Análise

Pa11y

Ferramenta de código aberto que realiza testes automatizados de acessibilidade web seguindo as diretrizes WCAG (Web Content Accessibility Guidelines).

Equal Access (IBM)

Desenvolvida pela IBM, verifica a conformidade com múltiplos padrões de acessibilidade incluindo WCAG 2.1 e Section 508.

Axe (Deque Systems)

Considerada uma das ferramentas mais precisas do mercado, com alta taxa de detecção e baixo índice de falsos positivos.

Tecnologias Utilizadas

Frontend: Next.js 15, React, TypeScript, Tailwind CSS
Backend: Node.js, Express, PostgreSQL
IA: Google Vertex AI (Gemini) para geração de soluções