O documento discute a importância da acessibilidade digital para garantir os direitos das pessoas com deficiência. Apresenta a Caravana da Inclusão, que promove encontros sobre o tema em cidades paulistas, e analisa a acessibilidade do site do Centro de Tecnologia da Informação Renato Archer, identificando erros que precisam ser corrigidos para atender à legislação.

1. Acessibilidade Web – Centro de Tecnologia da Informação – Renato Archer
A partir de 22 de março, a Caravana da Inclusão, Acessibilidade e Cidadania, uma iniciativa
da Secretaria de Estado dos Direitos da Pessoa com Deficiência, juntamente com a UVESP (União
dos Vereadores do Estado de São Paulo), terá a sua quarta edição em dez cidades do interior paulista.
A Caravana consiste em uma série de encontros regionais, com o objetivo de conscientizar os
participantes sobre os direitos das pessoas com deficiência, que incluem: educação inclusiva, trabalho,
cidadania, reabilitação, entre outros.
A Caravana é aberta ao público, as inscrições são gratuitas e podem ser realizadas na abertura de
cada evento.
O objetivo é fomentar políticas públicas que assegurem a cidadania e os direitos das pessoas com
deficiência. A Caravana também apresenta ao público as ações e programas da Secretaria voltados às
pessoas com deficiência.
Além do fomento a políticas públicas que assegurem a cidadania e os direitos das pessoas com
deficiência, a Caravana é um momento de diálogo, onde a comunidade tem a oportunidade de apresentar
seus destaques. É uma grande festa!
A Caravana consiste em uma série de encontros regionais, com objetivo de conscientizar os
participantes sobre os direitos das pessoas com deficiência, que incluem: educação, trabalho, cidadania,
reabilitação, entre outros.
Sendo assim, continuamos o projeto “Meu Site Acessível”, onde a ideia é mostrar ao gestor os benefícios
de ter um site oficial do município acessível a todos. Como no mês de Julho não teremos a Caravana, mas
continuamos a nossa ação com o Centro de Tecnologia da Informação (CTI) – Renato Archer.

2. Figura 1: Analise do Site do CTI Renato Archer.
Foi realizada uma avaliação da acessibilidade web do Centro de Tecnologia da Informação (CTI) –
Renato Archer (http://www.cti.gov.br/) em relação ao site da Feira de Reabilitação promovida pela
Secretaria dos Direitos da Pessoa com Deficiência do Estado de São Paulo (http://www.reabilitacao.com/), e
explicamos como se adequar à legislação existente.
A necessidade deste projeto vem da pesquisa do consorcio internacional W3C, sobre a adoção dos
padrões de acessibilidade web mundial, onde que em 2010, verificou que 98% das páginas de governo e
95% das páginas de governo federais não eram acessíveis nos padrões de acessibilidade mundial. Em 2012,
o W3C refez a pesquisa e 95% das páginas de governo e 93% das páginas de governo federais continuavam
inacessíveis para as pessoas com deficiência.
Importância da Acessibilidade Digital ao seu município.
Hoje, o mundo em que vivemos está cada vez mais permeado pelas tecnologias da informação e
comunicação, que impactam a esfera social, política, econômica, educacional, cultural e, sobretudo,
pessoal, transferindo diversas atividades e serviços do presencial para o virtual.
A desigualdade na utilização das ferramentas digitais e dos conteúdos on-line restringe o potencial
de crescimento de um país, pois não permite a apropriação do conhecimento pelas populações de baixa
renda e pouca instrução, deixando-as à margem da vida contemporânea.
Pela democratização do acesso à informação é possível promover uma distribuição mais equilibrada
das oportunidades e benefícios do desenvolvimento econômico, propiciando um modelo de crescimento
mais justo e sustentável.

3. Este tutorial tem o objetivo de orientar gestores, funcionários e cidadãos os critérios de
acessibilidade digital, assim como instruí-los com relação como ampliar o acesso acessível das informações
às pessoas com deficiência, que, de acordo com os dados do IBGE (Censo 2010), correspondem a 23,91%
da população brasileira, ou seja, 45,6 milhões de pessoas no país e 9 milhões no Estado de São Paulo.
Nesse cenário, para que não se incorra em exclusão, é fundamental que os sites governamentais,
assim como todos os espaços de utilização pública, sejam plenamente acessíveis, cumprindo a lei vigente e,
mais importante, seu papel intrínseco de promoção da inclusão.
Acessibilidade Digital representa o uso de comandos e mecanismos em hardwares e softwares que
facilitam sua operação por usuários que tenham algum tipo de deficiência. No caso de conteúdos digitais e
da Internet, além da acessibilidade operacional, há a necessidade de se garantir a acessibilidade às
informações disponibilizadas, por intermédio de sistemas plenamente navegáveis, textos que permitam
ampliação do tamanho dos caracteres e sua vocalização por programas de leitura, descrição de imagens e
audiodescrição de vídeos.
O conteúdo deste tutorial não esgota as informações sobre o tema, mas apresenta linhas gerais e
referências concretas para nortear tanto a construção ou a adaptação de um website acessível.
O outro quesito que obriga qualquer instituição a estabelecer políticas públicas de promoção da
acessibilidade web, é devido a legislação constar esta obrigação:
Considerando o artigo 5º da Constituição da República Federativa do Brasil de 1988, que
menciona que “Todos são iguais perante a lei, sem distinção de qualquer natureza, garantindo-se aos
brasileiros e aos estrangeiros residentes no País a inviolabilidade do direito à vida, à liberdade, à igualdade,
à segurança e à propriedade, em especial o inciso XXXIII, que todos terão direito a receber dos órgãos
públicos informações de seu interesse particular, ou de interesse coletivo ou geral, que serão prestadas no
prazo da lei, sob pena de responsabilidade, ressalvadas aquelas cujo sigilo seja imprescindível à segurança
da sociedade e do Estado;”
Considerando a Lei n.o
10.098, de 19 de Dezembro de 2000, que em seu artigo 2º, alínea d, dispõe
sobre barreiras nas comunicações, que qualquer entrave ou obstáculo que dificulte ou impossibilite a
expressão ou o recebimento de mensagens por intermédio dos meios ou sistemas de comunicação, sejam ou
não de massa; devem ser minimizados.
Com ênfase no Capítulo VII (Da Acessibilidade nos Sistemas de Comunicação e Sinalização) em
seu artigo 17, que estabelece que o Poder Público promoverá a eliminação de barreiras na comunicação e

4. estabelecerá mecanismos e alternativas técnicas que tornem acessíveis os sistemas de comunicação e
sinalização às pessoas com deficiência sensorial e com dificuldade de comunicação, para garantir-lhes o
direito de acesso à informação, à comunicação, ao trabalho, à educação, ao transporte, à cultura, ao esporte
e ao lazer.
Considerando o Decreto n.º 5.296 de 2 de Dezembro de 2004, em seu Capítulo VI - Do Acesso à
Informação e à Comunicação estabelece que:
“Artigo 47: No prazo de até doze meses a contar da data de publicação deste Decreto, será
obrigatória a acessibilidade nos portais e sítios eletrônicos da administração pública na rede mundial de
computadores (internet), para o uso das pessoas portadoras de deficiência visual, garantindo-lhes o pleno
acesso às informações disponíveis.
§ 1o
Nos portais e sítios de grande porte, desde que seja demonstrada a inviabilidade técnica de se
concluir os procedimentos para alcançar integralmente a acessibilidade, o prazo definido no caput será
estendido por igual período.
§ 2o
Os sítios eletrônicos acessíveis às pessoas portadoras de deficiência conterão símbolo que
represente a acessibilidade na rede mundial de computadores (internet), a ser adotado nas respectivas
páginas de entrada.
§ 3o
Os telecentros comunitários instalados ou custeados pelos Governos Federal, Estadual,
Municipal ou do Distrito Federal devem possuir instalações plenamente acessíveis e, pelo menos, um
computador com sistema de som instalado, para uso preferencial por pessoas portadoras de deficiência
visual.”
“Artigo 48: Após doze meses da edição deste Decreto, a acessibilidade nos portais e sítios
eletrônicos de interesse público na rede mundial de computadores (internet), deverá ser observada para
obtenção do financiamento de que trata o inciso III do art. 2o
.”
Reconhecendo a importância da acessibilidade aos meios de informação e comunicação, para
possibilitar às pessoas com deficiência o pleno gozo de todos os direitos humanos e liberdades
fundamentais, o artigo 9º, alínea “g”; da Convenção da ONU sobre os Direitos das Pessoas com
Deficiência, a fim de promover o acesso de pessoas com deficiência a novos sistemas e tecnologias
da informação e comunicação, inclusive à Internet.
O artigo 21, alínea “c”, menciona a necessidade de urgir as entidades privadas que oferecem
serviços ao público em geral, inclusive por meio da Internet, a fornecer informações e serviços em
formatos acessíveis, que possam ser usados por pessoas com deficiência;

5. Considerando a aprovação, nos termos do § 3º do art. 5º da Constituição Federal, do texto da
Convenção sobre os Direitos das Pessoas com Deficiência e de seu Protocolo Facultativo, assinados em
Nova Iorque, em 30 de março de 2007, pelo Decreto Legislativo n.º 186, de 09 de Julho de 2008, que foi
promulgado pelo Decreto n.º 6.949, de 25 de Agosto de 2009.
Considerando o Decreto n.º 7.185, de 27 de Maio de 2010, que dispõe sobre o padrão mínimo de
qualidade do sistema integrado de administração financeira e controle, no âmbito de cada ente da
Federação, nos termos do art. 48, parágrafo único, inciso III, da Lei Complementar n.º 101, de 4 de Maio
de 2000, destinado ao governo federal.
Que em seu Artigo 4.o relata da exigência de características adicionais no âmbito de cada ente da
Federação, na disponibilização ao cidadão de informações de todos os Poderes e órgãos do ente da
Federação de modo consolidado, permitindo o armazenamento, a importação e a exportação de dados; e
possuir mecanismos que possibilitem a integridade, confiabilidade e disponibilidade da informação
registrada e exportada.
Além da utilização, preferencialmente, aos padrões de arquitetura e-PING – Padrões de
Interoperabilidade de Governo Eletrônico (Artigo 5.º) e a disponibilização das informações em meio
eletrônico de acesso público ao conjunto de recomendações para acessibilidade dos sítios e portais do
governo brasileiro, o e-MAG - Modelo de Acessibilidade de Governo Eletrônico (Artigo 6.º).
Considerando a Lei n.º 12.527, de 18 de Novembro de 2011, que dispõe sobre os procedimentos a
serem observados pela União, Estados, Distrito Federal e Municípios, com o fim de garantir o acesso a
informações ao cidadão previsto no inciso XXXIII do art. 5o
, no inciso II do § 3º do art. 37 e no § 2º do art.
216 da Constituição Federal, que em seu artigo 8 § 3o “Os sítios de que trata o § 2o deverão, na forma de
regulamento, atender, entre outros, aos seguintes requisitos:
III - adotar as medidas necessárias para garantir a acessibilidade de conteúdo para pessoas com
deficiência, nos termos do art. 17 da Lei no
10.098, de 19 de dezembro de 2000, e do art. 9o
da Convenção
sobre os Direitos das Pessoas com Deficiência, aprovada pelo Decreto Legislativo no
186, de 9 de julho de
2008.
Sendo assim, baseado no artigo 31 da Convenção da ONU sobre os Direitos das Pessoas com
Deficiência que estabelece a formulação e implementação de políticas públicas destinadas a colocar em
prática a presente convenção, auxiliamos o Gestor do Município na aplicabilidade das questões da
acessibilidade web, com uma analise virtual e de forma automática do site em relação a acessibilidade web:
Abaixo a descrição completa da análise da acessibilidade web do Centro de Tecnologia da
Informação (CTI) – Renato Archer:

6. No quesito da Acessibilidade Web, a primeira ação de validação do site, foi utilizando o validador
brasileiro DaSilva (WCGA 1.0), onde é possível analisar a acessibilidade web de qualquer site.
Lembramos que DaSilva utiliza como resultado a quantidade de erros e avisos em cada uma das
três prioridades, sendo que para um site ter êxito em sua validação, precisa ter zero (0) erros nas três
prioridades (1,2 e 3), resultando um selo de acessibilidade para o referido site, conforme a imagem 2 do
site da Secretaria dos Direitos da Pessoa com Deficiência.
A Prioridade 1, são os pontos que os criadores de conteúdo Web devem satisfazer inteiramente. Se
não o fizerem, um ou mais grupos de usuários ficarão impossibilitados de acessar as informações contidas
no documento. A satisfação desse tipo de pontos é um requisito básico para que determinados grupos
possam acessar documentos disponíveis na Web.
A Prioridade 2, são os pontos que os criadores de conteúdos na Web deveriam satisfazer. Se não o
fizerem, um ou mais grupos de usuários terão dificuldades em acessar as informações contidas no
documento. A satisfação desse tipo de pontos promoverá a remoção de barreiras significativas ao acesso e
navegação de documentos disponíveis na Web.
A Prioridade 3, são os pontos que os criadores de conteúdos na Web podem satisfazer. Se não o
fizerem, um ou mais grupos poderão se deparar com algumas dificuldades em acessar informações contidas
nos documentos. A satisfação deste tipo de pontos irá melhorar o acesso a documentos armazenados na
Web.
Todos os testes do DaSilva têm a sua fundamentação nos antigos padrões WCAG 1.0 do W3C.
Figura 2: Analise do Site da Secretaria dos Direitos da Pessoa com Deficiência pelo DaSilva.

7. O site da Secretaria dos Direitos da Pessoa com Deficiência passou na validação e obteve o Selo
de Acessibilidade Web pela ferramenta DaSilva, pois não possuiu nenhum erro em sua validação.
Ao analisar o site do Centro de Tecnologia da Informação (CTI) – Renato Archer, temos como
resultado que o site ainda não é acessível, pois o mesmo nos retorna 28 erros na Prioridade 1, 6 erros na
Prioridade 2 e 0 erro na Prioridade 3.
Figura 3: Analise do Site da Universidade Federal de Santa catrina - UFSC pelo DaSilva.
A prioridade 1 apresentou 28 erros no código “Html” do site a seguir:
26 ocorrências: Fornecer um equivalente textual a cada imagem (isso abrange:
representações gráficas do texto, incluindo símbolos, GIFs animados, imagens utilizadas
como sinalizadores de pontos de enumeração, espaçadores e botões gráficos), para tanto,
utiliza-se o atributo "alt" ou "longdesc" em cada imagem. Obs.: Para scripts você deve
utilizar noscript. (1.11);
2 ocorrências:Assegure a acessibilidade de objetos programados, tais como programas
interpretáveis e applets, garantindo que a resposta a eventos seja independente do
dispositivo de entrada e que qualquer elemento dotado de interface própria possa funcionar
com qualquer leitor de tela ou navegador que o usuário utilize. Evite colocar scripts que
estejam vinculados a links, se isso não for possível, fornecer informações equivalentes em
uma página alternativa acessível. (1.19);
A prioridade 2 apresentou 6 erros no código “Html” do site:
4 ocorrências: Utilizar unidades relativas, e não absolutas, nos valores dos atributos de
tabelas, textos, etc. Em CSS não use valores absolutos como "pt" ou "px" e sim valores
relativos como o "em", "ex" ou em porcentagem. (2.2);
1 ocorrência: Usar o elemento "label" juntamente com o atributo "id" para associar os
rótulos aos respectivos controles dos formulários. Assim, os leitores de tela associarão os
elementos do formulário de forma correta. Usando o comando "label" as pessoas que usam
leitores de tela não terão problemas ao ler o formulário. Caso haja grupos de informação,
controles, etc, a estes devem estar devidamente diferenciados, seja por meio de
espaçamento, localização ou elementos gráficos. (2.15);
1 ocorrência: Utilize elementos de cabeçalho de forma lógica, organizando o conteúdo de
acordo com uma hierarquia. (2.10);

8. A segunda ação foi a realização da mesma validação dos sites, em uma ferramenta da Comunidade
Europeia que já utiliza os novos padrões da W3C para acessibilidade web: WCGA 2.0, denominada Access
Monitor.
Lembramos que Access Monitor utiliza como resultado um índice, que é uma unidade de medida
utilizada em todos os testes do validador e cujo resultado final sintetiza e quantifica o nível de
acessibilidade alcançado. O índice está representado numa escala de 1 a 10, representando o valor 10 uma
adoção plena da boa prática induzida pelo AccessMonitor.
O índice é um indicador que se destina ao uso exclusivo dos criadores do sítio Web, sendo que para
um site ter êxito em sua validação, precisa ter zero erros nos três critérios (A, AA e AAA).
O site da Feira da Reabilitação de 2013 obteve como resultado final, o índice 10, tendo êxito na
validação da prioridade A, AA e AAA, sem possuir nenhum erro em sua validação.
Figura 4: Analise do Site da Universidade Federal de Santa Catarina - UFSC pelo AcessMonitor.
Já ao validar o Centro de Tecnologia da Informação (CTI) – Renato Archer, obteve como
resultado final, o índice 4.1, não tendo êxito na validação de nenhuma prioridade (A, AA e AAA).

9. Figura 5: Erros de Acessibilidade Web pelo Acess Monitor do site do CTI.
A prioridade A, o site apresentou 8 erros, sendo:
Inserção de Multimídia (embed, object, iframe, applet): Apresentou 1 erro, sendo 2
elementos “object” e 2 elementos “object” sem textos alternativos”, estando em desacordo
com o Item H27 do WCGA 2.0. Quando utilizamos o elemento <object>, devemos
disponibilizar um equivalente alternativo no corpo do elemento.
Links para contornar blocos de informação: Apresentou 1 erro neste quesito, onde o site
possui 75 links, sem nenhum possuir salto para o conteúdo principal, que não estão de
acordo com o Item G1 do WCGA 2.0. O objetivo é disponibilizar um mecanismo que
permita contornar blocos de material que se repetem em múltiplas páginas Web, passando
diretamente para o conteúdo principal. O primeiro item interativo da página Web deve ser
um link que nos conduza ao início do conteúdo principal.
Tabela de Dados: Apresentou 1 erro neste quesito, sendo 1 Tabela de dados sem o
elemento <caption> ou o atributo summary, estando em desacordo com o Item H39 do
WCGA 2.0. O objetivo deste atributo, é que o elemento <caption> atribui um título à tabela.
O atributo summary disponibilizar uma antevisão do propósito dos dados apresentados na
tabela ou explica como navegar pela tabela. O elemento <caption> pode ser usado quer se
use ou não o atributo summary.
Marcação de formulários: Apresentou 2 erros neste quesito, onde o site possui 1 controle
de formulário associados uma etiqueta (label) e 1 controle de formulário sem descrição e
etiqueta associada (label), estando em desacordo com o Item H65 do WCGA 2.0. O objetivo
deste item é que os elementos <label> associados aos elementos <input> asseguram que a

10. informação relacionada com os campos é lida pelos ledores de tela sempre que os campos de
edição recebem o foco. O atributo title pode ser usado sempre que seja difícil, em termos de
design, acomodar a label ou quando a mesma possa causar confusão. Também o site
apresentou erros em 1 formulário, sendo que o mesmo está sem o botão de envio, estando
em desacordo com o Item H32 do WCGA 2.0. O objetivo deste item é disponibilizar um
mecanismo que permita aos usuários efetuarem explicitamente um pedido de mudança de
contexto. Para cada formulário, verifique que o mesmo dispõe de um botão de envio (<input
type="submit" ... >, <input type="image" ...>, ou <buttontype="submit" ...>).
Standards W3C: (X)HTML + CSS: Apresentou 2 erros neste quesito, sendo que o site
possui 40 elementos com atributo <id>, onde que 2 atributos <id> possui valor duplicado,
estando em desacordo com o Item F77 do WCGA 2.0. O objetivo destes valores duplicados
afixados no atributo <id> podem-se tornar problemáticos para os agentes de utilizador, uma
vez que os mesmos se apoiam nestes atributos para determinar a relação existente entre as
diferentes partes do conteúdo. Também o site apresentou 115 erros de validação (X)HTML,
estando em desacordo com o Item G134 do WCGA 2.0. O objetivo deste item é eliminar
ambiguidades nas páginas Web derivadas de código que não está em conformidade para
com as especificações formais em vigor. Os resultados deste teste foram obtidos através do
Serviço de Validação da Marcação do W3C.
Elementos e atributos de apresentação/obsoletos: Apresentou 1 erro neste quesito, sendo
que o site possui 2 atributos (X)HTML para controle da apresentação visual, estando em
desacordo com o Item G140 do WCGA 2.0. O objetivo deste atributo é separar as camadas
de estrutura, funcionalidade e apresentação permite induzir a semântica através de um
formato que pode ser programaticamente determinável através da camada estrutural.
Na prioridade AA, o site apresentou 2 erros, sendo:
Uso de unidades absolutas: Apresentou 2 erros neste quesito, sendo que o site possui 3
casos de falta de definição de tamanho de letra em unidades de medida absoluta, estando em
desacordo com o Item C12 do WCGA 2.0. O objetivo deste item é ter os tamanhos de letra
definidos em unidades absolutas, tais como pontos ou pixéis, os comandos do menu
Tamanho de Letra existentes no Internet Explorer 7 ou superior não terão quaisquer efeitos
sobre os tamanhos de letra da página.
Na prioridade AAA, o site apresentou 2 erros, sendo:
Marcação de cabeçalhos: Apresentou 1erro neste quesito, sendo que o site possui 4 casos
de cabeçalhos (<h1>-<h6>), sendo que 1 cabeçalho possui salto de nível hierárquico
incorreto, estando em desacordo com o Item G141 do WCGA 2.0. O objetivo deste item é
facilitar o processo de navegação pela página, são importante que se organizem os

11. cabeçalhos de acordo com os seus níveis hierárquicos (h1 seguido por h2; h2 seguido por h2
ou h3; h3 seguido por h3 ou h4, etc). Em todas as páginas devemos marcar, pelo menos, um
cabeçalho de nível 1, o qual marca o texto que se identifica como sendo o que serve de
título. É igualmente boa prática marcar os textos que se identificam como sendo as seções
com cabeçalhos de nível 2. Faça com os cabeçalhos existentes um índice e verifique se o
índice (as suas seções e subseções) faz sentido.
Marcação de Links, menus e texto dos links: Apresentou 1erro neste quesito, sendo que o
site possui 75 links, sendo 3 links com o mesmo texto que apontam destinos diferentes,
estando em desacordo com o Item F84 do WCGA 2.0. Os objetivos deste item é relacionada
com uma falha comum em que links como "clique aqui" ou "ver mais" precisam da
informação que os rodeia para contextualizar a sua finalidade, onde só pelo contexto é
possível aos utilizadores distinguir os links e determinar o seu propósito.
A terceira ação foi validar os sites conforme o Modelo de Acessibilidade de Governo Eletrônico
(e-MAG), e que consiste em um conjunto de recomendações a ser considerado para que o processo de
acessibilidade dos sítios e portais do governo brasileiro seja conduzido de forma padronizada e de fácil
implementação.
A primeira versão do e-MAG foi disponibilizada para consulta pública em 18 de janeiro de 2005 e a
versão 2.0 já com as alterações propostas, em 14 de dezembro do mesmo ano. Em 2007, a Portaria nº 3, de
7 de maio, institucionalizou o e-MAG no âmbito do Sistema de Administração dos Recursos de Tecnologia
da Informação – SISP, tornando sua observância obrigatória nos sítios e portais do governo brasileiro,
sendo que atualmente esta na terceira versão e-MAG.
Para a elaboração da versão 2.0 foi realizado um estudo das regras de acessibilidade através de um
método comparativo entre as normas adotadas por diversos países. Também foi realizada uma análise
detalhada das regras e pontos de verificação do órgão internacional WAI/W3C, presentes na WCAG 1.0. Já
na versão 3.0 do e-MAG, foi abolido a divisão das recomendações de acessibilidade em níveis de
prioridade, sendo que todas as recomendações são igualmente relevantes.
Utilizamos uma extensão para o navegador Google Chrome denominado eScanner (Electronic
Scanner), que verifica automaticamente o nível de acessibilidade de uma página Web segundo o Modelo de
Acessibilidade de Governo Eletrônico, o e-MAG em sua versão 3.0, sendo sua versão atual 2.2 e
desenvolvido por Victor Adriel Oliveira.
Como resultado desta avaliação, é retornado a quantidade de erros e de alertas. Todas as
recomendações que dependem da avaliação manual do usuário da extensão são emitidas como alertas. Já

12. todas as recomendações que podem ser verificadas apenas a partir da análise automática do código fonte
são classificadas como erros.
Os erros são mostrados em vermelho na janela principal e representam as recomendações que
podem ser verificadas diretamente a partir da análise do código fonte. Por exemplo, todas as imagens no
código HTML, segundo as especificações do e-MAG, precisam ter uma descrição através do atributo alt. A
ausência ou ocorrência deste atributo nos elementos imagem pode ser facilmente detectada no código
fonte, logo essa recomendação é classificada como um erro na abordagem utilizada.
Ao analisar o site da Feira de Reabilitação, tivemos como conclusão preliminar que o site possui
3 erros baseados no e-MAG 3.0, sendo eles:
Utilizar corretamente os níveis de cabeçalho (Recomendação 3): Os níveis de cabeçalho devem
ser utilizados de forma lógica e semântica para facilitar a leitura e compreensão. Cada página
deverá ter apenas um h1, já os níveis do h2 ao h6 poderão ser utilizados mais de uma vez na página.
Ordenar de forma lógica e intuitiva a leitura e tabulação (Recomendação 4): Deve-se criar o
código HTML com uma sequência lógica de leitura para percorrer links, controles de formulários
e objetos. Essa sequência é determinada pela ordem que se encontra no código HTML. O atributo
tabindex somente deverá ser utilizado quando existir real necessidade e deve se evitar uma ordem
de tabulação inconsistente.
Não abrir novas instâncias sem a solicitação do usuário (Recomendação 9): A decisão de
utilizar novas instâncias é do cidadão. Assim, não devem ser utilizadas pop-ups ou abertas novas
abas e/ou janelas, por exemplo, que não tenham sido solicitadas pelo usuário. Obs: A função 'alert'
do javascript não gera um pop-up, mas uma mensagem que pode ser lida por leitores de tela.
Na analise do site do Centro de Tecnologia da Informação (CTI) – Renato Archer, tivemos
como conclusão preliminar que o site possui 5 erros baseados no e-MAG 3.0, sendo eles:
Não abrir novas instâncias sem a solicitação do usuário (Recomendação 9): A decisão de
utilizar novas instâncias é do cidadão. Assim, não devem ser utilizadas pop-ups ou abertas novas
abas e/ou janelas, por exemplo, que não tenham sido solicitadas pelo usuário. Obs: A função 'alert'
do javascript não gera um pop-up, mas uma mensagem que pode ser lida por leitores de tela.
Garantir que os objetos programáveis sejam acessíveis (Recomendação 10): O script deve ser
desenvolvido tomando-se o cuidado para que seja acessível, e o elemento noscript deve ser utilizado
para abranger os casos em que scripts não são suportados.
Em tabelas, utilizar títulos e resumos de forma apropriada (Recomendação 23): O título da
tabela deve ser definido pelo elemento caption e deve ser o primeiro elemento utilizado após a
declaração do elemento table.

13. Agrupar campos de formulário (Recomendação 44): Deverão ser agrupados os controles de
formulário utilizando-se o elemento fieldset. Para cada fieldset, é possível fornecer uma legenda
que explica claramente o propósito ou natureza dos agrupamentos.
Para ampliar a metodologia, realizamos a quarta ação que foi a validação dos códigos dos sites, em
especial a Folha de Estilo – CSS e a Marcação do código.
Uma folha de estilos é um conjunto de regras que informa a um programa, responsável pela
formatação de um documento, como organizar a página, como posicionar e expor o texto e, dependendo de
onde é aplicada, como organizar uma coleção de documentos, isto é, oferece aos desenvolvedores uma
maneira fácil e eficiente de definir o layout e embelezar uma página com elementos de design, como cores,
cantos arredondados, gradientes e animação.
Utilizamos uma ferramenta online desenvolvida pela W3C para validação de folha de Estilo
( http://jigsaw.w3.org/css-validator/#validate_by_uri), sendo que a intenção é que nos retorne .como
resultado, nenhum erro de validação, possibilitando a utilização do selo de validação de CSS do W3C.
O site da Feira de Reabilitação foi validado com êxito (sem apresentar nenhum erro),
possibilitando a utilização do selo.
Figura 6: Analise do CSS do site da Feira de Reabilitação - 2013.
O site do Centro de Tecnologia da Informação (CTI) – Renato Archer, apresentou somente 31
erros em sua validação de folha de estilo.

14. Figura 7: Analise do CSS do site do CTI.
Já na quinta ação, validamos sobre a marcação de como as páginas da web são escritas
(HTML), isto é, uma linguagem de programação que informa os navegadores como estruturar e apresentar
conteúdo em uma página, fornecendo blocos básicos de construção da web.
Utilizamos uma ferramenta online desenvolvida pela W3C para Validação da Marcação:
http://validator.w3.org/#validate_by_uri.
Ao analisar o site da Feira de Reabilitação apresentou 0 erros, tendo êxito na validação, sendo
eles:
Figura 8: Analise da Marcação de página do site da Feira de Reabilitação.
Já ao analisar o site do Centro de Tecnologia da Informação (CTI) – Renato Archer, a
ferramenta da W3C retornou 115 erros da marcação de página.
Figura 9: Analise da Marcação de página do site do CTI.

15. Na sexta ação, utilizamos a ferramenta de validação da WebAIM, que é uma organização dentro
do Centro para Pessoas com Deficiência ( CPD ) em Utah State University, sendo um dos 61 centros
universitários de excelência em Deficiências do Desenvolvimento, Educação, Investigação e Serviços,
localizado nas principais universidades em todo os Estados Unidos. O CPD apoia as pessoas com
deficiências de desenvolvimento através da preparação interdisciplinar e de educação continuada, na
prestação de serviços à comunidade, pesquisa e divulgação.
Ao analisar o site da Feira de Reabilitação apresentou nenhum erro durante a validação:
Figura 10: Analise da validação WebAIM do site da Feira de Reabilitação.
Já ao analisar o site do Centro de Tecnologia da Informação (CTI) – Renato Archer, a
ferramenta da WebAIM retornou 4 erros durante a sua validação:
Figura 11: Analise da validação WebAIM do site do CTI.

16. Na sétima ação, utilizamos a ferramenta online GTmetrix, que é uma ferramenta muito útil para
saber como está o desempenho de seu site, analisando diversos fatores, como problemas com o CSS,
Javascript, imagens, cache e compactação das páginas entre outros, que podem influenciar no aumento do
tempo de carregamento do site quando os visitantes o acessam.
Também apresenta alguns detalhes que podem ajudar os desenvolvedores a solucionar diversos
problemas nos sites, sendo que o usuário poderá utilizar um equipamento antigo, conexão discada e até
dispositivos movéis.
Como resultado a ferramenta utiliza um índice que vai da letra “A” até “F”, sendo a letra “A” o
ideal para os sites estarem validados, tanto a respeito do tempo de carregamento e performance do site ao
usuário.
Ao analisar o site da Feira de reabilitação, tivemos como resultado de Desempenho de
velocidade “B” e de Desempenho de carregamento da página “C”.
O tempo gasto de carregamento da primeira página foi de 4.39 segundos; o tamanho total da página
é de 1.07 MB, com necessidade de fazer 70 requisições do servidor principal para obter todos os elementos
da página principal.
Figura 12: Analise do Desempenho Virtual do site da Feira de Reabilitação.

17. Ao analisar o site do Centro de Tecnologia da Informação (CTI) – Renato Archer, tivemos
como resultado de Desempenho de velocidade “C” e de Desempenho de carregamento da página “C”.
O tempo gasto de carregamento da primeira página foi de 5.04 segundos; o tamanho total da página
é de 1.28 MB, com necessidade de fazer 68 requisições do servidor principal para obter todos os elementos
da página principal.
Figura 13: Analise do Desempenho Virtual do site do CTI.
Abaixo uma comparação entre os sites analisados, que demonstra uma boa performance do site da UFSC :
Figura 13: Analise do Desempenho Virtual comparando os sites do CTI, da Feira da Reabilitação e da
Secretaria dos Direitos da Pessoa com Deficiência do Estado de São Paulo.

18. Para finalizar o nosso trabalho, a oitava ação avaliou o Designer Responsivo do website.
O site deve ter um aspecto apelativo e funcionar sem problemas para o tamanho de tela mais usado.
Embora não possa agradar a todos os visitantes do seu site, deve garantir também que o seu site continua
funcional e com um aspecto bom/aceitável para os restantes tamanhos de tela. Os três pontos mais
importantes que deve ter em mente quando otimiza um site são:
Visualização da página inicial: A informação chave está visível na sua página inicial sem ser
necessário que os visitantes usem as barras de rolamento? De uma maneira geral os internautas não gostam
de usar o "scroll", verifique se essa parte essencial do conteúdo da página inicial é vista pelos seus
visitantes quando estes rolam a página numa altura de apenas uma tela, ou duas no máximo.
Facilidade de leitura do site: Verifique se é possível ler os textos nas diferentes colunas do site de
forma adequada. Por vezes os diferentes tamanhos de tela alteram as larguras de colunas e secções do site
dificultando a leitura dos textos.
Estética do site: Como é que muda o aspecto do seu site? Os diferentes elementos do site mantêm-
se alinhados para essa resolução de tela? As seções ficam com o tamanho certo, as legendas alinham com
as imagens?...
Abaixo demostrarei como a página principal do site da Feira de Reabilitação - 2013 é apresentada
utilizando algumas resoluções de tela para desktop / notebook, tablets e celulares:
Resolução 800 X 600 (PC - Notebook) Resolução 1366 X 768 (PC - Notebook)

19. Resolução 768 X 1024 (Tablet) Resolução 800 X 1280 (Tablet)
Resolução 240 X 320 (Celular) Resolução 320 X 480 (Celular) Resolução 640 X 960 (Celular)
Fizemos a mesma comparação com o site do Centro de Tecnologia da Informação (CTI) –
Renato Archer é apresentada utilizando algumas resoluções de tela para desktop / notebook, tablets e
celulares:
Resolução 800 X 600 (PC - Notebook) Resolução 1366 X 768 (PC - Notebook)

20. Resolução 768 X 1024 (Tablet) Resolução 800 X 1280 (Tablet)
Resolução 240 X 320 (Celular) Resolução 320 X 480 (Celular) Resolução 640 X 960 (Celular)
Conclusão: Levando em consideração cada validação acima, a nosso ver preliminarmente
poderíamos falar que o site do Centro de Tecnologia da Informação (CTI) – Renato Archer pode ser
facilmente corrigido para se tornar acessível e ideal como referência aos demais sites governamentais,
lembrando que em uma visão de validação automática.
Sendo válido utilizar a metodologia acima para avaliar de forma simples, rápida e sem gastos os
quesitos de acessibilidade e usabilidade de um site.
Mas o ideal e recomendado a validação de especialista, realizado tanto por pessoas com deficiência,
desenvolvedores e usuários leigos, para os mesmos ampliarem esta pequena visão de acessibilidade.