O documento descreve o software ASES, que permite avaliar a acessibilidade de websites de acordo com normas brasileiras. O ASES fornece ferramentas para verificar, simular e corrigir a acessibilidade de páginas, sites e portais. Ele é gratuito e pode ser usado em sistemas Windows e Linux. O documento explica as várias funções do ASES para análise de códigos HTML, CSS e simulação de leitores de tela e baixa visão.

1. ASES –Avaliador e Simulador de Acessibilidade Web
Além do software Da Silva (é um serviço online), que permite a verificação da acessibilidade
de websites, iremos falar de outro software que aprofunda esta análise.
O ASES (Avaliador e Simulador de Acessibilidade de sítios) é o produto da parceria entre o
Departamento de Governo Eletrônico e a OSCIP Acessibilidade Brasil, que permite a verificação da
acessibilidade de websites, se os mesmos estão dentro dos princípios de acessibilidade
preconizados pela lei federal de acessibilidade (Lei no. 10 098, de 19 de dezembro de 2000), que
estabelece normas gerais e critérios básicos para a promoção da acessibilidade das pessoas com
deficiência ou com mobilidade reduzida e dá outras providências.
Tendo por objetivo fornecer instrumentos que viabilizem a adoção da acessibilidade pelos
órgãos do governo, o ASES é uma ferramenta que permite avaliar, simular e corrigir a
acessibilidade de páginas, sítios e portais, sendo de grande valia para os desenvolvedores e
publicadores de conteúdo.
Para os usuários brasileiros o programa é distribuído de forma gratuita sob licença LGPL -
GNU Lesser General Public License.
O ASES é acessível, podendo ser utilizado por pessoas com deficiências, salvo os casos em
que a deficiência impeça o objetivo da ferramenta em questão. Por exemplo, um cego não irá
descrever uma imagem, sendo assim, ele não utilizaria essa ferramenta do software, porém nada
impede que ele faça correções em códigos HTML.
Página 1

2. A ferramenta pode ser obtida gratuitamente, sendo que é disponível para o sistema
operacional Windows (ases-1-0-2 e o Java Application Platform SDK ) e Linux(ases-1-0-2 e o Java
Runtime Environment - JRE ).
Existe também uma comunidade ASES no Portal do Software Público, onde é possível baixar
os arquivos fontes e participar na melhoria dessa ferramenta.
Após baixar a ferramenta em seu computador, iremos clicar no ícone para iniciarmos a
configuração inicial da ferramenta:
Na tela abaixo é que iremos realizar todo o procedimento de verificação de nosso website, a
fim de conferir a página de acordo com as normas de acessibilidade do W3C/EMAG.
As opções são:
 Tipo de Avaliação: Onde você poderá escolher entre avaliar o website, seguindo as regras do
WCAG ou E-Mag;
 Níveis a Avaliar: Onde você poderá escolher entre:
 Nível 1: Avalia apenas 1 nível de diretório.
Página 2

3.  Nível 2: Avalia apenas 2 níveis de diretório.
 Nível 3: Avalia apenas 3 níveis de diretório.
 Site: Avalia todas as páginas do site.
 Página: Avalia apenas a página indicada.
 Arquivo: Avalia apenas o arquivo desejado.
 Diretório: Avalia todas as páginas do diretório selecionado.
Nível de Prioridades:
 Prioridade 1: 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.
 Prioridade 2: 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 a documentos disponíveis na Web.
 Prioridade 3: 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 melhorar o acesso
a documentos armazenados na Web.
URL: Onde você digitará o endereço do website que se deseja avaliar, exemplo www.sp.gov.br;
Página 3

4. As opções do Resumo do Relatório são:
 Continuar: Este botão é responsável por continuar uma avaliação previamente interrompida e
salva (*.ASES), ou para recomeçar uma avaliação que tenha sido simplesmente pausada.
 Pausar: Serve para suspender uma avaliação. Para continuar de onde parou, basta clicar em
"Continuar".
 Retroceder todas: Retrocede à primeira página da tabela de erros.
 Retroceder uma: Retrocede à página de erros imediatamente anterior.
 Drop down: é um contador de páginas avaliadas. Clique sobre ele para localizar uma página
específica.
 Avançar uma: Avançar para a página subsequente a atual.
 Avançar todas: Avançar ao final da avaliação, a última página avaliada.
 Não Avaliadas: Botão que apresenta um relatório de todas as páginas não avaliadas.
 Finalizar: Finaliza uma avaliação em andamento. O Usuário é perguntado se deseja salvá-la
antes de terminá-la.
As opções da Barras de progresso:
 Avaliação Total: Exibe a porcentagem de quanto da página/sítio foi avaliado até o momento.
 Página Atual: Este se aplica a valiçãões com mais de uma página. Exibe a porcentagem a
página que está sendo avaliada.
 Barra de Velocidade: Através deste botão o usuário pode, se diminur a velocidade, liberar
recursos do seu computador, em detrimento da velocidade de avalição. Geralmente usado
quando se quer realizar várias tarefas simultaneamente, em conjunto com a avaliação de um
sítio. Ela também limita a banda de downloading de páginas avaliadas pelo ASES, deixando o
usuário navegar sem problemas se possuir conexões de baixa velocidade.
 Relatório da URL: Exibe uma tabela contendo erros encntrado na URL referida.
 Código Original: Exibe o código original, apenas para comparação, pois este não é editável.
 Código em Edição: É exibido o código fonte editável, como um editor de HTML.
Abas de Erros e Avisos: Exibe erros e avisos encontrados no código em uma tabela. Os
erros/prioridades variam de grau 1 a 3, dependendo da regra do W3C ou E-MAG que foi infringida.
Para o usuário ter acesso ao erro/aviso encontrado basta clicar sobre o número corresponde à linha
para ser levado, na tela do código fonte editável, até o erro.
Colunas da tabela de erros/avisos: P.V.: Ponto de Verificação - Indica que regra do E-MAG/WCAG
foi infringida.
 CASOS GERAIS: Uma breve descrição do erro encontrado.
Página 4

5.  OCORRÊNCIAS: A quantidade de vezes que determinada regra foi infringida.
 LINHAS: As linhas que possuem erros. Ao clicar sobre elas, o usuário é levado até sua
ocorrência no código.
 Tela Anterior: Retorna à tela anterior a este avaliador.
 Reverter: Recarrega o código original, sem edição alguma.
 Saiba Mais: É um quadro de dicas e esclarecimentos a respeito de cada erro encontrado, de
acordo com o E-MAG.
Página 5

6. Avaliador de CSS
Verifica se o código CSS está de acordo com as normas de acessibilidade do W3C
 Url: Endereço do arquivo que se deseja avaliar.
 Código em Edição: Exibe o código que pode ser corrigido
 Código Original: Exibe o código que foi avaliado, este não é alterado.
 Salvar: Abre a opção de salvar o arquivo.
 Abrir: Abre uma caixa de diálogo para abrir um arquivo CSS.
 Salvar como: Abre uma caixa de diálogo para salvar o arquivo com outro nome mantendo o
original.
 Lista de Erros: Mostra as linhas e as mensagens de erro ou aviso encontradas na avaliação
do CSS.
Página 6

7. Avaliador de HTML/XHTML
Verifica se a sintaxe do código HTML/XHTML está de acordo com as normas do W3C.
Tipo de Avaliação: Com esta ferramenta o usuário pode conferir se a sintaxe empregada ao código
HTML/XHTML está correta.
 URL: Endereço da página que se deseja avaliar.
 Código em Edição: É exibido o código fonte editável, como um editor de HTML.
 Código Original: Exibe o código original, apenas para comparação, pois este não é editável.
 Salvar: Salva o arquivo alterado.
 Abrir: Abre, e avalia automaticamente, o arquivo HTML.
 Salvar Como: Salva o arquivo alterado com um nome diferente do original.
 Tela Anterior: Retorna à tela anterior a este avaliador.
 Reverter: Recarrega o código original, sem edição alguma.
 Lista de Erros: Lista todos os erros de sintaxe encontrados no código. E, ao clicar sobre o
erro, o usuário é direcionado à sua ocorrência no código editável.
Página 7

8. Simulador de Leitor de Tela
Indica o menor tempo de leitura que um leitor de tela levaria para chegar a determinado ponto
da página.
 Url: Endereço do arquivo que se deseja avaliar.
 Página Linear: Mostra a página sem formatação visual e com campos que os leitores de tela
reconhecem, como descrição de imagens. Indica o tempo mínimo para ler determinado trecho
da página pelo melhor caminho utilizando os links internos.
 Procurar texto: Fornece um mecanismo para encontrar palavras ou partes do texto após a
linearização.
 Links Internos: Lista os links internos da página.
 Abrir: Abre um arquivo local para ser simulado.
 Tela Anterior: Volta para a tela de avaliação de acessibilidade.
Página 8

9. Simulador de Navegação Para Baixa Visão
Simula algumas doenças ou incapacidades que afetam a visão. São elas: hipermetropia,
miopia, daltonismo, catarata, glaucoma e retinopatia.
 Menu Arquivo: Mostra as opções para navegação.
 Salvar Imagem: Salva o conteudo em que se está simulando a doença ou incapacidade como
uma imagem.
 Sair: Fecha o simulador de baixa visão.
 Problemas/Deficiências: Mostra o menu a lista das Deficiência e / ou problemas.
 Hipermetropia: Simula diversos graus de Hipermetropia.
Página 9

10. Miopia: Simula diversos graus de Miopia.
Daltonismo: Simula protanopia, deuteranopia, tritanopia, e monocromia.
Página 10

11. Catarata: Simula os diversos agravamentos da catarata.
Glaucoma: Simula as perdas do campo visual do glaucoma.
Página 11

12. Retinopatia: Simula a retinopatia e perda de foco provocada pela doença.
Link para descrição das incapacidades encontradas neste simulador
Página 12

13. Ferramenta Associadora de Descrição para Imagens
Associa descrições de imagens (obrigatórias às normas de acessibilidade) àquelas imagens
desprovidas das tais encontradas durante a análise.
 Descrição da Ferramenta: Ferramenta responsável pela identificação e inserção (feita pelo
usuário) da falta de descrição em imagens.
 URL: Endereço da página que se deseja avaliar.
 Código em Edição: É exibido o código fonte editável, como um editor de HTML.
 Código Original: Exibe o código original, apenas para comparação, pois este não é editável.
 Regra: Regra que obriga a todas as imagens possuirem um correspondente alternativo em
texto para os cegos.
 Digite a Descrição a para a imagem: O usuário deve digitar aqui a o conteúdo alternativo para
a imagem.
 Aplicar: Aplica o conteúdo alternativo inserido na imagem.
 Lista de Erros: Lista todos os erros de sintaxe encontrados no código. E, ao clicar sobre o
erro, o usuário é direcionado à sua ocorrência no código editável.
 Salvar: Salva o arquivo alterado.
 Abrir: Abre, e avalia automaticamente, o arquivo HTML.
 Tela Anterior: Retorna à tela anterior a este avaliador.
 Reverter: Recarrega o código original, sem edição alguma.
Página 13

14. Ferramenta Análise Sistemática para Imagens
Ferramenta que descobre a ocorrência da falta de descrição de uma mesma imagem em
diversas páginas distintas.
 Descrição da Ferramenta: Esta ferramenta percebe a repetição de uma mesma imagem sem o
conteúdo alternativo e lista todas as ocorrências para que o usuário possa alterá-las
automaticamente.
 Regra: Regra que obriga a todas as imagens possuirem um correspondente alternativo em
texto para os cegos.
 Digite a Descrição para uma Imagem: Neste campo o usuário deve digitar a descrição da
imagem. Ex.: Fotografia de uma torta.
 Lista de Erros: Exibe todos os erros encontrados.
 Salvar Modificados: Salva todos os conteúdos alternativos que foram modificados.
 Salvar Última Página: Salva apenas a última página alterada.
 Aplicar a Página: Aplica o conteúdo alternativo que foi digitado em todas as suas ocorrências
da página.
 Aplicar a Todos: Aplica a todos as ocorrências de erros (todas as páginas).
 Painel Anterior: Retorna ao painel anterior.
 Detalhamento sobre a Funcionalidade Salvar Modificados: Ao clicar em Salvar Modificados
será apresentada uma janela que permite escolhermos um diretório onde será criada uma
estrutura de pasta similar a encontrada no site analisado. para cada página salva são criados
dois arquivos, possuem o mesmo nome que o da pagina salva diferindo apenas na extensão,
sendo um deles em txt, que contem o caminho correto do local original da página salva,
permitindo que possamos recolocar o arquivo corrigido no local correto, e o de extensão
html, que contem o código corrigido.
Por motivo de algumas paginas virem com caracteres não permitidos para nomes de
arquivos, alguns caracteres destes nomes precisam ser convertidos para o número correspondente
da tabela ASCII, estes estarão entre vírgulas no nome do arquivo
exemplo:
 Arquivo que contem o endereço original da pagina: End_47,.html.txt
 Arquivo que contem o código reparado: ,47,.html
Notar que o 47 está entre virgulas, isso significa que se trata de um caractere ASCII na tabela
abaixo se descobre que se trata do caractere '/' - Tabela ASCII para auxilio ao usuário
Página 14

15. Observação: Para utilizar essa ferramenta, o usuário deve primeiro avaliar o site (ou página)
pela página principal do ASES, o Avaliar de Acessibilidade, e então ir em: Ferramentas > Conteúdo
Alternativo para TAGS > IMG, após ter o relatório da avaliação. Somente assim será possível utilizar
o recurso de análise sistemática de imagens.
Página 15

16. Ferramenta Associador de Conteúdo alternativo para Scripts
Associa conteúdo alternativo para tags script.
 URL: Endereço da página que se deseja avaliar.
 Digite o Conteúdo Alternativo: Campo para descrever o objeto sem descrição.
 Código em Edição: É exibido o código fonte editável, como um editor de HTML.
 Código Original: Exibe o código original, apenas para comparação, pois este não é editável.
 Salvar: Salva o arquivo alterado.
 Abrir: Abre, e avalia automaticamente, o arquivo HTML.
 Salvar Como: Salva o arquivo alterado com um nome diferente do original.
 Tela Anterior: Retorna à tela anterior a este avaliador.
 Reverter: Recarrega o código original, sem edição alguma.
 Lista de Erros: Lista todos os erros encontrados no código. E, ao clicar sobre o erro, o
usuário é direcionado à sua ocorrência no código editável.
Página 16

17. Ferramenta Associador de Conteúdo alternativo para Objects
Associa conteúdo alternativo para tags Objects.
 Url: Endereço da página que se deseja avaliar.
 Digite o Conteúdo Alternativo: Campo para descrever o objeto sem descrição.
 Código em Edição: Exibe o código que pode ser corrigido
 Código Original: Exibe o código que foi avaliado, este não é alterado.
 Aplicar: Aplica a descrição ao objeto selecionado na lista de erros.
 Lista de Erros: Mostra as linhas e as mensagens de erro ou aviso encontradas na avaliação
do CSS.
 Salvar: Abre a opção de salvar o arquivo.
 Abrir: Abre uma caixa de diálogo para abrir um arquivo CSS.
 Salvar como: Abre uma caixa de diálogo para salvar o arquivo com outro nome mantendo o
original.
 Reverter: Recarrega o código original, sem edição alguma.
Página 17

18. Ferramenta Associador de Rótulos
Ferramenta que associa rótulos a controles
 URL: Endereço da página que se deseja avaliar.
 Código em Edição: É exibido o código fonte editável, como um editor de HTML.
 Código Original: Exibe o código original, apenas para comparação, pois este não é editável.
 Adicionar: Adiciona o texto selecionado para ser associado como rótulo do controle.
 Aplicar: Faz a associação do rótulo aplicado (presente na caixa de texto) ao código fonte.
 Textos ou tags que participarão do rótulo: Mostra as tags e textos que irão ser associados ao
rótulo.
 Lista de Erros: Lista todos os erros encontrados no código. E, ao clicar sobre o erro, o
usuário é direcionado à sua ocorrência no código editável.
 Salvar: Salva o arquivo alterado.
 Abrir: Abre, e avalia automaticamente, o arquivo HTML.
 Tela Anterior: Retorna à tela anterior a este avaliador.
 Reverter: Recarrega o código original, sem edição alguma.
Página 18

19. Ferramenta Associador de DocType
Insere DocTypes (cabeçalhos de documentos HTML) nas páginas desejadas.
 URL: Endereço da página que se deseja avaliar.
 Código em Edição: É exibido o código fonte editável, como um editor de HTML.
 Código Original: Exibe o código original, apenas para comparação, pois este não é editável.
 Lista de DocTypes: Lista os doctypes existentes. Ao clicar duas vezes sobre o doctype
escolhido, o código em edição é alterado.
 Salvar: Salva o arquivo alterado.
 Abrir: Abre, e avalia automaticamente, o arquivo HTML.
 Tela Anterior: Retorna à tela anterior a este avaliador.
 Reverter: Recarrega o código original, sem edição alguma.
Página 19

20. Ferramenta Preenchedor de Formulário
Ajuda a preencher os campos de formulários.
 Url: Endereço da página que se deseja avaliar.
 Código em Edição: Exibe o código que pode ser corrigido
 Código Original: Exibe o código que foi avaliado, este não é alterado.
 Texto: Texto o que será inserido no campo do formulário.
 Aplicar: Coloca o texto dentro do valor do formulário.
 Lista de Erros: Mostra as linhas e as mensagens de erro ou aviso encontradas na avaliação
da página.
 Salvar: Salva o arquivo alterado.
 Abrir: Abre, e avalia automaticamente, o arquivo HTML.
 Salvar Como: Salva o arquivo alterado com um nome diferente do original.
 Reverter: Recarrega o código original, sem edição alguma.
Página 20

21. Ferramenta Corretor de Eventos Dependentes de Dispositivo
Corrige eventos que dependem de dispositivos de entrada.
 Url: Endereço da página que se deseja avaliar.
 Código em Edição: Exibe o código que pode ser corrigido
 Código Original: Exibe o código que foi avaliado, este não é alterado.
 JavaScript: Código que será atribuido ao evento correspondente.
 Aplicar: Gera o evento correspondente e o coloca na tag.
 Lista de Erros: Mostra as linhas e as tags de erro encontradas na avaliação da página.
 Salvar: Salva o arquivo alterado.
 Abrir: Abre, e avalia automaticamente, o arquivo HTML.
 Salvar Como: Salva o arquivo alterado com um nome diferente do original.
 Reverter: Recarrega o código original, sem edição alguma.
Página 21

22. Ferramenta para Links Redundantes em Mapa de Imagens
Define links redundantes para mapas de imagens.
Url: Endereço da página que se deseja avaliar.
Código em Edição: Exibe o código que pode ser corrigido
Código Original: Exibe o código que foi avaliado, este não é alterado.
Texto: Texto o que será exibido do link redundante.
Aplicar: Gera o link ao lado da imagem mapeada.
Lista de Erros: Mostra as linhas e as mensagens de erro encontradas na avaliação da página.
Salvar: Salva o arquivo alterado.
Abrir: Abre, e avalia automaticamente, o arquivo HTML.
Salvar Como: Salva o arquivo alterado com um nome diferente do original.
Reverter: Recarrega o código original, sem edição alguma.
Página 22

23. Recomendamos a leitura da Resolução CC-09, de 25/02/2005, estabeleceu para os órgãos do
Governo do Estado de São Paulo, um conjunto normativo de instruções e recomendações para a
melhoria na criação de serviços eletrônicos, desenvolvimento e gestão de sítios estaduais na
internet.
Esses normativos são chamados de Manuais da CC-09 e estão disponíveis em
http://www.igovsp.net./manuais.
Aos desenvolvedores e programadores existem algumas ferramentas on-line que efetuam a
verificação dos códigos, analisando sob as diretrizes da WCAG 1.0 ou 2.0, indicamos algumas
ferramentas de validações automáticas:
 Markup W3C Validator: É o validador oficial do consórcio W3C para arquivos HTML. É
possível efetuar uma análise através do endereço do arquivo web, enviando o arquivo ou
simplismente colocando o código fonte no campo de busca. Ele analisa os arquivos HTMLs,
XHTMLs dentre outros em busca de códigos escritos errados ou inconsistentes.
 CSS W3C Validator: Analise e fornece correções para os arquivos CSS.
 DaSilva: O primeiro validador em português, foi desenvolvido pelo pessoal do
“Acessibilidade Brasil” e permite a análise do site utilizando as diretrizes WCAG 1.0 ou o e-
GOV (diretrizes de acessibilidade para sites do governo brasileiro), além de filtras os
resultados pelo nível de prioridade.
 Cynthia Says: É um validador norte americano que permite validar, além das diretrizes WCAG,
utilizando a Section 508 (recomendações do governo norte americano para os sites
governamentais).
 t.a.w.: Ferramenta bem completa e bastante simples de utilizar. Permite a análise utilizando as
diretrizes da WCAG 1.0, WCAG 2.0 e recomendações para aplicativos móveis. Disponível em
Inglês e espanhol. Gera relatórios, exibe comentários e faz checagem automática de uma
única página.
 Lynx Viewer : verificar e analisar como determinado site se comporta em navegadores
textuais, muito utilizados por deficientes visuais.
 Examinator: verifica a avaliação automática e atribuí uma nota ao site classificando de zero a
dez a acessibilidade da página avaliada, tendo como base as Diretrizes de Acessibilidade
para o conteúdo WEB 1.0 (WCAG 1.0). Efetua ligação para http://validator.w3.org para verificar
o código (X) HTML e para http://jigsaw.w3.org/css-validator para verificar as folhas de estilo
CSS. Mostra informações qualitativas sobre a avaliação apresentando um quadro com as
Página 23

24. verificações a serem feitas e apresenta sugestões e exemplos para fazer as devidas
correções. Contém link para ajuda, motor de busca, mapa do sítio e sugestões, que ficam
disponíveis para o usuário em todas as páginas do sítio. No link Ajuda o usuário encontra
informações para auxiliá-lo na navegação pelo site. O motor de busca e o mapa do sítio
ajudam a encontrar alguma informação contida no sítio. Em Sugestões o usuário encontra um
link com endereços de contato para envio de sugestões, reclamações ou comentários.
 W3C: É o validador da W3C. Verifica o código (X)HTML (http://validator.w3.org/) e também o
CSS (http://jigsaw.w3.org/css-validator/).
 Total Validator : É composto de um validador HTML, um validador de acessibilidade (WCAG e
Seção 508), um corretor ortográfico, um verificador de quebra de links e capacidade de
capturar telas com diferentes navegadores em diferentes plataformas. Checagem automática
de uma única página, grupos de páginas e páginas restritas.
 Validação Manual: Checklist para Teste Manual, com perguntas relacionadas à
acessibilidade, usabilidade e comunicabilidade de ambientes virtuais.
 Contrastes de Cores: Acessibilidade para Usuário com Baixa Visão ou Daltonismo, que
apresenta três guias básicas para escolher cores de maneira efetiva para a grande maioria
de usuários, inclusive aqueles com dificuldades para perceber ou distinguir as cores.
Bibliografia:
 Governo Eletrônico em http://www.governoeletronico.gov.br/;
 Acessibilidade Brasil em http://www.acessobrasil.org.br/;
 W3C em http://www.utad.pt/wai/wai-pageauth.html e http://www.ilearn.com.br/TR/WCAG20/;
 Acessibilidade Legal em http://acessibilidadelegal.com/;
 RENAPI em http://www.renapi.gov.br/acessibilidade
Dúvidas e Informações sobre esta ferramenta e outras
destinadas a Inovação é só acessar: http://inovaday.igovsp.net/
Página 24