Ferramentas de testes automatizados para acessibilidade web

Ferramentas de testes automatizados para acessibilidade web

Ferramentas para garantir a qualidade do software do ponto de vista da acessibilidade.

590371c05fc56adf612fd91ea509cf74?s=128

Bruno Pulis

October 29, 2019
Tweet

Transcript

  1. Ferramentas para a11y

  2. BRUNO PULIS @obrunopulis / brunopulis.com • Formada em Sistemas para

    Internet pelo Pitágoras; • Evangelista de a11y e web standards; • Co-fundador do Minas Dev; • Star Wars lover e apaixonado por Javascript; • QA Analyst na Monetizze.
  3. Acessibilidade web significa que TODOS podem usar a Web." Chris

    DeMars
  4. A web não é uma barreira para pessoas com deficiência,

    ela é a .solução.". https://webaim.org/articles/pour
  5. • Maior valor agregado à empresa e fortalecimento da sua

    marca; • Melhoria de performance e de usabilidade, criando vantagem competitiva; • Ampliação e diversificação de público; • Leis regulamentadoras; • Melhoria em questões de SEO; • Facilidade e menor custo de manutenção; • Aumento de compatibilidade com dispositivos, plataformas, sistemas e navegadores. BENEFÍCIOS
  6. PADRÕES E LEIS

  7. • Lei Brasileira de Inclusão (LBI); • Declaração dos Direitos

    das Pessoas com Deficiência (ONU); • WCAG. PADRÕES E LEIS
  8. ESTATÍSTICAS

  9. 45 milhões de pessoas afetadas pela falta de acessibilidade no

    Brasil. Fonte: CENSO IBGE/2010
  10. 23,9% da população brasileira sofre algum tipo de deficiência. Fonte:

    CENSO IBGE/2010
  11. Foi realizada uma pesquisa em fevereiro, pela WebAIM testando 1

    milhão de home pages dos principais sites da web. Na amostragem, os resultados não foram animadores. Fonte: https://webaim.org/projects/million
  12. 59.653.607 erros encontrados, uma média de 59,6 erros por página.

  13. None
  14. 97,8% das páginas possuía alguma falha de acordo com o

    WCAG 2.0
  15. None
  16. Tipo de falha WCAG # de páginas iniciais % em

    páginas iniciais Baixo contraste 852,868 85.3% Texto alternativo em falta 679,964 68% Links vazios 581,408 58.1% Labels ausentes em forms 528,482 52.8% Idioma no HTML ausente 329,612 33.1% Botões vazios 250,367 25%
  17. Muito trabalho deve ser feito para que a Web seja

    disponível sem barreiras. Apesar do número de erros serem gritantes, a maioria deles são .simples correções..
  18. Suíte de testes

  19. Colorblinding

  20. None
  21. None
  22. None
  23. None
  24. None
  25. None
  26. None
  27. Access Monitor

  28. Access Monitor

  29. Access Monitor

  30. None
  31. axe Um kit de ferramentas de acessibilidade, construído com as

    regras do WCAG É simples de usar, não requer conhecimentos avançados de acessibilidade e não desperdiça seu tempo com falsos positivos.
  32. axe

  33. axe Chrome Extension

  34. None
  35. Axe Pro

  36. axe for Android Apps

  37. None
  38. npm install -D cypress cypress-axe axe-core

  39. Color Contrast Analyzer

  40. DICAS

  41. • Utilize headings com ordem lógica (h1,h2,h3); • Imagens com

    descrição alternativa; • Evite usar "saiba mais", "clique aqui" em links; • Navegar somente com o teclado, comportamento deve ser o mesmo do mouse. DICAS DE ACESSIBILIDADE
  42. Awesome a11y https://github.com/brunopulis/awesome-a11y

  43. None
  44. None
  45. Estamos criando deficiências se não estivermos criando uma .web para

    todos.”. @emplums
  46. OBRIGADO! @obrunopulis