Palestra ministrada na BrazilJS 2016 sobre como requisitos de acessibilidade web para pessoas com deficiências cognitivas, neuronais ou de aprendizagem como Autismo, Dislexia, TDAH, entre outras.

1. Acessibilidade Web Cognitiva
Talita Pagani
@talitapagani
http://br.freepik.com/vetores-gratis/bckground-moderna-do-crebro_884409.html

2. Talita Pagani
Bacharel e quase mestre em
Ciência da Computação
10+ de XP em TI
Professora, palestrante
UX Designer / Front-end
Foco atual = UX e Acessibilidade Web
Membro do grupo de especialistas em
Acessibilidade Web do W3C Brasil

3. O que vêm à mente
quando falamos sobre
Acessibilidade Web?

4. Deficiência visual?
Leitores de tela?
Recursos assistivos?
Teclado adaptado?
Talvez deficiência auditiva?

5. E quanto à usuários que
têm dificuldade de manter
o foco e a concentração em
um texto?

6. E quanto à usuários que
têm problemas de memória
de curto prazo?

7. E quanto à usuários que
não conseguem relacionar
uma representação de um
objeto ao objeto?

8. E quanto à usuários que
têm dificuldade de
interpretar metáforas e
expressões conotativas?

9. E quanto à usuários que
têm dificuldade com
conteúdo que é mais
textual que visual?

10. Estes são alguns problemas
recorrentes para pessoas que
possuem alguma deficiência
cognitiva, neuronal ou de
apredizagem

11. Deficiências cognitivas, neuronais ou
de aprendizagem (DCNA)
Condições, síndromes ou transtornos relacionados ao
desenvolvimento da memória, atenção, linguagem,
comunicação, habilidade de comunicação e letramento,
dentre outras funções cognitivas e de neurodesenvolvimento
(SEEMAN; COOPER, 2016)

12. Source: http://www.slideshare.net/RuthEllison/designing-for-cognitive-disabilities/6-There_is_no_onesizefitsallrulebr

13. 1,3% da população têm
alguma destas condições,
segundo o Censo de 2010
(IBGE, 2010)

14. 2 milhões de brasileiros
podem ter Autismo
Estimativas internacionais de 1 a cada 51 pessoas
(OLIVEIRA, 2015)

15. Isto significa que pelo menos
30 pessoas
neste auditório podem ser autistas
(e muitos nunca foram diagnosticados, como eu)
(OLIVEIRA, 2015)

16. Funções afetadas em DCNAs
Memória/memorização;
Resolução de problemas;
Leitura;
Compreensão verbal ou linguística (lidar com materiais
escritos);
Compreensão visual;
Foco e atenção;
Compreensão matemática
(POUNCEY, 2010; WEBAIM, 2014)

17. “Mas se eu fizer um site
acessível com base em nas
diretrizes existentes, eu
estarei atendendo a este
público”

18. FALSO
Para DCNAs pode ser necessário
uma simplificação do conteúdo ou
adaptabilidade

19. Algumas dificuldades
DCNAs são complexas (muitas variações)
Não são binária
De difícil identificação
Podem se sobrepor (ex.: TDAH e Dislexia)
São pouco endereçadas em recomendações

20. Barreiras de interação para este público
podem gerar:
Stress
Ansiedade
Pânico
Desconforto de um modo geral
Impedem MESMO a pessoa de utilizar o sistema

21. Não basta ser acessível a nível
funcional (leitores de tela, navegação
via teclado), tem que ter acessibilidade
informacional (compreender o
conteúdo)

22. Dados da survey do meu mestrado:
84% dos profissionais de TI não consideram ou
consideram parcialmente pessoas com DCNAs em
seus projetos
75% dos que não consideram o fazem porque não têm
conhecimento suficiente sobre essas deficiências para
aplicar em seus projetos
54% dizem que empresa em que atuam não considera
que estes usuários seriam parte do público-alvo dos
projetos

23. Dados da survey do meu mestrado:
33% dos participantes desconhecem
totalmente o WCAG
62% desconhecem o trabalho e as
recomendações do COGA (Cognitive and
Learning Disabilities Task Force - WAI - W3C)

24. 10 Dicas
De como você pode tornar a experiência
melhor para este público

25. #1 Indique claramente o progresso e forneça
indicativos de navegação
Previsibidade, consistência, rotina e reconhecimento: Dislexia, Autismo e Dificuldades de Memória
(ELLISON, 2011) Imagens de TypeForm e Livra.com

26. #2 Forneça recurso de multimodalidade e
representações redundantes
Imagens do app SocialClues
Reforço de conteúdo: Dislexia, Disgrafia, Discalculia, Autismo e Dificuldades de Aprendizagem
(ELLISON, 2011; WEBAIM, 2013; SMITH, 2009)

27. #2 Forneça recurso de multimodalidade e
representações redundantes
Imagens do Spotify
Reforço de conteúdo: Dislexia, Disgrafia, Discalculia, Autismo e Dificuldades de Aprendizagem
(ELLISON, 2011; WEBAIM, 2013; SMITH, 2009)

28. #2 Forneça recurso de multimodalidade e
representações redundantes
Imagens do site do Detran-SP
Reforço de conteúdo: Dislexia, Disgrafia, Discalculia, Autismo e Dificuldades de Aprendizagem
(ELLISON, 2011; WEBAIM, 2013; SMITH, 2009)

29. #2 Forneça recurso de multimodalidade e
representações redundantes
http://webaim.org/articles/cognitive/
Reforço de conteúdo: Dislexia, Disgrafia, Discalculia, Autismo e Dificuldades de Aprendizagem
(ELLISON, 2011; WEBAIM, 2013; SMITH, 2009)

30. #3 Projete páginas simples e intuitivas
https://willianjusten.com.br/criando-efeito-parallax-no-header/(ELLISON, 2011; WEBAIM, 2013)
Consistência, foco e atenção: Dislexia, Autismo, TDA/TDAH e Dificuldades de Aprendizagem

31. #4 Habilite customização quando possível
http://www.raphaelfabeni.com.br/
Legibilidade, contraste adequado, controle: Dislexia, Disgrafia e Autismo

32. #5 Forneça feedback adequado
Visibilidade do estado do sistema: Dislexia, Autismo e Dificuldades de Aprendizagem

33. #5 Forneça feedback adequado
Visibilidade do estado do sistema: Dislexia, Autismo e Dificuldades de Aprendizagem
Imagens de Interaction-Design.org

34. #6 Permita uma área de clique confortável
Prevenção de erros: Dislexia, Autismo e Dificuldades de Aprendizagem
Imagens de TypeForm e SEBRAE

35. #7 Seja previsível: elementos similares devem
produzir interações similares
Previsibidade, consistência, rotina e reconhecimento: Dislexia, Autismo e Dificuldades de Memória
https://www.interaction-design.org/literature/article/principle-
of-consistency-and-standards-in-user-interface-design

36. #8 Evite popups e propagandas que interrompem
o conteúdo
Previsibidade, quebra de expectativa: Autismo e Dificuldades de Aprendizagem
http://kikolani.com/optin-popup-forms.html

37. #9 Quando possível, tenha um modo de leitura
Foco, atenção e compreensão visual: Autismo, Dislexia, Disgrafia
https://support.mozilla.org/en-US/kb/view-articles-reader-
view-firefox-android

38. #10 Tenha suporte a “alternative spelling”
Prevenção de erros, flexibilidade: Dislexia, Disgrafia

39. Outras dicas
Facilite a escolha das opções
Permita que usuários controlem movimento e tempo
(cuidado com autoplay e timeout de forms)
Evite menus com muitos níveis, muitas opções e submenus
Cuidado com flat design #polêmica
Atente-se à ortografia dos itens
Confirme ações
(ELLISON, 2011; WEBAIM, 2013; DAHL, 2015; SMITH, 2009)

40. Acessibilidade Web
Cognitiva é sobre
Comunicação
efetiva

41. Acessibilidade Web
Cognitiva é sobre
Controle do
usuário

42. Acessibilidade Web
Cognitiva é sobre
Consistência

43. Acessibilidade Web
Cognitiva é sobre
Multimodalidade

44. Para saber mais
Cognitive Accessibility User Research
http://w3c.github.io/coga/user-research/
WebAIM: Cognitive
http://webaim.org/articles/cognitive/
Meus “2 cents” sobre o assunto:
GAIA - Guia de Acessibilidade de Interfaces Web com foco
em aspectos do Autismo (Guidelines for Accessible
Interfaces for people with Autism)
http://talitapagani.com/gaia/

45. Referências
DAHL, D. Web accessibility for people with cognitive disabilities. 2015.
http://www.slideshare.net/dadahl/web-accessibility-for-people-with-cognitive-disabilities
ELLISON, R. Designing for cognitive disabilities. 2011.
http://www.slideshare.net/RuthEllison/designing-for-cognitive-disabilities/
IBGE, Censo Demográfico 2010. 2010. Disponível em: http://censo2010.ibge.gov.br/
OLIVEIRA, Carolina. Um retrato do autismo no Brasil. 2015.
http://www.usp.br/espacoaberto/?materia=um-retrato-do-autismo-no-brasil
POUNCEY, I. Web Accessibility for Cognitive Disabilities and Learning Difficulties. 2010. Disponível
em: https://dev.opera.com/articles/cognitive-disability-learning-difficulty/
SEEMAN, L.; COOPER, M. (Org.). Cognitive Accessibility User Research. 2015. Disponível em:
https://www.w3.org/TR/coga-user-research/
SMITH, J. Insights into Cognitive Web Accessibility. 2009.
http://www.slideshare.net/jared_w_smith/insights-into-cognitive-web-accessibility
WEBAIM. Cognitive. 2013.http://webaim.org/articles/cognitive/

46. OBRIGADA!
Talita Pagani | @talitapagani
http://br.freepik.com/vetores-gratis/bckground-moderna-do-crebro_884409.html