Garotadpi - Acessibilidade na web

Transcript

1. Acessibilidade na Web Santa Maria - 23 de julho de

   2015
2. None
3. None

4. A Web é acessível na sua origem Tim Berners-Lee, diretor

   do W3C afirma que o poder da Web está na sua universalidade. Para ele, “ser acessada por todos, independente de deficiência, é um aspecto essencial”. A acessibilidade na Web significa, portanto, permitir o acesso a todos, independente do tipo de usuário, situação ou ferramenta.
5. None
6. None

7. Acessibilidade na Web: Custo ou benefício? https://www.youtube.com/watch?v=y8vxALUz6pk

8. Mas a acessibilidade atende apenas as pessoas com deficiência?

9. 9 Em números: Quem se beneficiaria da acessibilidade? Falta cidadania

   – foto de Milton Jung Carros estacionados em vagas especiais http://www.flickr.com/photos/c bnsp/5360821409/ CC licence  23,8% da população brasileira (ou cerca de 45 milhões de pessoas) ;  7,4% tem 65 anos ou mais;  9,63% são analfabetos;  70% das pessoas Pessoas que nunca acessaram a internet, mas usaram um computador alegam que não usam Internet por falta de habilidade.

10. 70% Falta de habilidade com o computador/internet Fonte: Pesquisa TIC

    Domicílios 2013 – CGI.br Pessoas que nunca acessaram a internet, mas usaram um computador. Motivos pelos quais nunca utilizou a internet Fonte: http://www.cetic.br/

11. Deficiência temporária Foto: Flickr.com - Tuftronic10000

12. Acessibilidade na web: A quem se destina? Usuários de Dispositivos

    Móveis Foto: everystockphoto.com -bartimaeus-

13. Idade Avançada Nós, daqui alguns anos Foto: Flickr.com - Jacob

    Bøtter

14. Outros tipos de usuários...

15. Usuários de governo eletrônico  Preocupação com proteção e segurança

    dos dados pessoais (39%)  Dificuldade em encontrar os serviços que precisam (29%)  Dificilmente recebem retorno (reposta) às solicitações(28%)  Os serviços estão disponíveis, mas não é possível completar a transação (23%)  Não temos confirmação de que o pedido chegou e que vai ser processado (21%)  Usar a internet para contato com o governo é muito complicado (21%)

16. Usuários de governo eletrônico • 88% - “Muito importante” que

    um sítio de governo oferecesse explicações sobre como utilizar um serviço. • 84% - “Muito importante” que um sítio de governo oferecesse explicações sobre os direitos do cidadão.

17. 17 A acessibilidade beneficia a todos. Acessibilidade é para todos

    !

18. 18 Como eu sei que um site é acessível?

19. Já navegou no seu site apenas com teclado?

20. Sem CSS ou scripts? Sem CSS e imagens Foto: Flickr.com

    - Baddog_

21. sem monitor ?

22. Como as pessoas navegam pelo leitor de tela?

23. Como as pessoas navegam pelo leitor de tela?

24. Como as pessoas navegam pelo leitor de tela?

25. Processo para desenvolver sítio acessível: • Seguir os padrões Web;

    • Seguir as diretrizes e recomendações de acessibilidade; • Realizar avaliação de acessibilidade.

26. Código acessível  Conteúdo alternativo para elementos não- textuais; 

    Dados de tabelas acessíveis;  Formulários acessíveis;  Menus de escape;  Teclas de acesso;  Folhas de estilo com medidas relativas;  Documentos legíveis sem a folha de estilos;  Semântica;

27. Código acessível  Programação em camadas;  Não usar tabelas

    para diagramar;  Não utilizar frames;  Não utilizar elementos proprietários;

28. Vídeos com legendas

29. Imagens acessíveis

30. Cabeçalhos <H1>Título Principal</H1> <H2>Subtítulo</H2> <H3>Sub-Subtítulo</H3> <H2>Subtítulo</H2> <H3>Sub-Subtítulo</H3> <H4>....</H4>

31. Contraste

32. Formulários

33. Formulários <input type="checkbox" value="yes" name="apples"> Apples <input type="checkbox" value="yes" name="oranges">

    Oranges <input type="checkbox" value="yes" name="lemons"> Lemons <input type="checkbox" value="yes" name="limes"> Limes

34. Formulários <input type="checkbox" value="yes" id=“apples“ name="apples"> <label for=“apples"> Apples</label> <input

    type="checkbox" value="yes" id=“oranges“ name="oranges"> <label for=“oranges"> Oranges</label> <input type="checkbox" value="yes" id=“lemmons“ name="lemons"> <label for=“lemons"> Lemons</label> <input type="checkbox" value="yes" id=“limes“ name="limes"> <label for=“limes"> Limes</label>

35. Tabelas

36. Tabelas A5 - TIPO DE CONEXÃO PARA ACESSO À INTERNET

    NO DOMICÍLIO Percentual sobre o total de domicílios com acesso à Internet 1 Percentual (%) Modem Tradicional (acesso discado linha telefônica) Banda Larga 2 Outros NS/NR 3 TOTAL Banda Larga Modem digital via linha telefônica (tecnologia DSL) Modem via cabo Conexão via rádio Conexão via satélite TOTAL BRASIL 20 66 23 25 14 3 6 10 ÁREA URBANA 19 66 24 26 14 3 6 9 RURAL 21 55 17 14 20 5 8 16 REGIÕES DO PAÍS SUDESTE 22 65 21 30 11 3 4 10 NORDESTE 19 64 12 32 18 1 10 9 SUL 13 71 34 12 22 3 8 10 NORTE 31 49 23 11 11 5 14 7 CENTRO-OESTE 13 67 34 18 13 2 8 13 RENDA FAMILIAR Até R$465 16 51 14 20 14 3 12 21 R$466-R$930 22 61 18 24 15 4 4 14 R$931-R$1395 23 62 22 24 13 2 6 9 R$1396-R$2325 23 63 23 22 15 3 6 8 R$2326-R$4650 16 75 32 28 11 4 7 4 R$4651 ou mais 12 78 27 34 16 1 6 5 CLASSE SOCIAL 4 A 11 81 24 41 14 3 9 3 B 18 71 28 26 13 3 6 7 C 22 61 19 24 15 3 5 12 DE 26 41 10 15 15 2 3 29

37. Acessível via teclado

38. HTML e CSS

39. Acessibilidade – 7 mitos e 1 equívoco por Leda Spelta

    Mito 1 "Acessibilidade Web é só para deficientes visuais." Temor oculto: "Imagina o trabalhão que vai dar, fazer acessibilidade para todo mundo!"

40. Mito 2 "Na prática, o número de usuários beneficiados com

    a acessibilidade é relativamente muito pequeno." Temor oculto: "Esse negócio de acessibilidade é muito investimento para pouco retorno." Acessibilidade – 7 mitos e 1 equívoco por Leda Spelta

41. Mito 3 "Fazer um site acessível demora e custa caro."

    Temor oculto: “Não estarei empregando mal os recursos que tenho, ao fazer acessibilidade? Não vou ficar no prejuízo?” Acessibilidade – 7 mitos e 1 equívoco por Leda Spelta

42.  Dobrou o número de visitantes e cortou os custos

    de manutenção em 2/3.  35 mil libras para construção 13 milhões de retorno annual.  CNET - 30% de aumento de tráfego vindo do Google após implementar transcrição em arquivos multimidia.

43. Mito 4 "É melhor fazer uma página especial para os

    deficientes visuais." Temor oculto: "A gente não vai conseguir fazer uma página acessível, que seja tão bonita e funcional como a nossa." Acessibilidade – 7 mitos e 1 equívoco por Leda Spelta

44. Mito 5 "Um site acessível a deficientes visuais não é

    bonito." Temor oculto: "Só sei fazer sites bonitos usando tecnologias inacessíveis; de fato, não sei exatamente quais são os elementos visuais que atrapalham a acessibilidade. Por isso, quando tenho que fazer um site acessível, faço sempre o arroz com feijão." Acessibilidade – 7 mitos e 1 equívoco por Leda Spelta
45. None

46. Mito 6 “Vamos por partes: primeiro fazemos o site, depois

    fazemos acessibilidade." Temor oculto: "Não vamos conseguir fazer um site acessível, com o tempo, os recursos e a equipe que temos." Acessibilidade – 7 mitos e 1 equívoco por Leda Spelta
47. None

48. Mito 7 "A gente sabe o que é bom para

    o usuário." Temor oculto: "Não quero expor meu projeto às críticas." Acessibilidade – 7 mitos e 1 equívoco por Leda Spelta

49. Equívoco "Meu site é direcionado a um público específico; ele

    não interessa a todos os grupos de usuários." Quando restringimos o acesso do nosso site ao que julgamos serem as características do seu público alvo, estamos, na prática, usando a internet para limitar o nosso público, ao invés de ampliá-lo. Acessibilidade – 7 mitos e 1 equívoco por Leda Spelta
50. None

51. Como eu aprendo?

52. e-MAG Desenvolvedor TURMA 2/2015 de 11/08/2015 a 07/09/2015 Inscrições abertas

    até 06/08/2015 http://www.enap.gov.br/

53. GT de Acessibilidade do W3C • Tradução do Documento base

    do WCAG http://traducoes.w3c.br/TR/WCAG/ • Prêmio Todos@Web • Cartilha de Acessibilidade na Web (Fascículo I) http://www.ceweb.br/
54. None

55. garotadpi.com.br twitter: @garotadpi Github.com/garotadpi garotadpi@gmail.com Fernanda Hoffmann Lobato Obrigado!