O documento discute o modelo brasileiro de acessibilidade em governo eletrônico, definindo acessibilidade na web e seus benefícios. Ele também descreve como desenvolver sites acessíveis através de boas práticas de codificação, como uso correto de cabeçalhos, formulários e tabelas, além de fornecer conteúdo alternativo e contraste adequado. Por fim, apresenta ferramentas para avaliar a acessibilidade de sites governamentais.

3. Ministério do Planejamento, Orçamento e Gestão
Secretaria de Logística e Tecnologia da Informação
Departamento de Governo Eletrônico
Modelo Brasileiro
de Acessibilidade
em Governo
Eletrônico

4. 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>

5. 5
O DGE e a Sociedade
DGE – Departamento de Governo
Eletrônico

Implantar de forma unificada serviços por meios eletrônicos
no governo federal;

Integrar outros níveis de governo na prestação de serviços;

Desenvolver e-serviços orientado por eventos da vida de
cidadãos e demais setores sociais;

Definir e Implantar padrões de usabilidade e
acessibilidade para e-Serviços;

6. 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.
A Web é acessível na sua origem

10. João é
tetraplégico

11. Michele é surda

12. Carlos é cego

13. Deficiência temporáriaFoto: Flickr.com - Tuftronic10000

14. Acessibilidade na web: A quem se destina?
Usuários de Dispositivos Móveis
Foto: everystockphoto.com -bartimaeus-

15. Idade Avançada
Nós, daqui
alguns
anos
Foto: Flickr.com - Jacob Bøtter

16. Medo de usar o
computador

17. 65%
Falta de habilidade com o
computador/internet
Fonte: Pesquisa TIC Domicílios 2012 – CGI.br
Pessoas que nunca acessaram a internet, mas usaram um computador.
Motivos pelos quais nunca utilizou a internet
Fonte: http://www.cetic.br/

18. 18
Em números: Quem se beneficiaria da acessibilidade?
Falta cidadania – foto de Milton
Jung
Carros estacionados em vagas
especiais
http://www.flickr.com/photos/cbnsp/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;

65% das pessoas Pessoas que
nunca acessaram a internet, mas
usaram um computador alegam que
não usam Internet por falta de
habilidade.

19. Acessibilidade na web: A quem se destina?
Acessibilidade é para todos !

20. http://acessibilidade.w3c.br/pesquisa/resultados-preliminares/

21. Fonte: Pesquisa TIC Domicílios 2010 – CGI.br
Pessoas que nunca acessaram a internet, mas usaram um computador.
Percentual (%)
Acessar sites
ou páginas
que
demoram
para
aparecer
(muito
pesadas)
Não
encontrar a
informação
desejada no
site
Ler um texto
longo na
Internet
Acessar
páginas com
janelas que
aparecem na
tela (pop up)
Lidar com
itens de
segurança
em páginas
da Internet
como testes
anti-spam,
senhas,
cadastros,
logins
Localizar um
site
específico
pelas
ferramentas
de busca,
como o
Google
Usar
teclados
virtuais de
sites (para
senhas)
TOTAL
BRASIL 46 35 29 28 21 14 10

22. CaPtcHa
Pessoas são diferentes

23. Já testou seu site?

24. Já testou o seu site?
Sem CSS
e imagens
Foto: Flickr.com - Baddog_

25. sem monitor ?

26. Como as pessoas navegam pelo leitor
de tela?

27. Como as pessoas navegam pelo leitor
de tela?

28. Como as pessoas navegam pelo leitor
de tela?

29. Já ouviu seu site hoje?

30. Apenas 6,96% das páginas do Governo Federal
eram acessíveis em 2011
(em 2010 eram 4,83% de acordo com o Censo na Web do CGI.Br)

31. 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.

32. 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;

33. Código acessível

Programação em camadas;

Não usar tabelas para diagramar;

Não utilizar frames;

Não utilizar elementos proprietários;

34. Vídeos com legendas

35. Imagens acessíveis

36. 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>

37. Contraste

38. Formulários

39. 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

40. 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>

41. Tabelas

42. 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

43. Acessível via teclado

44. HTML e CSS

45. Princípios do W3C
Web para todos, em
qualquer
dispositivo, em
qualquer lugar,
segura e confiável!
Foto: everystockphoto.com - woodleywonderworks

46. 46 de
Estrutura

Pragmático (estruturado de acordo
com os problemas a serem
abordados);

Dividido por áreas de atuação;

Padronização de funcionalidades.
O que é o e-MAG 3.0

47. 47 de
Itens padrões para o Governo Federal:
1.Página com a descrição dos recursos de
acessibilidade;
2.Teclas de atalho (3);
3.Barra de acessibilidade;
4.Apresentação do mapa do sitio;
5.Apresentação de formulário;
6.Conteúdo alternativo para imagens;
7.Apresentação de documentos.
O que é o e-MAG 3.0

48. 48 de
●
Divisão: 6 seções:
– Marcação (9)
– Comportamento (6)
– Conteúdo/Informação (12)
– Apresentação/Design (5)
– Multimídia (5)
– Formulário (8)
●
Total de 45 recomendações (Todas são importantes).
Recomendações de acessibilidade

49. ●
Cursos em EAD
●
CMS acessível Suindara
●
Checklists
●
Pesquisas
●
Tutoriais
●
Consultoria SISP
●
ASES
E-MAG 3.0 - arcabouço

50. ASES
1. Avaliadores

Avaliador de acessibilidade web;

Avaliador de código HTML/XHTML;

Avaliador de código CSS.
2. Simuladores

Simulador de navegação para cegos;

Simulador de navegação para baixa visão.
3. Ferramentas de apoio

51. 51 de

52. Alguns relatos pessoais

53. 53
Em seu trabalho pela acessibilidade, o
Departamento de Governo eletrônico (DGE)
dispõe de uma equipe de consultores, no âmbito
do C3S do SISP, que é especialista no assunto. A
equipe avaliou praticamente todos os sítios
institucionais do primeiro escalão do governo
federal e enviou os respectivos relatórios desta
análise aos órgãos.
Consultores C3S

54. 54
http://premio.w3c.br/
Inscrições até 30 de Setembro

55. 55
Fernanda Hoffmann Lobato
governoeletronico.gov.br
Twitter: @egovbr
fernanda.lobato@planejamento.gov.br
+55 (61) 2020 1738