Sei sulla pagina 1di 45

Captulo

7
Design e Avaliao de Tecnologia Web-acessvel

Amanda Meincke Melo e M. Ceclia C. Baranauskas, Unicamp

Abstract

In Brazil, the access to the information is a constitutional right. However, while some
people get to access information of public interest, for instance, through systems
interfaces, others still face countless barriers to do it. A first discipline of Human-
Computer Interaction, present in the curriculum of the Computer Science Courses, in
general doesn't cover that theme in the necessary depth. Therefore, this mini-course
seeks to present principles and recommendations for the design of Web-accessible
technologies and to discuss the principal methods of accessibility evaluation in user's
interfaces, necessary condition to the universality of the computation, thematic of this
edition of the Brazilian Computing Society Conference.

Resumo

No Brasil, o acesso informao um direito constitucional. Entretanto, enquanto


algumas pessoas conseguem acessar informaes de interesse pblico, por exemplo, via
interfaces de usurio de sistemas computacionais, outras ainda enfrentam inmeras
barreiras para faz-lo. Uma primeira disciplina de Interao Humano-Computador,
presente no currculo dos Cursos de Cincia da Computao, em geral no d conta de
explorar esse tema na profundidade necessria. Assim, este mini-curso visa apresentar
princpios e recomendaes para o design de tecnologias Web-acessveis e discutir os
principais mtodos de avaliao da acessibilidade em interfaces de usurio, condio
necessria universalidade da computao, temtica desta edio do Congresso da
Sociedade Brasileira de Computao.

XXIV JAI 1500


7.1. Introduo
Nesta seo, destacamos as motivaes para um design que respeite as diferenas entre
as pessoas na concepo de produtos e de ambientes, sem estigmatizar ou excluir
(Connell et al, 1997; Vanderheiden et al, 1992; Tiresias, 2005); discutimos o papel de
sistemas computacionais no apoio a uma diversidade de atividades do cotidiano e seu
papel como mdia; apresentamos diferentes cenrios de interao com sistemas
computacionais, especialmente na Web.
Atualmente h o desafio evidente de produo de sistemas computacionais para
serem utilizados, na maior extenso possvel, por todas as pessoas. Esse desafio surge,
por exemplo:
(1) Da necessidade de se oferecer qualidade de vida para todos, atendendo s
exigncias de setores da sociedade anteriormente excludos, em consonncia
com a ideologia de incluso social (ex. na escola, na universidade, no
ambiente de trabalho, no acesso informao), em construo no Brasil e
em outros pases do mundo (ex. Austrlia, Canad, Estados Unidos,
Portugal, etc);
(2) Da exigncia de pases para que os sistemas de informao da administrao
pblica sejam acessveis de forma indiscriminada (ex. Decreto n 5.296 de 2
de dezembro de 2004, no Brasil; Section 5081, nos EUA; Information
2
Society for All , na Unio Europia);
(3) Da potencial ampliao do nmero de consumidores, uma vez que h cerca
de 500 milhes de consumidores prospectivos de sistemas computacionais
no mundo com algum tipo de deficincia (FGV, 2003).
No Brasil, o acesso informao um direito constitucional: assegurado a
todos o acesso informao e resguardado o sigilo da fonte, quando necessrio ao
exerccio profissional (Brasil, 1998). Entretanto, enquanto algumas pessoas conseguem
acessar informaes de interesse pblico, por exemplo, via interfaces de usurio de
sistemas computacionais, outras ainda enfrentam inmeras barreiras para faz-lo. Diante
disso, o debate em torno dos temas acessibilidade e incluso digital tm reunido
representantes do governo, da sociedade civil, das instituies de ensino, entre outros.
Em geral, a acessibilidade tem sido reconhecida como uma condio
fundamental incluso digital, um dos mecanismos para viabilizar incluso social, e
vrias medidas tm sido adotadas para promover esse acesso. O captulo que trata do
acesso informao e comunicao, no Decreto n 5.296 de 2 de dezembro de 2004,
por exemplo, prev um prazo de 12 meses (a contar da data de sua publicao) para que
as informaes de portais e sites Web da administrao pblica fiquem plenamente
acessveis s pessoas com deficincia visual (Brasil, 2004). Esse grupo representa
67,66% da populao brasileira com algum tipo de deficincia que, segundo dados do
Censo 2000 (IBGE, 2005), totaliza cerca de 24.600.256 de pessoas (14,61% da
populao brasileira). Atualmente, tambm est em andamento a definio de normas

1
http://www.section508.gov/
2
http://www.e-europestandards.org/

XXIV JAI 1501


tcnicas visando a acessibilidade Web, sob responsabilidade do Comit Brasileiro de
Acessibilidade (CB40) da Associao Brasileira de Normas Tcnicas (ABNT).
A observncia de requisitos de acessibilidade tm impacto direto na qualidade da
interao entre pessoas diferentes e sistemas computacionais. A Web, por exemplo, tem
sido utilizada por milhes de pessoas para obterem acesso a diversos servios e
informaes atualmente veiculados nessa mdia e, atravs da comunicao mediada
por ferramentas de e-mail, fruns de discusso, salas virtuais de bate-papo, sistemas de
grupo, blogs, sistemas de Educao Distncia (EaD), comunidades virtuais, etc. ,
trocarem idias e/ou fazerem parte de uma comunidade.
Para tornar a interao humano-computador vivel a um pblico heterogneo em
vrios aspectos (ex. cultural, educacional, antropomtrico, etc), o design de interfaces
tem exigido cada vez mais ateno a solues que flexibilizem a interao e o acesso
informao como forma de atender as necessidades de seus diferentes usurios. Essas
necessidades dizem respeito, entre outras coisas, s tecnologias de acesso informao
e de interao utilizadas (ex. navegadores e tecnologias assistivas), s caractersticas
fsicas e cognitivas dos usurios (ex. mobilidade, acuidade visual e auditiva,
compreenso das informaes), s condies oferecidas pelo ambiente (ex. espao para
aproximao e uso, iluminao e rudo). No cenrio Web as diferenas entre usurios
so bastante acentuadas, devido potencial diversidade de situaes de uso de suas
aplicaes; tais diferenas precisam ser consideradas no desenvolvimento dos sistemas.
Alguns cenrios de interao so apresentados a seguir, alm de vrios outros
publicados no W3C (2004):
Usurio com tendinite crnica emite comandos ao computador via voz para
preencher um formulrio;
Usurio com mobilidade reduzida realiza compras de livros pela Internet;
Pessoa idosa, com catarata e audio reduzida, acessa Webmail, mantido por
seu provedor de acesso Internet, com auxlio de um leitor de telas; seu
sistema operacional o Windows;
Alunos de escola de ensino fundamental acessam sites com contedos
educacionais; seu acesso rede lento e o Sistema Operacional que utilizam
o Linux; um desses alunos cego;
Participantes de um programa de incluso digital acessam a Internet com
mquinas e navegadores antigos;
Estudante universitria, destra, est com seu brao direito engessado; prefere
usar o teclado, a ter que utilizar o mouse com a mo esquerda, para fazer
pesquisas na biblioteca digital de sua universidade;
Aluna cega realiza sua matrcula via Internet; para leitura das informaes,
utiliza seu leitor de telas preferido e o teclado como dispositivo de entrada;
alm disso, imprime seu comprovante de matrcula em braile;
Aluno surdo, cuja primeira lngua a Lngua Brasileira de Sinais (LIBRAS),
participa em um curso distncia via Web;
Estrangeiro procura informaes sobre programas de ps-graduao no site
da Unicamp;

XXIV JAI 1502


Usurio afsico, com dificuldades em oralizar suas idias, faz novos amigos
em sala de bate-papo;
Funcionria com baixa viso deseja conhecer as atividades oferecidas pela
Faculdade de Educao Fsica no site da instituio; para isso, alm de um
programa ampliador de telas, usa um programa leitor de telas;
Usurio com paralisia cerebral, para participar de um frum de discusses,
utiliza o teclado com auxlio de uma ponteira de cabea, alm de um
dispositivo apontador do tipo eyegaze system;
Estudantes universitrios acessam contedo disponibilizado na Web via
interface de televiso digital interativa;
Usurio deseja obter as ltimas notcias de seu jornal preferido via celular.
Estas so situaes de acesso e de uso da Web que oferecem desafios para o
design de pginas Web, para o desenvolvimento de agentes de usurio3, para o design
de tecnologias assistivas e tambm para o design de ferramentas de autoria, visando o
acesso indiscriminado informao e a participao na publicao de contedos por
pessoas com as mais diferentes caractersticas. Qualquer pessoa usando qualquer
tecnologia para acessar a Web deveria estar apta a visitar qualquer site, obter a
informao que ele oferece, e interagir com o site (Hull, 2004:38).
Tornar a Web indiscriminadamente acessvel a todas as pessoas uma tarefa que
transcende a definio de padres e normas de acessibilidade; pressupe tambm: (1) a
sensibilizao e educao para o reconhecimento e respeito s diferenas; (2) a
mobilizao das prprias pessoas atualmente excludas; (3) o estabelecimento de leis e
de polticas pblicas. O tema acessibilidade reflete diretamente na qualidade da
interao entre diferentes pessoas e os sistemas computacionais. Uma primeira
disciplina de Interao Humano-Computador, presente no currculo dos Cursos de
Cincia da Computao, em geral no d conta de explorar esse tema na profundidade
necessria. Assim, este mini-curso visa promover o conhecimento sobre a acessibilidade
de tecnologias de informao e comunicao (TICs) numa perspectiva de Design
Universal (Connell et al, 1997) ou Design para Todos, condio necessria
universalidade da computao, temtica desta edio do Congresso da Sociedade
Brasileira de Computao. O contedo coberto por este curso baseia-se em resultados
do oferecimento de parte dele a alunos de graduao, de ps-graduao e webdesigners
da Unicamp. A dinmica a ser utilizada no curso visa favorecer o uso desse ferramental
em cenrios reais de desenvolvimento. Assim, pretendemos contribuir construo de
conhecimentos indispensveis atualmente queles que desenvolvem ou venham a
desenvolver sistemas de informao e comunicao, em especial no cenrio de
desenvolvimento de tecnologias para a Web.
Este texto objetiva apresentar princpios e recomendaes para o design de
tecnologias Web-acessveis e discutir os principais mtodos de avaliao da

3
Termo utilizado pelo W3C (World Wide Web Consortium) para designar software que acessam o
contedo da Web, incluindo navegadores grficos para desktop, navegadores em texto, navegadores em
voz, celulares, tocadores multimdia, plug-ins e algumas tecnologias assistivas (software) utilizadas
juntamente com navegadores como os leitores de telas, ampliadores de telas e software de
reconhecimento de voz.

XXIV JAI 1503


acessibilidade em interfaces de sistemas computacionais, contribuindo particularmente
sensibilizao e educao para o reconhecimento e respeito s diferenas. O captulo
est organizado da seguinte forma: A seo 7.2 apresenta o conceito de acessibilidade
relacionando-o aos conceitos de usabilidade, design universal. Destaca-se nessa seo,
em particular, a diferena conceitual entre os paradigmas do design para todos e do
design especializado. Codificao correta e uso adequado das marcaes HTML so
condies necessrias ao desenvolvimento de tecnologias Web-acessveis, bem como a
separao entre estrutura e apresentao. A seo 7.3 ilustra e apresenta informao
sobre o uso da linguagem XHTML (Extensible HyperText Markup Language)
juntamente com folhas de estilo CSS (Cascade Style Sheet) para publicao de contedo
na Web. A seo 7.4 apresenta algumas recomendaes visando acessibilidade,
especialmente as que foram propostas pelo W3C. Essas recomendaes tornam evidente
a necessidade de um design para Web que considere a diversidade de dispositivos
utilizados para acess-la e, ao mesmo tempo, atenda s necessidades especficas de seus
usurios prospectivos. A seo 7.5 apresenta mtodos de avaliao que possibilitam
identificar diferentes aspectos relativos acessibilidade na Web. Tambm so
apresentados roteiros para auxiliar na conduo de avaliaes de acessibilidade. A seo
7.6 apresenta as consideraes finais ao texto.

7.2. Acessibilidade
Nesta seo apresentamos o conceito de acessibilidade, relacionando-o aos conceitos de
usabilidade (ISO, 1998), de Design Universal (Connell et al, 1997) e de Design
Acessvel (Vanderheiden et al, 1992). Buscamos esclarecer a diferena entre o design
para todos e o design especializado (relativo a tecnologias assistivas ou de apoio).
Finalmente, apresentamos algumas iniciativas relacionadas acessibilidade da Internet,
que norteiam o restante do texto.
Em diferentes contextos, h entendimentos variados para a expresso
acessibilidade s vezes sutis , que podem levar a propostas diferenciadas de
design. Acessibilidade tem sido associada ao compromisso de melhorar a qualidade de
vida de pessoas idosas e de pessoas com deficincia (Brasil, 2004; W3C, 1999a).
Entretanto, ela tambm est relacionada com a qualidade de vida de todas as pessoas,
como coloca Romeu Kazumi Sassaki (MDIA e deficincia, 2003:24-25), ao dizer que
para uma sociedade ser acessvel preciso verificar seis quesitos bsicos:
Acessibilidade Arquitetnica no deve haver barreiras ambientais fsicas
nas casas, nos edifcios, nos espaos ou equipamentos urbanos e nos meios
de transportes individuais ou coletivos.
Acessibilidade Comunicacional no deve haver barreiras na comunicao
interpessoal, escrita e virtual.
Acessibilidade Metodolgica no deve haver barreiras nos mtodos e
tcnicas de estudo, de trabalho, de ao comunitria e de educao dos
filhos.
Acessibilidade Instrumental no deve haver barreiras nos instrumentos,
utenslios e ferramentas de estudo, de trabalho e de lazer ou recreao.
Acessibilidade Programtica no deve haver barreiras invisveis
embutidas em polticas pblicas e normas ou regulamentos.

XXIV JAI 1504


Acessibilidade Atitudinal no deve haver preconceitos, estigmas,
esteretipos e discriminaes.
Ainda, para Sassaki, a denominada acessibilidade tecnolgica no constitui um
outro tipo de acessibilidade, pois o aspecto tecnolgico deve permear os demais,
exceo da acessibilidade atitudinal.
Promover a acessibilidade, em seu sentido mais amplo, portanto, indispensvel
ao movimento contemporneo de incluso digital, considerado um dos mecanismos
para viabilizar a incluso social. A incluso digital deve transcender aspectos relativos
ao custo dos artefatos de computao, acesso fsico indiscriminado a esses recursos e
educao para o uso da tecnologia.
Atualmente, h uma diversidade de sistemas computacionais desenvolvidos com
a inteno de serem utilizados em contextos distintos, por pessoas com diferentes
caractersticas e interesses, utilizando artefatos de hardware e de software
diversificados. Entre esses sistemas, podem ser includos muitos daqueles que foram
desenvolvidos para serem acessados e utilizados via Web.
No uso de sistemas computacionais, a acessibilidade tem sido, cada vez mais,
percebida como uma caracterstica necessria qualidade no uso, ou seja, usabilidade
(Dias, 2003; Bevan, 1999; Graupp et al, 2003). A usabilidade diz respeito capacidade
de um produto ser usado por usurios especficos para atingir objetivos especficos com
eficcia, eficincia e satisfao em um contexto especfico de uso (ISO, 1998). J a
acessibilidade ao uso de sistemas computacionais por seres humanos pode ser entendida
como a flexibilidade proporcionada para o acesso informao e interao, de maneira
que usurios com diferentes necessidades possam acessar e usar esses sistemas.
Assim como a usabilidade, a acessibilidade um conceito relativo, que depende
do entendimento das necessidades dos usurios. Um sistema com boa usabilidade, em
linhas gerais, pode no ser acessvel a um determinado usurio, e vice-versa (Graupp et
al, 2003:1280). Enquanto, por exemplo, a acessibilidade diz respeito a alcanar a
informao desejada e conseguir interagir com um sistema, a usabilidade diz respeito,
entre outras coisas, a quo fcil e agradvel usar e navegar por esse sistema.
Se um usurio no consegue alcanar os objetivos estabelecidos na interao
com um sistema computacional, a usabilidade deste sistema, relativa a este usurio em
especfico, fica comprometida. A idia para um design que respeite e considere as
diferenas de forma indiscriminada que os objetivos estabelecidos na interao com
um sistema computacional sejam alcanados (acessibilidade) com eficcia, eficincia e
satisfao (usabilidade) por um amplo espectro de usurios.
Nesse sentido, embora seja indispensvel o desenvolvimento de tecnologia que
atenda s necessidades de pblicos com caractersticas especficas (ex. pessoas com
deficincia motora, pessoas com deficincia visual, pessoas com deficincia auditiva,
etc), torna-se cada vez mais importante que esse desenvolvimento esteja articulado a um
amplo entendimento do que promover a acessibilidade e a usabilidade. Esse
entendimento pode ser apoiado pelas idias do Design Universal (Connell et al, 1997),
abordado a seguir.

XXIV JAI 1505


7.2.1. Design Universal e Design Acessvel
Design Universal (Universal Design), definido pelo Centro para o Design Universal na
North Caroline State University 4 (EUA), o design de produtos e de ambientes para
serem usados por todas as pessoas, na maior extenso possvel, sem a necessidade de
adaptao ou design especializado (Connell et al, 1997). tambm conhecido, na
Europa, como Design para Todos (Design for All) (Tiresias, 2005). Seus princpios so
apresentados a seguir (Connell et al, 1997):
Uso eqitativo o produto do design deve ser til e pode ser adquirido por
pessoas com habilidades diversas.
Flexibilidade no uso o resultado do design deve acomodar uma grande
variedade de preferncias e habilidades individuais.
Simples e intuitivo o uso do design deve ser fcil de entender,
independentemente da experincia, do conhecimento anterior, das
habilidades lingsticas ou do nvel de concentrao corrente.
Informao perceptvel o produto do design deve apresentar a informao
necessria ao usurio efetivamente, independentemente das condies do
ambiente ou de suas habilidades sensoriais.
Tolerncia ao erro o produto do design deve minimizar o risco e
conseqncias adversas de aes acidentais ou no intencionais.
Baixo esforo fsico o produto do design deve ser usado efetivamente,
confortavelmente e com um mnimo de fadiga.
Tamanho e espao para aproximao e uso tamanho e espao
apropriados devem ser oferecidos para aproximao, alcance, manipulao e
uso independentemente do tamanho do corpo, postura ou mobilidade do
usurio.
Connell et al (1997) ressaltam que em uma situao prtica de design, alm
desses princpios, devem ser considerados fatores como o econmico, de engenharia, os
culturais, de gnero e o ambiental. Embora o Design Universal ou Design para
Todos possa ser visto com ceticismo por algumas pessoas, uma vez que existem
situaes nas quais impossvel chegar a solues de design que atendam a todos
indiscriminadamente, seus princpios podem servir como norteadores no processo de
design e na avaliao de artefatos que sejam mais inclusivos, ou seja, que considerem e
respeitem de forma mais ampla as diferenas entre as pessoas.
Vanderheiden et al (1992) apresentam uma abordagem ao Design Universal,
denominada Design Acessvel (Accessible Design). O Design Acessvel estende o
design de produtos voltados ao mercado de massa visando incluir pessoas, que devido
s caractersticas pessoais ou s condies do ambiente, consideram-se com alguma
limitao de possibilidade de uso. Vanderheiden et al (1992) destacam quatro maneiras
para tornar um produto mais acessvel:

4
http://www.design.ncsu.edu/cud/

XXIV JAI 1506


Acessibilidade Direta adaptaes simples e de baixo custo (ou sem custo
algum) ao design do produto, que podem aumentar sua acessibilidade de
forma direta.
Acessibilidade por meio de opes padronizadas ou acessrios (do
fabricante) quando h alternativas para tornar o design do produto mais
acessvel, mas oferecer todas elas pode no ser prtico devido existncia
de alternativas mutuamente excludentes, muito caras ou estranhas como
produto padro.
Compatibilidade com dispositivos assistivos (ou de apoio) de terceiros
para situaes nas quais impraticvel que o fabricante oferea alternativas
a todos os tipos e/ou graus de deficincias.
Facilidade para modificaes sob encomenda quando nenhuma das
outras abordagens for possvel ou economicamente vivel.
Vanderheiden et al (1992) sugerem que, qualquer que seja o produto, pode ser
necessria uma combinao dessas quatro abordagens para que se alcance o nvel
desejado de acessibilidade, sendo que a Acessibilidade Direta considerada a mais
desejvel das quatro. Entretanto, antes de discutirmos a problemtica da acessibilidade
da Internet de maneira mais pontual e caminhos para consider-la de forma ampla,
apresentamos algumas tecnologias assistivas, desenvolvidas para promover o uso do
computador por perfis de usurios especficos, que devem ser consideradas no design da
interface e da interao de sistemas Web.

7.2.2. Tecnologias Assistivas

Segundo documentos do W3C (1999a), tecnologia assistiva tecnologia de apoio ou


ajuda tcnica um hardware ou software projetado para apoiar pessoas com
deficincia, em atividades do cotidiano.

Para Elisabete S (MDIA e deficincia, 2003:25), tecnologia assistiva refere-se


a todo e qualquer item, equipamento, produto ou sistema que contribua com o
desenvolvimento das potencialidades de indivduos com limitaes fsicas, sensoriais,
cognitivas, motoras, dentre outras restries ou disfunes que caracterizam uma
deficincia ou incapacidade de qualquer natureza. Tratam-se, pois, de meios e
alternativas que possibilitem a resoluo de dificuldades destes indivduos quanto ao
desempenho das atividades de vida diria, locomoo, aprendizagem,
comunicao, insero na vida familiar, comunitria e no mundo do trabalho. Consiste
em uma variedade de recursos, equipamentos, ferramentas, acessrios, dispositivos,
utenslios, artefatos, tcnicas, servios, estratgias ou adaptaes que possibilitem
segurana, autonomia e independncia para crianas, jovens ou adultos que deles
necessitem.

Alguns exemplos de tecnologias assistivas, desenvolvidos para o contexto da


interao humano-computador, so apresentados a seguir:

Dispositivos apontadores alternativos. Alternativas ao mouse, que viabilizam o


acionamento de elementos de uma interface grfica e/ou seleo de seu contedo.

XXIV JAI 1507


Exemplos deste tipo de dispositivos so os acionadores, para serem utilizados com os
olhos (eyegaze systems), com os ps e/ou com as mos.

A Figura 7.1, a seguir, ilustra um dispositivo denominado Switch Mouse, que


substitui a ao do mouse convencional por meio de 7 acionadores de toque simples,
permitindo os movimentos direcionais do cursor, clique nico, duplo-clique e
acionamento da tecla direita do mouse. Tambm apresenta chave tipo liga/desliga para a
funo arrastar.

Figura 7.1. Switch Mouse (Fonte: http://www.clik.com.br/)

Teclados alternativos. So dispositivos de hardware ou de software que oferecem uma


alternativa para o acionamento de teclas, simulando o funcionamento do teclado
convencional. Exemplos deste tipo de dispositivos so os teclados com espaamento
menor ou maior entre as teclas; os protetores de teclas, que possibilitam o acionamento
de uma nica tecla por vez; os simuladores de teclado na tela do computador como o
Teclado Virtual do Sistema Operacional Microsoft Windows (Figura 7.2) e TFlex
(Juliato et al, 2004).

Figura 7.2. Teclado Virtual do Sistema Operacional Microsoft Windows

Ponteiras de cabea. Ferramentas que podem ser acopladas cabea para auxiliar, por
exemplo, o uso do teclado por pessoas que tenham dificuldades em us-lo da forma
convencional. Um exemplo ilustrado na Figura 7.3, a seguir.

XXIV JAI 1508


Figura 7.3. Ponteira de Cabea (Fonte: http://www.acessibilidade.net/)

Sistemas para entrada de voz (speech recognition). Viabilizam a interao com o


computador via voz e, assim, podem ser utilizados por pessoas que estejam com a
mobilidade dos membros superiores comprometida. Em geral, aplicaes que podem ser
utilizadas amplamente via teclado tambm podem ser acionadas via sntese de voz.
Exemplos de sistemas para entrada de voz so o IBM Via Voice5 e o Motrix
(NCE/UFRJ, 2005). A Figura 7.4, a seguir, ilustra um cenrio de uso deste tipo de
tecnologia, no qual necessria, alm do software de reconhecimento de voz, a
configurao adequada do sistema multimdia que d suporte interao humano-
computador.

Figura 7.4. Acesso ao Computador Via Voz (Fonte: http://www.electrosertec.pt/)

Ampliadores de tela. So aplicativos que ampliam parte da interface grfica apresentada


na tela do computador e, assim, podem facilitar seu uso por pessoas com baixa viso,
capazes de enxergar elementos de interface e contedo apresentados no tamanho exibido
por esses aplicativos. Na medida em que ampliam parte da interface, tambm reduzem a
rea que pode ser visualizada, removendo informaes de contexto. So exemplos deste
tipo de tecnologia assistiva a Lente de Aumento do Sistema Operacional Microsoft
Windows e a Lente pro (NCE/UFRJ, 2005). A Figura 7.5, a seguir, ilustra o uso da

5
http://www-306.ibm.com/

XXIV JAI 1509


Lente de Aumento do Windows (parte superior da imagem) no acesso ao portal da
Unicamp.

rea considerada
para ampliao

Figura 7.5. Lente de Aumento do Sistema Operacional Microsoft Windows

Leitores de tela com sntese de voz. So aplicativos que viabilizam a leitura de


informaes textuais via sintetizador de voz e, assim, podem ser utilizados por pessoas
com deficincia visual (ex. pessoas com baixa viso, pessoas cegas), por pessoas que
estejam com a viso direcionada a outra atividade, ou at mesmo por aquelas que
6
tenham dificuldade para ler. So exemplos de leitores de telas: Jaws for Windows ,
7
Virtual Vision , Monitivox (NCE/UFRJ, 2005). A Figura 7.6, a seguir, ilustra o painel
de controle do leitor de telas Jaws for Windows.

Figura 7.6. Painel de Controle do Leitor de Telas Jaws for Windows

Linhas braile. Dispositivos de hardware, compostos por fileira(s) de clulas braile


eletrnicas, que reproduzem informaes codificadas em texto para o sistema braile e,
assim, podem ser utilizadas por usurios que saibam interpretar informaes codificadas

6
http://www.freedomscientific.com/
7
http://www.micropower.com.br/

XXIV JAI 1510


nesse sistema (ex. pessoas cegas, pessoas com baixa viso). A Figura 7.7, a seguir,
apresenta uma linha braile de 40 caracteres, denominada Pocketvario.

Figura 7.7. Pocketvario (Fonte: http://www.lerparaver.com/)

Impressoras braile. Imprimem, em papel, informaes codificadas em texto para o


sistema braile (ex. textos, partituras, equaes matemticas, grficos, etc). Existem
impressoras braile, que utilizam um sistema denominado interpontos, viabilizando a
impresso nos dois lados do papel. A Figura 7.8, a seguir, ilustra duas impressoras
braile: uma de tamanho compacto ( esquerda) e outra de tamanho maior ( direita).

Figura 7.8. Impressoras Braile (Fonte: http://www.lerparaver.com/)

Outro exemplo de tecnologia assistiva o sistema operacional DOSVOX,


desenvolvido pelo grupo de pesquisa do Ncleo de Computao Eletrnica (NCE) da
UFRJ (NCE/UFRJ, 2005). Esse sistema, desenvolvido para microcomputadores da linha
PC, com mais de 80 programas editores de texto, telnet, ftp, navegadores, jogos, etc,
gratuito e tem sido amplamente utilizado no Brasil por pessoas com deficincia visual.
Comunica-se com o usurio por meio de sntese de voz, enquanto que a comunicao do
usurio com o computador realizada via teclado. A Figura 7.9, a seguir, ilustra o uso
deste sistema por uma funcionria do Laboratrio de Acessibilidade da Biblioteca
Central da Unicamp (LAB/BC), especialista em adaptao de material didtico para
pessoas com deficincia visual.

XXIV JAI 1511


Figura 7.9. Sistema DOSVOX em Uso

7.2.3. Acessibilidade da Internet


Segundo Certic (2005), a acessibilidade da Internet caracterizada pela flexibilidade da
informao e da interao relativa ao respectivo suporte de apresentao. Essa
flexibilidade deve permitir a utilizao da Internet por pessoas com necessidades
especiais, bem como em diferentes ambientes e situaes, por meio de vrios
equipamentos ou navegadores.
A ampliao do acesso a Web e a autonomia que o uso do computador pode
proporcionar s pessoas com deficincia na realizao de suas tarefas fomentaram vrias
iniciativas com vistas acessibilidade da Internet. A definio de padres para o design
de pginas Web representa esforos para torn-la acessvel aos cidados com
deficincia, ao mesmo tempo em que beneficia outros grupos de usurios, em contextos
de acesso diversificados.
A Web foi inventada tendo-se em mente o acesso universal, conforme indica o
World Wide Web Consortium (W3C): The power of the Web is in its universality.
Access by everyone regardless of disability is an essential aspect. (W3C, 2005b).
Segundo o W3C (1999a), a falta de acessibilidade em sites Web principalmente
caracterizada pela ausncia de estrutura dos sites, que desorienta os usurios,
dificultando sua navegao e pelo uso abusivo de informaes grficas sem alternativas
adequadas de texto ou outro tipo de comentrio. Estas so questes que, entre outras
coisas, referem-se tambm inadequao da linguagem utilizada em pginas Web, a
escolhas de design que privilegiam algum tipo de experincia esttica (sensorial) e/ou
pressupem um funcionamento perfeito do sistema fsico humano.
O W3C, por meio da Iniciativa de Acessibilidade da Web (WAI, Web
Accessibility Initiative), atua em cinco reas principais: tecnologias, recomendaes,
ferramentas, educao e extenso, pesquisa e desenvolvimento. Oferece uma ampla
biblioteca online com recomendaes, tcnicas, tutoriais e ferramental para construo e
avaliao da acessibilidade da Web (W3C, 2005b). Seu documento Web Content
Accessibility Guidelines 1.0 (WCAG 1.0) (W3C, 1999a) tem servido como referncia
internacional para promoo da acessibilidade na Web e no estabelecimento de polticas
pblicas de acessibilidade (Dias, 2003) e novas recomendaes esto em elaborao
com uma linguagem mais acessvel a pessoas que no sejam necessariamente
proficientes em tecnologia Web.
Acessibilidade da Internet transcende tornar o contedo da Web acessvel. Diz
respeito tambm a viabilizar a publicao de contedos e a interao com diferentes

XXIV JAI 1512


sistemas de informao e comunicao (ex. bancos online, sistemas e-gov, portais
educacionais, ambientes de EaD, comunidades virtuais, etc) de maneira indiscriminada.
Contribuies em direo acessibilidade da Internet incluem, alm da publicao de
contedo acessvel, o desenvolvimento de agentes de usurios acessveis (ex.
navegadores Web), o desenvolvimento de tecnologias assistivas e o design de
ferramentas de autoria acessveis, que produzam contedo acessvel. Qualquer que seja
a contribuio nessa direo deveria levar em conta a existncia de recomendaes
amplamente discutidas e reconhecidas internacionalmente, como as do W3C (2005b).
Portanto, promover a acessibilidade da Internet envolve a colaborao entre
webdesigners, provedores de contedo, desenvolvedores de agentes de usurios e de
tecnologias assistivas, entre outros. A seguir so listadas outras iniciativas tambm
relacionadas acessibilidade da Internet.
Acessibilidade Brasil
http://www.acessobrasil.org.br/
Certic Centro de Engenharia de Reabilitao em Tecnologias de
Informao e Comunicao (Portugal)
http://www.acessibilidade.net/
Projetos de acessibilidade do NCE/UFRJ
http://intervox.nce.ufrj.br/
RNIB Royal National Institute of the Blind (Gr-Bretanha)
http://www.rnib.org.uk/
Serpro Acessibilidade na Web
http://www.serpro.gov.br/acessibilidade/

7.3. O que todo estudante da Cincia da Computao precisa saber para


criar tecnologia Web-acessvel
Atualmente, diferentes formatos de arquivos podem ser disponibilizados na Web.
Entretanto, o uso da linguagem HTML (HyperText Markup Language) juntamente com
folhas de estilo CSS (Cascade Style Sheet) para publicao de contedo na Web de
forma clara, conforme recomendaes do W3C, pode ampliar o acesso informao via
rede mundial de computadores.
Codificao correta e uso adequado das marcaes HTML so condies
necessrias ao desenvolvimento de tecnologias Web-acessveis, bem como a separao
entre estrutura e apresentao. A inteno desta seo, portanto, apresentar a
linguagem (X)HTML e as folhas de estilo CSS, tendo em vista esses requisitos. Isso
contribuir, inclusive, no entendimento de algumas recomendaes de acessibilidade
desenvolvidas e publicadas pelo WAI (W3C, 2005b).

7.3.1. (X)HTML: a linguagem para publicao de contedo na Web


HTML uma linguagem de marcao, baseada no formato SGML (Standard
Generalized Markup Language), criada para publicao de hipertexto na Web. Pode ser
criada e processada por uma variedade de ferramentas, desde editores de texto simples,

XXIV JAI 1513


como o bloco de notas do Windows e vi para Linux, at sofisticados editores do tipo
WYSIWYG (What You See Is What You Get), como o Macromedia Dreamweaver8.
Os marcadores da linguagem HTML, ou tags, apoiam a estruturao de
documentos em cabealhos, pargrafos, listas, tabelas, hiperlinks, etc. Sua verso 4.01
possibilita combinar informaes de apresentao aos marcadores estruturais.
Entretanto, recomenda-se fortemente que estrutura e apresentao de documentos Web
estejam separados, visando facilitar sua manuteno e ampliar sua independncia de
dispositivos.
Assim, a verso 4.01 da linguagem HTML foi reformulada para XHTML 1.0
(Extensible HyperText Markup Language), uma aplicao da linguagem XML
(Extensible Markup Language). A linguagem XHTML tem muitos dos mesmos
elementos da linguagem HTML, com a sintaxe (estrutura) modificada para se adequar s
regras XML. Esta linguagem apresenta uma srie de vantagens sobre sua predecessora:
mais enxuta e clara; mais fcil de manter e de processar; o rigor de sua estrutura
reduz a ambigidade em sua interpretao pelos agentes de usurios; pode ser
interpretada por um maior nmero de plataformas de navegao (ex. celulares,
televisores, carros, quiosques, etc).
Particularmente, a linguagem XHTML 1.0 deve ser utilizada de acordo com uma
das definies a seguir:
XHTML 1.0 Strict apresenta apenas marcadores estruturais, sendo livre de
qualquer marcao de estilo; recomenda-se o uso de folhas de estilo CSS
para acrescentar informaes relativas fonte, cor, efeitos de apresentao
em geral.
XHTML 1.0 Transitional viabiliza uma boa formatao para navegadores
antigos, que no aceitam folhas de estilo.
XHTML 1.0 Frameset permite o uso de Frames para repartir a janela do
navegador em dois ou mais frames.
Em um documento XHTML 1.0, antes de qualquer marcador estrutural, devem
ser declaradas informaes sobre a definio da linguagem em uso (ex. XHTML 1.0
Strict, XHTML 1.0 Transitional ou XHTML 1.0 Frameset). As Figuras 7.10, 7.11 e
7.12, a seguir, ilustram como essas informaes devem ser codificadas.
<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

Figura 7.10. Declarao para documentos XHTML 1.0 Strict


<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

Figura 7.11. Declarao para documentos XHTML 1.0 Transitional

8
http://www.macromedia.com/

XXIV JAI 1514


<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">

Figura 7.12. Declarao para documentos XHTML 1.0 Frameset

Na criao de um documento XHTML, todos os marcadores e atributos devem


ser escritos em letra minscula, sendo regra existir para cada elemento estrutural da
linguagem um marcador de incio e um marcador de fim, a exceo daqueles que foram
adaptados para manter a compatibilidade na interpretao da linguagem XHTML por
agentes de usurios mais antigos. Ainda, o contedo de um atributo deve ser sempre
delimitado por aspas duplas. A Tabela 7.1, a seguir, apresenta marcadores da linguagem
XHTML 1.0, com alguns de seus atributos e significados.
Tabela 7.1. Alguns marcadores da linguagem XHTML 1.0
Marcadores Significados
<html Marcador raiz de um documento XHTML;
xmlns="http://www.w3.org/1999/xhtm utilizado para delimitar o contedo de uma pgina.
l" xml:lang="pt-br" lang="pt-br">
</html>
<head> Delimita o cabealho de um documento.
</head>
<title></title> Marcador de cabealho, que especifica o ttulo; til
para oferecer informao de contexto.
Marcadores de cabealho, que viabilizam prover
<meta http-equiv="" content="" /> informaes sobre o documento (meta-dados) como
<meta name="" content="" /> seu autor, descrio, palavras-chave; bastante til
para mecanismos de busca.
<body> Delimita o corpo de um documento.
</body>
<div> Viabiliza dividir o corpo de um documento em
</div> blocos.
Viabiliza delimitar um trecho de texto contnuo no
corpo de um documento; pode ser utilizado, por
<span></span> exemplo, com o atributo lang para oferecer
informaes sobre o idioma de um determinado
contedo.
<h1></h1> Delimita um cabealho de nvel 1 (ex. ttulo de uma
seo).
<h2></h2> Delimita um cabealho de nvel 2 (ex. ttulo de uma
subseo).
<h3></h3> Delimita um cabealho de nvel 3 (ex. ttulo de uma
subsubseo).
<p> Delimita um pargrafo.
</p>
Especifica uma quebra de linha; usado neste
<br /> formato para manter a compatibilidade com os
navegadores mais antigos.
Delimita uma abreviatura, visando descrev-la por
<abbr title=""></abbr> extenso. Ex.: <abbr title=Universidade Estadual de
Campinas>Unicamp</abbr>
Delimita uma sigla, visando descrev-la por
<acronym title=""></acronym> extenso. Ex.: <acronym title=Instituto de
Computao>IC</acronym>

XXIV JAI 1515


Viabiliza a insero de imagem no corpo de um
documento; o atributo alt sempre deve ser
<img src="" alt=" " longdesc="" />
utilizado, ainda que em branco, para descrever a
imagem textualmente.
Viabiliza a criao de um link. Ex.: <a
href=http://www.ic.unicamp.br/ title=Pgina do
<a href="" title=""></a>
Insituto de Computao da Unicamp>Instituto de
Computao</a>
<ul> Delimita uma lista no ordenada.
</ul>
<ol> Delimita uma lista ordenada.
</ol>
Delimita um item de uma lista ordenada ou no
<li></li>
ordenada.
<dl> Delimita uma lista de definio de termos.
</dl>
<dt></dt> Delimita um termo a ser definido.
<dd></dd> Delimita a definio de um termo.
Delimita uma tabela de dados; seu atributo
<table summary="">
summary deve ser utilizado para oferecer uma
</table>
descrio da tabela.
<caption></caption> Delimita o ttulo de uma tabela.
<tr></tr> Delimita uma linha de tabela.
<th></th> Delimita uma clula de cabealho.
<td></td> Delimita uma clula de dado.
<form action="" method=""> Delimita um formulrio para entrada de dados.
</form>
<fieldset> Delimita um grupo de campos de um formulrio.
</fieldset>
Delimita a legenda para um grupo de campos de
<legend></legend> um formulrio; deve ser utilizado com o marcador
<fieldset></fieldset>.
Especifica o rtulo para um campo de formulrio
<label for=""></label> cujo identificador (atributo id) foi especificado.
Ex.: <label for=nome>Seu nome:</label>
<input id="" type="" value="" Possibilita definir diferentes campos de formulrio
name=""> (ex. text, radio, checkbox, submit).
<textarea id="" name=""> Possibilita definir campos de formulrio para
</textarea> entrada de texto extenso.
<select id="" name=""> Possibilita definir um campo de formulrio para
</select> seleo.
<optgroup label=""> Delimita um grupo de opes para seleo.
</optgroup>
<option value=""></option> Delimita uma opo de seleo.

Existem outros marcadores e atributos na linguagem XHTML 1.0, alm dos


apresentados na Tabela 7.1. Alguns deles so mencionados em outras partes do texto
para ilustrar, por exemplo, o uso de folhas de estilo e a aplicao de recomendaes de
acessibilidade do contedo da Web. Um exemplo de pgina Web codificada de acordo
com a definio XHTML 1.0 Strict ilustrado, a seguir, nas Figuras 7.13 e 7.14 que
apresentam, respectivamente, a codificao da pgina e sua apresentao pelo navegador
Mozilla Firefox 0.9.2.

XXIV JAI 1516


<?xml version="1.0" encoding="iso-8859-1"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
lang="pt-br" xml:lang="pt-br">
<head>
<meta http-equiv="Content-Type"
content="text/html; charset=ISO-8859-1" />
<title>Design e Avaliao de Tecnologia Web-Acessvel</title>
<meta name="name"
content="Design e Avaliao de Tecnologia Web-Acessvel" />
<meta name="author"
content="Amanda Meincke Melo" />
<meta name="keywords"
content="Acessibilidade, Design Universal, Web, XHTML" />
<meta name="description"
content="Exemplificao de uso adequado da linguagem XHTML" />
</head>

<body>
<h1>Design e Avaliao de Tecnologia <span lang="en">Web</span>-
Acessvel</h1>
<h2>Sumrio</h2>
<ul>
<li>
<a href="resumo.html" title="Resumo">Resumo</a>
</li>
<li>
<a href="cap1.html" title="Introduo">Introduo</a>
</li>
<li>
<a href="cap2.html" title="Acessibilidade">Acessibilidade</a>
</li>
<li>
<a href="cap3.html" title="O que todo estudante da Cincia da
Computao precisa saber para criar tecnologia Web-acessvel">O que
todo estudante da Cincia da Computao precisa saber para criar
tecnologia <span lang="en">Web</span>-acessvel</a>
</li>
<li>
<a href="cap4.html" title="Diretrizes e recomendaes para
promover a acessibilidade">Diretrizes e recomendaes para promover a
acessibilidade</a>

XXIV JAI 1517


</li>
<li>
<a href="cap5.html" title="Avaliao de acessibilidade no
desenvolvimento de tecnologia Web">Avaliao de acessibilidade no
desenvolvimento de tecnologia <span lang="en">Web</span></a>
</li>
<li>
<a href="cap6.html" title="Bons e maus exemplos de design para
uma Web acessvel">Bons e maus exemplos de design para uma Web
acessvel</a>
</li>
<li>
<a href="cap7.html" title="Concluso">Concluso</a>
</li>
<li>
<a href="agradecimentos.html"
title="Agradecimentos">Agradecimentos</a>
</li>
<li>
<a href="referencias.html" title="Referncias">Referncias</a>
</li>
</ul>
</body>
</html>
Figura 7.13. Codificao de documento XHTML 1.0 de acordo com a definio
XHTML 1.0 Strict

Figura 7.14. Apresentao do documento da Figura 7.13 pelo navegador grfico


Mozilla Firefox 0.9.2

XXIV JAI 1518


Como a linguagem XHTML 1.0 uma aplicao da linguagem XML, a primeira
informao a ser oferecida o tipo de codificao de caracter usado no documento,
especialmente se for diferente dos padres UTF-8 e UTF-16. No exemplo apresentado,
o padro escolhido para codificao do documento o ISO-8859-1 (Latin alphabet n
1). Esta informao tambm deve ser oferecida pelo uso do marcador meta, uma vez
que o documento em questo reconhecido e apresentado pelos navegadores atuais
como uma pgina HTML. Embora atualmente muitos navegadores interpretem
documentos (X)HTML sem informaes sobre a definio da linguagem de marcao e
a codificao de caractere em uso, e at mesmo reparem a apresentao daqueles com
erro na codificao de seus marcadores, essa caracterstica no pode ser assumida como
regra. Informaes sobre a gramtica de um documento (X)HTML e codificao de
caractere utilizada so bastante teis validao e interpretao correta de pginas
Web por diferentes agentes de usurios.
Sobre as linguagens HTML e XHTML, cabe destacar ainda que seus marcadores
tm semntica (significado) bem definida, que deve ser respeitada na composio de
uma pgina Web, visando garantir tambm interpretao adequada por diferentes
agentes de usurio. Mais informaes sobre essas linguagens de marcao, inclusive
sobre questes de compatibilidade e novas propostas, podem ser obtidas diretamente no
site do W3C (2005a):
HyperText Markup Language (HTML) Homepage
http://www.w3.org/MarkUp/
HTML and XHTML Frequently Answered Questions
http://www.w3.org/MarkUp/2004/xhtml-faq/

7.3.2. CSS: uso de folhas de estilo para a apresentao de contedo Web


Para muitas pessoas a aparncia de um documento sua cor, caractersticas das fontes
utilizadas, as margens to importante quanto o contedo propriamente dito.
Entretanto, a linguagem (X)HTML no foi criada para controlar esses aspectos, mas
para auxiliar na definio adequada da estrutura de um hipertexto. J as folhas de estilo
em cascata (CSS) foram concebidas especialmente para tratar dos aspectos estticos de
um hipertexto, viabilizando controlar suas caractersticas visuais (ex. propriedades das
fontes utilizadas, margens, espaamentos entre linhas, bordas, layers, entre outros) e
auditivas (aural).
A maneira mais simples de atribuir informaes de apresentao a uma pgina
Web pelo vinculo de informaes de estilo a um marcador (X)HTML, conforme
ilustrado pela Figura 7.15.

body {
border: 12px solid Green;
border-bottom: none;
border-right: none;
background-color: White;
color: Maroon;
font-family: Verdana, sans-serif;

XXIV JAI 1519


text-align: left;
padding: 2%;
}
h1 {
font-size: 150%;
font-family: "Times", serif;
}
h2 {
font-size: 120%;
font-family: "Times", serif;
}
a:link:hover, a:visited:hover {
background-color: Yellow;
}
li {
list-style: square;
}
Figura 7.15. Exemplo de folha de estilo (curso.css)

Uma forma de adicionar estilo pgina Web apresentada nas Figuras 7.13 e
7.14, pelo uso do marcador link em seu cabealho para indicar um arquivo de folha
de estilo a ser vinculado ao documento. As Figuras 7.16 e 7.17, a seguir, ilustram,
respectivamente, o uso do marcador link e a apresentao da pgina Web com as
informaes de estilo apresentadas na Figura 7.15.

<head>
<!Comentrio: local reservado aos tags "meta" -->
<link rel="stylesheet" href="curso.css" type="text/css" />
</head>
Figura 7.16. Adaptao do cabealho do documento apresentado na Figura 7.13
que vincula a folha de estilo apresentada na Figura 7.15

XXIV JAI 1520


Figura 7.17. Apresentao da pgina Web com as informaes de estilo da
Figura 7.15 pelo navegador grfico Mozilla Firefox 0.9.2

A linguagem CSS2, considerada normativa pelo W3C, oferece suporte para a


definio de folhas de estilo para diferentes tipos de mdia: navegadores visuais,
dispositivos de udio, impressoras, dispositivos braile, dispositivos de mo, etc.
Tambm prov suporte para posicionamento de contedo, fontes que precisam ser
baixadas, apresentao de tabelas, internacionalizao, contadores automticos,
numerao, entre outras propriedades relacionadas a interface de usurio. Outras
informaes sobre a linguagem de folhas de estilo CSS podem ser obtidas diretamente
no site do W3C (2005a):
Cascading Style Sheets
http://www.w3.org/Style/CSS/

7.4. Diretrizes e recomendaes para promover a acessibilidade


Nesta seo apresentamos algumas recomendaes visando acessibilidade,
especialmente as que foram propostas pelo W3C (1999a). Essas recomendaes tornam
evidente a necessidade de um design para Web que considere a diversidade de
dispositivos utilizados para acess-la e, ao mesmo tempo, atenda s necessidades
especficas de seus usurios prospectivos.
Theofanos e Redish (2003), especialistas em usabilidade, criaram um conjunto
de recomendaes a partir da observao de usurios cegos, que utilizam software
leitores de tela Jaws, Window-Eyes. O interesse desses autores era entender como
usurios cegos trabalham com sites Web e o que isso poderia significar para designers e
desenvolvedores; ou seja, o foco desse trabalho estava nos usurios e no em sites Web
especficos. Observam que para ir verdadeiramente ao encontro das necessidades de
todos os usurios, no suficiente ter recomendaes baseadas em tecnologia, mas
necessrio entender os usurios e como eles trabalham com suas ferramentas (Theofanos
e Redish, 2003:51).

XXIV JAI 1521


J Hull (2004) recomenda o design para a tecnologia. Segundo ele, o design de
sites Web deve ser primeiramente acessvel s tecnologias e, ento, s pessoas. Seu
argumento tambm est baseado na premissa de que a acessibilidade diz respeito a todos
e no apenas a um grupo de usurios, ou seja, que qualquer pessoa usando qualquer
tecnologia para acessar a Web9 deveria estar apta a visitar qualquer site, obter a
informao que ele oferece, e interagir com ele. Assim o designer deveria se preocupar
inicialmente, por exemplo, em separar o contedo da apresentao segundo
recomendaes do W3C, reduzindo o esforo de desenvolvimento e provendo solues
de design flexveis que viabilizam o acesso por pessoas utilizando inclusive tecnologias
assistivas. Finalmente, as recomendaes do W3C para atender s necessidades de
usurios com deficincia deveriam ser seguidas.
O trabalho de Graupp et al (2003) esclarece alguns pontos que precisam ser
especialmente considerados em testes de usabilidade que envolvem a participao de
pessoas com deficincia visual. Observaes importantes dizem respeito ao benefcio de
uma avaliao da acessibilidade da interface antes mesmo de avali-la com usurios.
Essa avaliao poderia ser realizada pelo prprio desenvolvedor, a partir de
recomendaes, listas com pontos de verificao (checklists) e tecnologias assistivas, a
exemplo dos leitores e ampliadores de tela. Com essa abordagem e, considerando
adequadamente nos testes de usabilidade a experincia dos usurios com as tecnologias
assistivas, o objetivo manter o foco na avaliao de usabilidade do sistema
propriamente dito. Recomendaes relativas avaliao da acessibilidade de sistemas
Web so apresentadas na seo 7.5 deste texto, incluindo sugestes para testes com
usurios.
A seguir, apresentamos em linhas gerais as recomendaes para a acessibilidade
do contedo da Web que ainda so consideradas normativas pelo W3C.

7.4.1. Recomendaes para a acessibilidade do contedo da Web


As recomendaes W3C (1999a) para a acessibilidade do contedo da Web visam
tornar seu contedo acessvel a todos os usurios da rede mundial de computadores,
especialmente a pessoas com deficincia. Seu pblico-alvo inclui desenvolvedores de
contedo Web e de ferramentas computacionais voltadas publicao de contedo para
essa mdia, que podem utiliz-las tanto para orientar o design de contedo Web quanto
em sua avaliao.
O documento Web Content Accessibility Guidelines 1.0 (W3C, 1999a),
considerado normativo pelo W3C, justifica claramente a importncia de cada uma de
suas recomendaes e oferece pontos de verificao (checkpoints) vinculados a elas,
com indicao de tcnicas para atend-los. Cada ponto de verificao est relacionado a
um nvel de prioridade, que d suporte sistematizao do design e da avaliao do
contedo da Web, visando sua acessibilidade:
Prioridade 1 pontos de verificao que desenvolvedores de contedo
devem satisfazer. Caso contrrio, um ou mais grupos acharo impossvel
acessar informaes no documento. Satisfazer um ponto de verificao com
esta prioridade considerado requisito bsico para alguns grupos
conseguirem usar documentos Web.

9
Ressalva: desenvolvidas, por exemplo, de acordo com recomendaes do W3C para agentes de usurio

XXIV JAI 1522


Prioridade 2 pontos de verificao que desenvolvedores de contedo
deveriam satisfazer. Caso contrrio, um ou mais grupos tero dificuldade
para acessar informaes no documento. Satisfazer um ponto de verificao
com esta prioridade ir remover barreiras significativas no acesso a
documentos Web.
Prioridade 3 pontos de verificao que um criador de contedo pode
satisfazer. Caso contrrio, um ou mais grupos de usurios tero alguma
dificuldade para acessar informaes no documento. Satisfazer um ponto de
verificao com esta prioridade ir melhorar o acesso a documentos Web.
No total, so 14 recomendaes, que abordam os seguintes temas: assegurar
transformao harmoniosa (recomendaes 1 a 11) e tornar o contedo compreensvel e
navegvel (recomendaes 12 a 14). A seguir, elas so apresentadas, em linhas gerais10:
Recomendao 1. Oferea alternativas ao contedo sonoro e visual.
Deve-se oferecer contedo que, ao ser apresentado ao usurio, sirva
essencialmente para a mesma funo ou propsito que o contedo sonoro ou
visual.
Recomendao 2. No recorra apenas cor.
Deve-se garantir que textos e grficos sejam compreendidos quando visualizados
sem cor.
Recomendao 3. Utilize corretamente marcaes e folhas de estilo.
Deve-se marcar os documentos com os elementos estruturais apropriados. A
apresentao deve ser controlada via folhas de estilo ao invs de serem utilizados
elementos de apresentao e atributos da linguagem de marcao.
Recomendao 4. Indique claramente qual o idioma utilizado.
Deve-se utilizar marcadores que facilitem a pronncia ou interpretao de texto
abreviado ou em lngua estrangeira.
Recomendao 5. Crie tabelas passveis de transformaes harmoniosas.
Deve-se criar tabelas que tenham os marcadores necessrios para viabilizar sua
transformao por navegadores e outros agentes de usurios.
Recomendao 6. Assegure que as pginas dotadas de novas tecnologias sejam
transformadas harmoniosamente.
Deve-se assegurar que as pginas sejam acessveis mesmo quando tecnologias
mais recentes no forem suportadas ou estiverem desabilitadas.
Recomendao 7. Assegure o controle do usurio sobre as alteraes temporais do
contedo.
Deve-se garantir que a movimentao, a intermitncia, a rolagem ou a
atualizao automtica de objetos ou pginas possam ser pausadas ou
interrompidas em definitivo.

10
Traduo livre das autoras deste texto

XXIV JAI 1523


Recomendao 8. Assegure a acessibilidade direta de interfaces do usurio integradas
(embedded).
Deve-se garantir que a interface de usurio siga os princpios do design
acessvel: independncia de dispositivos no acesso s funcionalidades,
operacionalidade via teclado, emisso de voz, entre outros.
Recomendao 9. Projete pginas considerando a independncia de dispositivos.
Deve-se utilizar caractersticas que viabilizem a ativao de elementos da pgina
por meio de uma variedade de dispositivos de entrada.
Recomendao 10. Use solues de transio.
Deve-se utilizar solues de transio para que tecnologias assistivas e
navegadores antigos possam funcionar corretamente.
Recomendao 11. Use tecnologias e recomendaes do W3C.
Deve-se utilizar tecnologias W3C (de acordo com a especificao) e seguir
recomendaes de acessibilidade. Quando no for possvel a utilizao de uma
tecnologia W3C, ou ao faz-la resulte em um material que no transformado de
forma harmoniosa, oferea uma verso alternativa do contedo que seja
acessvel.
Recomendao 12. Oferea informaes de contexto e de orientao.
Deve-se oferecer informaes de contexto e de orientao para auxiliar os
usurios a compreenderem pginas ou elementos complexos.
Recomendao 13. Oferea mecanismos de navegao claros.
Deve-se oferecer mecanismos de navegao claros e consistentes (ex.
informao de orientao, barras de navegao, mapa do site, etc) para ampliar
as chances de uma pessoa encontrar aquilo que procura em um site.
Recomendao 14. Assegure a clareza e a simplicidade dos documentos.
Deve-se assegurar que documentos sejam claros e simples, de maneira que
fiquem mais fceis de serem compreendidos.
Novas recomendaes para promover a acessibilidade do contedo da Web esto
em elaborao pelo grupo WAI (W3C, 2005b), visando serem aplicveis a um espectro
mais amplo de tecnologias e voltadas a um pblico-alvo mais variado (ex.
desenvolvedores de polticas, gerentes, designers grficos e editores). O objetivo geral
a criao de contedo Web perceptvel, opervel e compreensvel pelo maior nmero
possvel de usurios e compatvel com uma variada gama de tecnologias assistivas
atuais e futuras.
O detalhamento das recomendaes apresentadas nesta seo deve ser
consultado em um dos endereos a seguir, preferencialmente na verso normativa (em
ingls):
Web Content Accessibility Guidelines 1.0
http://www.w3.org/TR/1999/WAI-WEBCONTENT-19990505/

XXIV JAI 1524


Recomendaes para a acessibilidade do contedo da Web 1.0
http://www.geocities.com/claudiaad/acessibilidade_web.html

7.4.2. Exemplos de tcnicas para atender a recomendaes de acessibilidade


Nesta seo buscamos apresentar algumas tcnicas visando o atendimento a
recomendaes W3C para a acessibilidade do contedo da Web.
Estrutura e apresentao
Deve-se codificar corretamente, de acordo com a especificao utilizada, separando a
estrutura da apresentao. Deve-se evitar o uso de marcadores estruturais para efeito de
apresentao, como por exemplo:
Evitar tabelas para efeitos de apresentao, mas utiliz-la adequadamente
para organizao de dados tabulares;
No usar marcadores de cabealho h1, h2, h3 para efeitos de
apresentao do texto como, por exemplo, para deixar o texto com um
tamanho de fonte maior;
No usar marcadores de citao para efeitos de apresentao do texto, ou
seja, os marcadores q e blockquote devem ser usados, respectivamente,
para marcar citao curta e citao longa.
Idioma
Deve-se indicar o idioma principal utilizado em um documento (X)HTML e tambm
quando houver mudana do idioma no seu texto. As Figuras 7.18 e 7.19, a seguir,
ilustram como a identificao de um idioma pode ser realizada pelo uso do atributo
xml:lang e lang.
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="pt-br" lang="pt-
br">
Figura 7.18. Indicao do idioma principal em uma pgina XHTML 1.0 no marcador html
<span lang="en">[english content at this page]</span>
Figura 7.19. Indicao do idioma para um trecho de texto de uma pgina XHTML 1.0
Texto alternativo s imagens e s animaes
Deve-se oferecer texto alternativo s imagens e s animaes, de maneira que os
usurios possam ter acesso a informaes equivalentes quando utilizarem, por exemplo,
navegadores textuais e leitores de telas. Um texto alternativo pode ser oferecido pelo
uso dos atributos alt e longdesc, como exemplificado nas Figuras 7.20 e 7.21.
<a href="index.html" title="Voltar pgina principal"><img
src="logo.jpg" alt="Voltar pgina principal" /></a>
Figura 7.20. Uso do atributo alt para prover texto alternativo equivalente imagem

XXIV JAI 1525


<img src="gol.jpg" alt="Gol decisivo em partida entre Grmio e
Internacional" longdesc="descricao_gol.html" />
Figura 7.21. Uso dos atributos alt e longdesc para prover texto alternativo
equivalente imagem
Como existem agentes de usurios que no suportam o atributo longdesc, uma
boa poltica para oferecer texto alternativos a imagens mais elaboradas (ex. grficos e
diagramas) disponibilizar um link para uma pgina que a descreva, a exemplo do que
apresentado na Figura 7.22.
<img src="gol.jpg" alt="Gol decisivo em partida entre Grmio e
Internacional" longdesc="descricao_gol.html" />
[<a href="descricao_gol.html" title="Descrio do Gol">D</a>]
Figura 7.22. Uso de um D-link, alm dos atributos alt e longdesc, para prover texto
alternativo equivalente
Em mapas de imagens do tipo client-side11 (tags map e area), deve-se
oferecer texto alternativo a cada uma de suas regies significativas, pelo uso do atributo
alt do marcador area. Links redundantes, no formato texto, tambm devem ser
oferecidos a esse tipo de mapa de imagens, sendo indispensveis aos mapas de imagens
do tipo server-side12 (atributo ismap), cujas reas so inacessveis pelo uso do teclado.
Contedo multimdia
Para tornar um contedo multimdia mais acessvel, deve-se oferecer, para o udio,
legendas e transcries; e para as cenas, descries textuais preferencialmente
sincronizadas.
Contedos em udio e/ou em vdeo tambm podem ajudar a promover a
acessibilidade quando utilizados para facilitar o entendimento de alguma informao.
Cores
Cores no devem ser utilizadas como nico elemento de significao em uma pgina,
pois existem pessoas que no diferenciam certas cores (ex. daltnicos) e tambm h
diferentes tipos de monitores (ex. monocromticos). Assim, toda informao veiculada
com cor tambm deve ser oferecida sem o uso da cor, por exemplo, pelo uso do
contexto e/ou marcaes adequados.
Pelo mesmo motivo, textos e elementos grficos devem ter um bom contraste
com o seu fundo de apresentao.
Informaes textuais
Deve-se evitar o uso de imagens para representar texto, visando facilitar a busca de
informaes em uma pgina e colaborar no redimensionamento de seu contedo.
Deve-se viabilizar tambm que o texto seja ampliado com os recursos dos
navegadores, ou seja, deve-se evitar o uso de tamanho fixo para as fontes (letras). A
Figura 7.23, a seguir, destaca o uso de valores percentuais na folha de estilo apresentada

11
Navegador processa uma URI (ex. endereo de pgina Web)
12
Servidor processa as coordenadas clicadas

XXIV JAI 1526


na Figura 7.15 para indicar o tamanho da fonte nos cabealhos de nvel 1 e de nvel 2
para um documento (X)HTML.

h1 {
font-size: 150%;
font-family: "Times", serif;
}
h2 {
font-size: 120%;
font-family: "Times", serif;
}
Figura 7.23. Uso de valores percentuais na folha de estilo apresentada na Figura 7.15
para indicar o tamanho da fonte nos cabealhos de nvel 1 e nvel 2 para um documento
(X)HTML
Ainda, cada abreviatura ou sigla deve ser escrita por extenso quando ocorrer pela
primeira vez no documento, utilizando-se o atributo title dos marcadores abbr e
acronym apresentados na Tabela 7.1, alm de ser uma boa prtica faz-lo tambm no
corpo do texto.
Links e elementos de formulrio
Todos os links e elementos de formulrio devem ser alcanveis pelo uso do mouse e do
teclado. Deve-se utilizar o atributo accesskey, moderadamente, para prover teclas de
atalho a links e elementos de formulrio mais importantes. Pode-se utilizar tambm o
atributo tabindex para prover a tabulao ordenada no documento.
Quanto aos links, deve-se evitar descries inexpressivas como clique aqui e
utilizar o atributo title para oferecer informaes complementares, ou simplesmente
informaes redundantes. O texto de um atributo title, em geral, apresentado na
forma de hint e pode ser facilmente ampliado e manipulado por agentes de usurios. A
Figura 7.24, a seguir, ilustra o uso do atributo title e como atribuir a tecla de atalho
Alt+r a um link.

<a href="resumo.html" title="Resumo" accesskey="r">Resumo</a>


Figura 7.24. Uso do atributo title e atribuio de tecla de atalho a um link
Quanto aos formulrios, deve-se agrupar seus campos de maneira apropriada,
pelo uso dos marcadores fieldset e legend. Opes de seleo podem ser agrupadas
pelo uso do marcador optgroup. Deve-se associar a cada elemento de um formulrio,
exceo dos botes, um rtulo pelo uso do marcador label. Quando um boto de
formulrio for representado por uma imagem, deve-se oferecer um equivalente textual
pelo uso do atributo alt. As Figuras 7.25 e 7.26, a seguir, ilustram a organizao de
um formulrio para entrada em um sistema Web.

XXIV JAI 1527


<form action="login.php" method="post">
<fieldset>
<legend>Entrar no sistema</legend>
<label for="usr">Usurio: </label>
<input id="usr" type="text" value="Nome de usurio" name="usr"
tabindex="1" />
<label for="senha">Senha: </label>
<input id="senha" type="password" name="usr" tabindex="2" />
<input type="submit" value="Entrar" tabindex="3" />
</fieldset>
</form>
Figura 7.25. Codificao de um formulrio para entrada em um sistema Web

Figura 7.26 Ilustrao do formulrio cujo cdigo foi exibido na Figura 7.25
Tabelas
Deve-se evitar o uso de tabelas para formatao visual de uma pgina. Tabelas devem
ser utilizadas, com a devida marcao, para organizao de dados tabulares. As Figuras
7.27 e 7.28, a seguir, ilustram um exemplo de como estruturar uma tabela simples de
dados.
<table summary="Notas da primeira prova: a primeira coluna se refere
aos alunos e a segunda coluna se refere s notas">
<caption>Prova 1</caption>
<tr><th>Aluno</th><th>Nota</th></tr>
<tr><td>Adriana</td><td>9,5</td></tr>
<tr><td>Bruno</td><td>8,0</td></tr>
<tr><td>Claudinei</td><td>8,5</td></tr>
<tr><td>Maria</td><td>7,5</td></tr>
</table>
Figura 7.27. Codificao de um tabela de dados simples

Figura 7.28. Ilustrao da tabela de dados cujo cdigo foi exibido na Figura 7.27

XXIV JAI 1528


Uso de frames
Deve-se rotular os frames com ttulos apropriados, pelo uso do atributo title do
marcador frame. Deve-se tambm prover alternativa para os navegadores que no
suportam frames, pelo uso do marcador noframes. A Figura 7.29, a seguir, apresenta a
codificao de uma pgina Web, com dois frames verticais, de acordo com a definio
XHTML 1.0 Frameset.
<?xml version="1.0" encoding="iso-8859-1"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
lang="pt-br" xml:lang="pt-br">
<head>
<meta http-equiv="Content-Type"
content="text/html; charset=ISO-8859-1" />
<title>Design e Avaliao de Tecnologia Web-Acessvel</title>
<meta name="name"
content="Uso adequado de frames" />
<meta name="author"
content="Amanda Meincke Melo" />
<meta name="keywords"
content="Acessibilidade, XHTML, Frames" />
<meta name="description"
content="Exemplificao de uso adequado de frames" />
</head>
<frameset cols="20%, 80%" title="Design e Avaliao de Tecnologia Web-
Acessvel ">
<frame src="menu.html" title="Menu de Navegao" />
<frame src="conteudo.php" title="Contedo" />
<noframes>
<body>
<a href="menu.html" title="Navegao">Menu de Navegao</a>
</body>
</noframes>
</frameset>
</html>
Figura 7.29. Exemplo de uso adequado de Frames com a linguagem XHTML
A pgina sobre acessibilidade do Serpro (2005) apresenta mais exemplos, com
base em recomendaes do W3C, de como melhorar a acessibilidade Web com o uso
adequado da linguagem (X)HTML. A Tabela 7.2, a seguir, oferece mais algumas dicas
rpidas para dar incio a um design Web-acessvel.

XXIV JAI 1529


Tabela 7.2 Dicas rpidas para construir sites Web-acessveis (W3C, 2001)
Imagens e animaes Use o atributo alt para descrever a funo de cada elemento visual.
Mapas de imagens Use mapas client-side (o tag map) e texto para as regies clicveis.
Multimdia Oferea legendas e transcries para o udio, e descries para o vdeo.
Links Use texto que faa sentido quando lido fora do contexto. Por exemplo,
evite a frase "clique aqui".
Organizao da pgina Use cabealhos, listas e estrutura consistente. Use CSS para layout e estilo
sempre que possvel.
Grfico e diagramas Sumarize o contedo ou use o atributo longdesc.
Scripts, applets e plug-ins Oferea contedo alternativo, para o caso de serem inacessveis ou de no
serem suportados pelo navegador.
Frames Use o tag noframes e ttulos significativos.
Tabelas Torne compreensvel a leitura linha a linha. Resuma.
Valide seu trabalho Valide. Use as ferramentas, listas de pontos de verificao (checklists) e
recomendaes disponveis em http://www.w3.org/TR/WCAG.

7.5. Avaliao de acessibilidade no desenvolvimento de tecnologia Web


Como apresentado na seo 7.2, se um usurio no consegue alcanar os objetivos
estabelecidos na interao com um sistema computacional, a usabilidade deste sistema,
relativa a este usurio fica comprometida. Portanto, a avaliao da usabilidade de um
sistema computacional passa pela avaliao de sua acessibilidade.
Para realizar essa tarefa, existem diferentes mtodos de avaliao (W3C, 2002;
Graupp et al, 2003; Theofanos e Redish, 2003; Melo et al, 2004; Dias, 2003; Rocha e
Baranauskas, 2003), que tambm podem ser utilizados para auxiliar no desenvolvimento
de tecnologias Web-acessveis. Nesta seo, apresentamos alguns mtodos, que podem
ser utilizados de maneira complementar, uma vez que possibilitam identificar diferentes
aspectos relativos acessibilidade. Para encerrar a seo, apresentamos dois roteiros
para auxiliar na conduo de avaliaes de acessibilidade, adaptados de W3C (2002).

7.5.1. Uso de navegadores grficos e textuais


Este mtodo viabiliza investigar questes relativas interpretao de pginas Web por
meio de diversas configuraes de acesso.
Navegadores Grficos
A seguir, listado um procedimento para avaliao das pginas com navegadores
grficos (ex. Internet Explorer, Mozilla Firefox, Netscape, pera):
(1) Desativar as imagens e verificar se textos alternativos apropriados esto
disponveis.
(2) Desativar o som e verificar se o contedo sonoro est disponvel por meio
de textos equivalentes.
(3) Usar o controle do navegador para variar o tamanho da fonte: verificar se o
tamanho da fonte se modifica de forma apropriada e se a pgina ainda
utilizvel mesmo com fontes de tamanhos grandes.
(4) Testar com diferentes resolues de tela e/ou redimensionar a janela do
navegador para tamanhos menores que o mximo para verificar se a barra de
rolagem horizontal ou no requerida (recomenda-se fazer o teste com

XXIV JAI 1530


diferentes navegadores ou examinar o cdigo para verificar se so utilizados
valores absolutos para tamanhos de fonte).
(5) Mudar a exibio da cor para escala de cinza (ou imprimir a pgina em
escalas de cinza ou preto e branco) e observar se o contraste utilizado
adequado.
(6) Usar a tecla TAB para passar pelos links e controles de formulrios das
pginas, certificando-se de que todos os links e controles de formulrios
podem ser acessados bem como se os links indicam claramente para onde
levam.
Ilustramos os pontos (1), (3) e (4), respectivamente, nas Figuras 7.30, 7.31 e
7.32. A Figura 7.30, a seguir, apresenta a pgina de entrada do portal Agritempo, uma
aplicao de Sistema de Informao Geogrfica Web da Embrapa, acessada com o
navegador Internet Explorer 6.0 (I.E. 6.0) configurado para navegao com imagens
desabilitadas. possvel verificar que a maioria das imagens no possui texto
alternativo e aquelas que possuem (os contadores de acesso) tm texto alternativo
inexpressivo.

Figura 7.30. Pgina de entrada do portal Agritempo (http://www.agritempo.gov.br/),


acessada em 21.02.2005 pelo uso do navegador I.E. 6.0 com imagens desabilitadas
A Figura 7.31, a seguir, apresenta o frame principal do portal da Presidncia da
Repblica acessado com o navegador Internet Explorer 6.0 configurado para navegao
com tamanho da fonte ampliado. Apenas um texto de seus links ampliou, mas com
perda de informao, uma vez que a pgina utiliza imagens para veicular informaes
textuais e, em geral, tamanho de fonte fixo para seus textos.

XXIV JAI 1531


(a)

(b)
Figura 7.31. Frame principal do portal da Presidncia da Repblica
(http://www.presidencia.gov.br/), acessado em 20.05.2005 pelo uso do navegador I.E. 6.0
(a) em configurao normal e (b) configurado para uso de texto ampliado
A Figura 7.32, a seguir, apresenta a pgina principal do portal da Universidade
Estadual de Campinas (Unicamp) acessada com o navegador Internet Explorer 6.0,
utilizado com sua janela em tamanho reduzido. Seu texto e elementos de interface no
foram acomodados nova dimenso da janela, exigindo o uso da rolagem horizontal,
favorecendo a perda de contexto das informaes.

XXIV JAI 1532


(a)

(b)
Figura 7.32. Pgina principal do portal da Unicamp (http://www.unicamp.br/), acessada
em 11.08.2004 pelo uso do navegador I.E. 6.0 (a) em configurao normal e (b) com sua
janela reduzida
Os navegadores grficos pera e Mozilla Firefox oferecem facilitadores para
realizar este tipo de verificao, entre outros que sero apresentadas nesta seo.
Navegadores antigos tambm podem, e devem, ser utilizados na verificao da
acessibilidade. Ainda que a apresentao da pgina fique comprometida em navegadores
mais antigos, deve-se garantir a acessibilidade de seu contedo.
Navegadores Textuais
A seguir, listado um procedimento para avaliao das pginas com navegadores
textuais (ex. Lynx):
(1) Verificar se esto disponveis informaes equivalentes s apresentadas
no(s) navegador(es) grfico(s).

XXIV JAI 1533


(2) Verificar se a informao apresentada em uma ordem que faa sentido se
lida seqencialmente.
A Figura 7.33, a seguir, apresenta um trecho da pgina de entrada do portal
Submarino acessada com o navegador textual Lynx 2.8.5. Pode-se perceber com esta
ilustrao que vrias imagens foram utilizadas, mas nenhuma com texto alternativo,
inviabilizando a compreenso do contedo da pgina.

Figura 7.33. Pgina principal do portal Submarino (http://www.submarino.com.br/),


acessada em 18.06.2004 pelo uso do navegador Lynx 2.8.5 via terminal SSH

7.5.2. Uso de tecnologias assistivas


Tecnologias assistivas tambm podem ser utilizadas em verificaes de acessibilidade,
antes mesmo de serem realizados testes com usurios. No caso de leitores de telas,
pode-se utilizar o mesmo procedimento da verificao com navegadores textuais:
(1) Verificar se esto disponveis informaes equivalentes s apresentadas
no(s) navegador(es) grfico(s).
(2) Verificar se a informao apresentada em uma ordem que faa sentido se
lida seqencialmente.
Essa verificao possibilitaria perceber que a pgina apresentada na Figura 7.33
ficaria incompreensvel a um usurio de leitor de telas, uma vez que seriam lidos os
nomes de cada figura ao invs de informao textuais equivalentes.
Ampliadores de telas tambm podem ser utilizados para verificar, por exemplo,
como as informaes mais importantes da pgina so disponibilizadas, se as fontes
escolhidas para apresentao do texto so adequadas.

7.5.3. Validao automtica da linguagem de marcao


Auxilia a identificar problemas relacionados sintaxe das linguagens HTML, XHTML
e CSS por meio de ferramentas que inspecionam o cdigo dos documentos Web. Essas
ferramentas devem ser utilizadas na medida em que as pginas e templates (modelos)
para um portal so confeccionados, visando evitar a propagao dos erros e facilitar o

XXIV JAI 1534


trabalho de correo das pginas; e tambm sempre que as marcaes de um documento
HTML e as folhas de estilo forem atualizadas.
O W3C disponibiliza ferramentas online para este tipo de validao e o
navegador Mozilla Firefox facilita o acesso a elas, por meio de uma extenso ao
navegador que oferece ferramentas voltadas a desenvolvedores Web (Web Developer
Extension). As Figuras 7.34, 7.35 e 7.36 apresentam a interface das ferramentas
mencionadas.

Figura 7.34. HTML Validation Service (http://validator.w3.org/)

Figura 7.35. CSS Validation Service (http://jigsaw.w3.org/css-validator/)

XXIV JAI 1535


Figura 7.36. Barra de ferramentas Web Developer do navegador Mozilla Firefox, com
destaque s opes de validao das linguagens de marcao
As Figuras 7.37 e 7.38, a seguir, ilustram exemplos de trechos de relatrios de
uma pgina cuja codificao XHTML est de acordo com as recomendaes do W3C e
de outro cuja codificao HTML apresenta erro de sintaxe, indicando onde as correes
precisam ser realizadas.

Figura 7.37. Trecho de relatrio gerado pelo HTML Validation Service, indicando
conformidade da sintaxe de uma pgina Web com a definio XHTML 1.0 Strict

XXIV JAI 1536


Figura 7.38. Trecho de relatrio gerado pelo HTML Validation Service, indicando erro de
sintaxe de uma pgina Web e correes que precisam ser realizadas

7.5.4. Avaliao com base em pontos de verificao


Pode ser conduzida por revisores experientes, a partir de uma lista de pontos de
verificao, e realizada com auxlio de ferramentas semi-automticas.
Para facilitar o uso dos pontos de verificao apresentados junto s
recomendaes de acessibilidade (W3C, 1999a), o W3C disponibilizou um documento
que organiza esses pontos de verificao em temas e nveis de prioridade (W3C, 1999b;
W3C, 1999c). Um revisor, por exemplo, pode escolher comear pela verificao da
acessibilidade de um portal, ou conjunto de pginas de uma aplicao Web, pela
utilizao dos pontos de verificao de prioridade 1. A Tabela 7.3, a seguir, apresenta
um dos pontos de verificao de prioridade 1 relativo aos Casos em que so utilizados
applets e programas interpretveis.
Tabela 7.3 Trecho da tabela de pontos de verificao de prioridade 1,
adaptado de (W3C, 1999c), aplicado ao portal da Unicamp em 11.08.2004 (veja
tambm pgina Web da Figura 7.32)
Casos em que so utilizados applets e programas interpretveis (Prioridade 1) Sim No N. a.
6.3 Assegurar que todas as pginas possam ser utilizadas mesmo que os programas
interpretveis, os applets ou outros objetos programados tenham sido desativados ou
no sejam suportados. Se isso no for possvel, fornecer informaes equivalentes em X
uma pgina alternativa, acessvel.
Justificativa:
Se o navegador Web no oferecer suporte ao javascript, no ser possvel ter acesso verso ampliada da
foto apresentada.

7.5.5. Verificao da acessibilidade com auxlio de ferramentas semi-automticas


Destaca os problemas de acessibilidade em uma pgina Web, aps inspecion-la com
base em um conjunto de recomendaes (ex. WAI/W3C, Section 508). Em geral, tais
ferramentas apresentam os erros e sugestes de como corrigi-los, bem como
verificaes que precisam ser realizadas manualmente com auxlio, por exemplo, de
navegadores e tecnologias assistivas.

XXIV JAI 1537


Watchfire WebXACT
Representa uma dessas ferramentas, do mesmo provedor da ferramenta Bobby,
disponvel atualmente para Desktop. um servio online de avaliao de pginas Web,
gratuito, que verifica questes relativas qualidade, privacidade e acessibilidade.
Possibilita a verificao da acessibilidade de acordo com recomendaes WAI/W3C
(prioridades 1 a 3) e Section 508 do Governo dos EUA. A Figura 7.39, a seguir,
apresenta a interface desta ferramenta.

Figura 7.39. Watchfire WebXACT (http://webxact.watchfire.com/)


A Figura 7.40, a seguir, ilustra trecho de um relatrio gerado pela ferramenta,
que sumariza a quantia de erros e de advertncias para o site
http://www.presidencia.gov.br/, classificando-os por nvel de prioridade. Essa mesma
classificao utilizada no relatrio estendido que, alm de apontar os erros, indica
verificaes manuais que precisam ser realizadas.

Figura 7.40. Trecho de relatrio gerado pela ferramenta Watchfire WebXACT


daSilva
Avaliador de acessibilidade brasileiro, em fase de testes, que possibilita verificar se uma
pgina Web est de acordo com todos os nveis de prioridades do WAI/W3C ou apenas
alguns deles. A Figura 7.41, a seguir, apresenta a parte de sua interface voltada
configurao da avaliao.

XXIV JAI 1538


Figura 7.41. daSilva (http://www1.acessobrasil.org.br/dasilva/dasilva.html)

7.5.6. Avaliao com usurios com diferentes habilidades e/ou deficincias


Pode ser conduzida reviso das pginas Web com a participao de pessoas com
diferentes caractersticas, nveis de conhecimento tcnico e nvel de familiaridade com o
sistema Web, utilizando uma variedade de tecnologias. Para esse tipo de avaliao
ainda, uma outra maneira manter um canal de comunicao aberto aos usurios para
que eles relatem suas experincias e sugestes para o portal ou sistema Web em questo.
Em particular, os testes de usabilidade (Da Rocha e Baranauskas, 2003; Dias,
2003) e a observao participativa (Melo et al, 2004) possibilitam observar as
estratgias de interao construdas pelos diferentes usurios na realizao de tarefas
tpicas, em contextos diversificados e com o uso de tecnologias assistivas ex. leitores
de tela, ampliadores de tela, etc , bem como identificar as dificuldades que enfrentam.
Para Graupp et al (2003), antes de conduzir testes de usabilidade, entretanto, os
prprios designers deveriam avaliar a acessibilidade de um sistema ou produto. Essa
avaliao poderia ser realizada pelo uso de recomendaes e listas de pontos de
verificao e, em seguida, com leitores e ampliadores de telas. Desta forma garantiriam,
por exemplo, que rtulos esto adequadamente associados quilo que se referem.

7.5.7. Avaliao preliminar de acessibilidade


Tem como propsito identificar formas gerais de barreiras em um site, pela combinao
de verificaes manuais e verificaes com ferramentas semi-automticas. A seguir,
apresentado um procedimento para uma avaliao preliminar de acessibilidade,
adaptado de W3C (2002):
(1) Selecionar pginas representativas do site com diferentes caractersticas,
incluindo as pginas mais visitadas (ex. pgina principal). No caso de
pginas geradas dinamicamente, a partir de consultas a banco de dados,
gerar exemplos representativos, salv-los e test-los.
(2) Avaliar com um navegador grfico.
(3) Avaliar com navegador textual ou em voz.
(4) Usar duas ferramentas semi-automticas de verificao de acessibilidade.
(5) Registrar os resultados, resumindo os tipos de problemas encontrados e as
melhores prticas que devem ter continuidade, indicando de que forma os
problemas foram encontrados, recomendando passos a serem seguidos.

XXIV JAI 1539


7.5.8. Avaliao de conformidade W3C
Tem como propsitos: (1) capturar os principais problemas durante a fase de
desenvolvimento de um novo site; (2) determinar o nvel de conformidade com o
documento Web Content Accessibility Guidelines 1.0 (W3C, 1999a); (3) demonstrar que
um site possui determinado nvel de conformidade e aderncia aos padres. A seguir,
apresentado o procedimento recomendado pelo W3C (2002) para uma avaliao de
conformidade:
(1) Identificar e revelar o escopo do site a ser avaliado e o nvel de
conformidade a ser considerado:
a. Identificar e revelar o nvel de conformidade a ser considerado.
b. Identificar e revelar as pginas selecionadas para avaliao manual e com
a participao de usurios:
i. Deve incluir, pelo menos, um exemplo de cada tipo diferente de
pgina do site.
ii. Deve incluir as pginas mais acessadas.
iii. Quanto s pginas geradas a partir de consultas a bancos de
dados, deve-se testar, alm dos templates (modelos), o contedo
gerado.
c. Identificar e revelar todas as pginas de um site, incluindo todas as
pginas a partir de uma URL base, para avaliao automtica e semi-
automtica:
i. Se a avaliao do site inteiro no for praticvel, devido ao seu
tamanho ou natureza dinmica, identificar e publicar claramente o
que foi avaliado.
(2) Usar ferramentas automticas e semi-automticas
a. Avaliar com ferramentas automticas a validade da linguagem de
marcao (ex. HTML e CSS).
b. Usar, pelo menos, duas ferramentas semi-automticas de verificao de
acessibilidade.
(3) Avaliar manualmente:
a. Com base em pontos de verificao.
b. Com, pelo menos, 3 navegadores grficos diferentes, em diferentes
verses (ex. novas e antigas), em diferentes plataformas (ex. Windows,
Linux, Mac).
c. Avaliar com navegador textual e navegador em voz (pode ser um leitor
de telas).
d. Ler em voz alta.
(4) Conduzir testes de usabilidade.
(5) Registrar os resultados

XXIV JAI 1540


a. Resumir os tipos de problemas encontrados e as melhores prticas que
devem ter continuidade para cada pgina e URL representativa.
b. Indicar de que forma os problemas foram encontrados.
c. Manter e monitorar o site continuamente.

7.6. Concluso
O debate em torno dos temas acessibilidade e incluso digital tm reunido
representantes do governo, da sociedade civil, das instituies de ensino, entre outros,
em vrios pases do mundo. No Brasil, o acesso informao um direito de todo
cidado, assegurado pela Constituio. Em particular, o Decreto n 5.296, de 2 de
dezembro de 2004, trata do acesso informao e comunicao e prev um prazo de
12 meses (a contar da data de sua publicao) para que as informaes de portais e sites
Web da administrao pblica fiquem plenamente acessveis s pessoas com deficincia
visual. Este texto buscou contribuir construo de conhecimentos indispensveis
atualmente queles que desenvolvem ou venham a desenvolver sistemas de
informao e comunicao acessveis, em especial no cenrio de desenvolvimento de
tecnologias para a Web.
Acessibilidade precisa ser pensada de forma ampla, entretanto. Pouco adianta,
para determinados usurios, que a interface de um sistema computacional esteja
projetada levando-se em conta princpios do Design Universal e recomendaes de
acessibilidade, se a acessibilidade fsica ao computador est comprometida. Da mesma
forma, a adequao da arquitetura fsica de telecentros, instituies de ensino,
bibliotecas, etc para uso do computador insuficiente se a interface dos sistemas
computacionais interativos no forem desenvolvidas levando-se em conta a diversidade
de situaes para seu uso.
Um design que respeite as diferenas entre as pessoas na concepo de produtos
e de ambientes, sem estigmatizar ou excluir representa sem dvida um desafio para a
produo de sistemas computacionais. Este texto representa uma contribuio inicial
visando resgatar a importncia do conceito de acessibilidade para a produo de
tecnologias Web que possam ser utilizadas indiscriminadamente, na maior extenso
possvel, por pessoas diferentes e em condies de acesso diversas.

Agradecimentos
Ao Conselho Nacional de Desenvolvimento Cientfico e Tecnolgico (CNPq). equipe
do projeto Acesso, Permanncia e Prosseguimento da Escolaridade de Nvel Superior
de Pessoas com Deficincia: Ambientes Inclusivos, coordenado pelas professoras
Maria Teresa Eglr Mantoan (Faculdade de Educao, Unicamp) e Maria Ceclia Calani
Baranauskas (Instituto de Computao, Unicamp), financiado pelo PROESP/CAPES.

Referncias
Bevan, N. (1999). Quality in use for all, In: Stephanidis, Constantine. (ed.), User
interfaces for all, Lawrence Erlbaum.
Brasil (1998). Constituio da Repblica Federativa do Brasil. Texto promulgado em
outubro de 1998. [online]: http://www.senado.gov.br/

XXIV JAI 1541


Brasil (2004). Decreto n 5.296 de 2 de dezembro de 2004. Regulamenta as Leis ns
10.048, de 8 de de 2000, que d prioridade de atendimento s pessoas que especifica,
e 10.098, de 19 de dezembro de 2000, que estabelece normas gerais e critrios
bsicos para a promoo da acessibilidade das pessoas portadoras de deficincia ou
com mobilidade reduzida, e d outras providncias.
Certic (2005). Centro de Engenharia de Reabilitao em Tecnologias de Informao e
Comunicao. [online]: http://www.acessibilidade.net/web/
Connell, B. R.; Jones, M.; Mace, R. et al (1997). The Principles of Universal Design,
Version 2.0. Raleigh, The Center for Universal Design, NC: North Carolina State
University. [online]: http://www.design.ncsu.edu:8120/cud/univ_design/princ_
overview.htm.
Dias, C. (2003). Usabilidade na Web: Criando Portais mais Acessveis, 1 edio, Rio
de Janeiro, AltaBooks, 296p.
FGV (2003). Mapa da Excluso Digital. [online]: http://www2.fgv.br/ibre/cps/
mapa_exclusao/Inicio.htm
Graupp, H.; Gladstone, K.; Rundle, C. (2003). Accessibility, Usability and Cognitive
Considerations in Evaluating Systems with Users who are Blind, In: Stephanidis,
Constantine (ed.), Universal Access in HCI: Inclusive Design in Information Society,
Vol. 4, Crete, 22-27, junho 2003, Mahwah, New Jersey, Lawrence Erlbaum
Associates, pp. 1280-1284.
Hull, L. (2004). Accessibility: Its Not Just for Disabilities Any More, interactions,
vol. 11, issue 2, March + April 2004, New York, ACM Press, 2004, pp. 36-41.
IBGE (2005). Censo 2000. Instituto Brasileiro de Geografia e Estatstica. [online]:
http://www.ibge.gov.br/
ISO (1998). ISO 9241-11 Ergonomic requirements for office work with visual display
terminals Part 11, Guide on usability.
Juliato, M.; Tanaka, E. H.; Baudet, C.; Galves, M.; Coelho, T. T.; Rocha, H. V. (2004)
TFlex: Um Simulador de Teclado com Mltiplos Modos de Varredura, In: Garca,
Laura S.; da Silva, Srgio R. P. (eds.), Anais do VI Simpsio sobre Fatores Humanos
em Sistema Computacionais, Curitiba, 17-20, outubro 2004.
Melo, A. M.; Baranauskas, M. C. C.; Bonilha, F. F. G. (2004). Avaliao de
Acessibilidade na Web com a Participao do Usurio: Um Estudo de Caso, In:
Garca, Laura S.; da Silva, Srgio R. P. (eds.), Anais do VI Simpsio sobre Fatores
Humanos em Sistema Computacionais, Curitiba, 17-20, outubro 2004, pp. 181-184.
MDIA e deficincia. (2003). Srie Diversidade, Braslia: Andi, Fundao banco do
Brasil, 184p.
NCE/UFRJ (2005). Projetos de acessibilidade do NCE/UFRJ. [online]:
http://intervox.nce.ufrj.br/
Rocha, H. V. da; Baranauskas, M. C. C. (2003). Design Avaliao de Interfaces
Humano-Computador, Campinas, Nied, Unicamp, 244p.
Serpro (2005). Acessibilidade na Web. [online]: http://www.serpro.gov.br/
acessibilidade/

XXIV JAI 1542


Theofanos, M.; Redish, J. (2003). Bridging the gap: between accessibility and
usability, interactions, vol. 10, issue 6, November + December 2003, New York,
ACM Press, 2003, pp. 38-51.
Tiresias (2005). Inclusive Design. [online]: http://www.tiresias.org/guidelines/
inclusive.htm
Vanderheiden, G. C. et al (1992). Accessible Design of Consumer Products: Guidelines
for the Design of Consumer Products to Increase Their Accessibility to People with
Disabilities or Who Are Aging Working Draft 1.7. [online]:
http://trace.wisc.edu/docs/consumer_ product_guidelines/consumer.htm.
W3C (1999a). Web Content Accessibility Guidelines 1.0. [online]:
http://www.w3.org/TR/1999/WAI-WEBCON TENT-19990505/
W3C (1999b). Checklist of Checkpoints for Web Content Accessibility Guidelines
1.0.[online]: http://www.w3.org/TR/WCAG10/full-checklist.html.

W3C (1999c). Tabela de pontos de verificao das Recomendaes para a


acessibilidade do contedo da Web -- 1.0. Traduo: Cludia Dias. [online]:
http://www.geocities.com/claudiaad/full-checklist.html.
W3C (2001). Quick Tips to Make Accessible Web sites. [online]:
http://www.w3.org/WAI/References/QuickTips/
W3C (2002). Evaluating Web Sites for Accessibility. [online]:
http://www.w3.org/WAI/eval/
W3C (2004). How People with Disabilities Use the Web. [online]:
http://www.w3.org/WAI/EO/Drafts/PWD-Use-Web/
W3C (2005a). World Wide Web Consortium. [online]: http://www.w3.org/
W3C (2005b). Web Accessibility Initiative. [online]: http://www.w3.org/WAI/

XXIV JAI 1543


Amanda Meincke Melo

Mestre em Cincia da Computao pela Universidade Estadual de Campinas


(Unicamp) e Bacharel em Cincia da Computao pela Universidade Federal de
Santa Maria (UFSM). Atualmente aluna de doutorado em Cincia da
Computao no Instituto de Computao da Unicamp, sob orientao da
professora Dr. M. Cecilia C. Baranauskas, com bolsa financiada pelo CNPq.
reas de interesse: Sistemas de Informao, Interao Humano-Computador,
Engenharia de Software, Educao, Semitica, Design Universal. Pgina Pessoal:
http://www.ic.unicamp.br/~melo/
Cecilia Baranauskas

Professora Associada no Instituto de Computao da Universidade Estadual de


Campinas (Unicamp), Brasil. Bacharel e Mestre em Cincia da Computao e
Doutora em Engenharia Eltrica pela Unicamp, Brasil. Realizou Ps-doutorado no
Semiotics Special Interest Group (SSIG) da Stafford University e no Applied
Informatics with Semiotics (AIS) da University of Reading, Inglaterra. Interesses
acadmicos: aspectos da interao humano-computador, particularmente
diferentes formalismos e abordagens (incluindo Semitica e Design Participativo)
na anlise; design e avaliao de interfaces de usurio em aplicaes orientadas
a diferentes domnios (sistemas colaborativos para aprendizado, sistemas de
informao geogrfica, sistemas para a prtica de trabalho). Pgina Pessoal:
http://www.dcc.unicamp.br/~cecilia/

XXIV JAI 1544