O documento discute a importância da acessibilidade e usabilidade para o e-commerce. Ele explica como a adoção desses princípios pode ajudar sites de comércio eletrônico a atingir mais clientes de forma fiel, segura e eficiente, além de estar em conformidade com a lei. O documento também fornece recomendações para testar sites e garantir que eles sejam acessíveis a todos os usuários.

1. Circuito 4x1 Rio - Abril 2011 Horácio Soares O que a Acess ibilidade e a Usabil idade podem fazer pelo seu e-Com merce?

2. Horácio Soares [email_address] @horaciosoares (21) 9925-5404 Circuito 4x1 Rio - Abril 2011

3. Qual é o momento atual do e-Commerce?

4. Quais são os objetivos do e-Commerce?

5. O que o usuário espera quando compra algo eletronicamente?

6. - Velocidade - Preço - Comodidade - Segurança - Atendimento Variedade - Qualidade …

7. Existe algum público que não é atendido?

8. Acessi bilidade? O que é

9. Usabi lidade? O que é

10. Qual é o relacionamento entre a acessibilidade e usabilidade?

12. design universal

13. objetivo do design universal: uma solução para todos

18. Simples e intuitivo (princípio da DU) X Complexidade e inovação sem validação

19. Imagem da página inicial do Google Simples e intuitivo (princípio da DU)

20. Onde está a busca no site da ESPN?

22. Acessib ilidade e usabi lidade para quem?

23. Juca, sem visão.

24. Mandy, sem visão e braços.

25. Lucas, com baixa visão utilizando o software ampliador de tela.

26. Para o Isaias, designer e descobriu apenas no início de 2009 que é daltônico. Isaias à esquerda, conduzindo o Januário para um chopinho após curso de acessibilidade Web.

27. João Henriques deficiente motor utiliza o mouse com dificuldade. ( www.euroacessibilidade.com )

28. João, tetraplégico João (foto de Maíra Soares )

29. Tião tem grandes dificuldades motoras e interage com teclado com o dedo mindinho…

30. Eric interagindo através de teclado expandido - Funlar – Rio (nov/2006).

31. Deficientes auditivos não oralizados têm dificuldades com o português. Chapeuzinho Vermelho em português e na língua de sinais (prof. Goulão)

32. Gabriel, linguagem em desenvolvimento... Gabriel compenetrado, olhando para o monitor e clicando com o mouse. Agora ele está olhando e brincando como teclado.

33. Calvin, pouca experiência e medo do computador Homem com muito medo olhando por cima de um notebook.

34. Marta e suas amigas…

35. Number of 80+ year olds in the world 2000: ~ 69 million 2010: ~110 million 2050: ~379 million (close to 2 billion 60+ yr olds) -> http://www.un.org/esa/population/publications/worldageing19502050/ Our globally aging population Copyright © 2009. World Wide Web Foundation. All rights reserved

36. Max, com tendinite, usando o mouse com a mão trocada. Homem com expressão de desespero, usando o mouse com a mão esquerda

37. Analfabeto funcional Um em cada cinco brasileiros (20,3%) é analfabeto funcional, de acordo com a Pnad (Pesquisa Nacional por Amostra de Domicílios) 2009, divulgada pelo IBGE. Homem sentado de frente para um quadro branco sem nada escrito.

38. Pedro e Laura com dispositivos móveis com acesso a Internet. Pedro olhando para seu smartphone e Laura com uma cara desesperada pera seu celular.

39. Todos nós na primeira experiência. Um criança com camisa social e gravata em frente a um notebook

40. E finalmente, o bilionário cego!!! Cifrão desenhado com moedas douradas

41. Google, o bilionário cego!!! É apenas um robô que indexa conteúdo em texto. Dilbert fazendo parte do logotipo do Google e falando “eu não posso ver”.

42. SEO pode e deve ajudar, mas cuidado, seu uso pode ser prejudicial…

43. Quais os benefícios da Acessibilidade e Usabilidade?

44. Possibilidade de atingir 100% do público alvo.

45. Atender melhor todas as pessoas

46. Homem de terno comemorando Fidelizar clientes

47. Mais fácil de usar e aprender

48. Proteção contra processos pela falta da acessibilidade

49. #inacessibilidadenaTam Trending Topics e possível processo no Ministério Público

50. Uma mão com laço no dedo indicador Decreto de lei nº 5.296 (dez/04) e o decreto de lei nº 6.949 (ago/09), onde a convenção da ONU ganhou força de lei.

51. Visualizar os benefícios da acessibilidade Manutenção mais rápida e barata, melhor performance…

52. Valorização da Diversidade e Responsabilidade Social. Mãos entrelaçadas

53. Maior visibilidade pelos sistemas de busca;

54. Mulher com notebook em sinal de ok Vantagem competitiva

55. Melhoria da qualidade. Mãe e filha felizes na praia dando uma estrela

56. Na busca por soluções para os problemas, o que maioria dos sites de e-Commerce faz?

57. Copia e cola quase tudo...

58. Mas por que? Porque não temos tempo, porque somos reativos e dá muito trabalho…

59. Divida o quadrado em 4 partes iguais !!! Dinâmica Livro: O Tiro e o Alvo

60. Os participantes do teste, em sua maioria, vão chegar facilmente às 4 respostas seguintes: Dinâmica Do livro “O Tiro e o Alvo” Na Livraria da Travessa - http://migre.me/105T7 Editora http://www.caispharoux.com.br/

61. A partir destas, passam a ter dificuldades para encontrar outras formas de dividir o quadrado. Alguns chegam a afirmar não haver mais soluções possíveis e desistem. Dinâmica Do livro “O Tiro e o Alvo” Na Livraria da Travessa - http://migre.me/105T7 Editora http://www.caispharoux.com.br/

62. Poder-se-ia ainda dividir o quadrado com retas quebradas, como são os casos [i], [j], [k] e [l] Dinâmica Do livro “O Tiro e o Alvo” Na Livraria da Travessa - http://migre.me/105T7 Editora http://www.caispharoux.com.br/

63. No pensamento lateral vai-se quebrando barreiras autoimpostas e descobrindo alternativas que jamais seriam consideradas no pensamento vertical. O pensamento lateral é a base da técnica de “ brain storming ” para geração de idéias. Dinâmica Do livro “O Tiro e o Alvo” Na Livraria da Travessa - http://migre.me/105T7 Editora http://www.caispharoux.com.br/

64. Na busca por novas opções podemos encontrar saídas criativas, inovadoras e mais acessíveis… Inovar é preciso, mas é necessário avaliar: custo x benefício

65. O que você pensa ao dirigir seu carro de casa pro trabalho?

67. Ou rever antigos processos na busca no melhores resultados…

68. Desktop first! http://arquiteturadeinformacao.com/2010/06/04/mobile-first/

69. Mobile First! http://arquiteturadeinformacao.com/2010/06/04/mobile-first/

70. Less is more...

71. Elimine da interface itens que não sejam extremamente necessários...

72. Design de Epicentro Comece do núcleo da página e construa para fora. http://gettingreal.37signals.com/ch09_Epicenter_Design.php Design de epicentro foca na verdadeira essência da página — o epicentro — e então constrói para fora. Isso significa que, no começo, você ignora as extremidades: a navegação/menus, rodapé, cores, barra lateral, logotipo, etc. Em vez disso, você começa o epicentro e faz o design das peças de conteúdo mais importantes primeiro.

73. Um mito…

75. Uma importante recomendação:

76. Um bom sistema de e-Commerce é uma interface bem testada… Não faça como a acessibilidade na maioria dos sites brasileiros

83. Resultado: acessibilidade para inglês ver.

84. Um bom site, é um site bem testado… http://www.youtube.com/watch?v=xDnNrBPh1KU

85. Outras recomendações:

86. Prototipe, avalie e evolua. Melhoria contínua…

87. Teste o acesso ao site e sistema de compras em conexões de baixa velocidade.

88. Realize testes em dispositivos móveis e de impressão

89. Teste a navegação via teclado

90. Teste a Semântica

91. Evite mudanças inesperadas de foco.

92. Mantenha o foco/feedback na navegação por links e campos de formulário

93. Diferencie links clicados, ativos, etc.

94. Crie links/botões cuja área permita que os usuários cometam erros de pontaria...

95. Mantenha bom contraste entre cores de fundo e dos textos.

96. Use um tamanho de fontes acessível e escalonável.

97. Desligue o monitor e navegue pelo teclado com um software leitor de Telas.

98. Observe usuários com e sem deficiência realizando as tarefas do e-commerce.

99. Futuro...

100. iPhone, iPad, and iPod touch: Getting started with VoiceOver for accessibility

102. A ccessible R ich I nternet A pplications ARIA NOW HTML 4 + ARIA HTML5 + ARIA http://www.abilitynet.org.uk/accessibility2/wp-content/uploads/2009/09/HTML5_Accessibility_faulkner.ppt

103. Horácio Soares [email_address] @horaciosoares (21) 9925-5404 Obrig ado!