Acessibilidade Aplicada Interfaces de Aplicaes Web

1 INTRODUO
Devido a popularizao da internet, tcnicas de acessibilidade so
frequentemente empregadas em pginas e aplicaes e Web, para atender diferentes
grupos de indivduos. !iste um grande con"unto de especifidades necessrias que
tornam uma aplicao Web acessvel. # World Wide Web $onsortion %W&$'
regulamenta as caractersticas dese"veis para se obter aplicaes Web acessveis.
ssas caractersticas so dispostas por nveis de abordagem de acordo com a
necessidade dos diversos tipos de usurios, as quais incluem princpios,
recomendaes de carter legal, critrios de sucesso testveis, um rico con"unto de
tcnicas de tipo suficiente e de tipo aconsel(ada
%(ttp)**+++.ilearn.com.br*,-*W$#./0*, /001'.
#s recomendaes de acessibilidade preveem formas de disponibilizar o
conte2do da internet de maneira mais acessvel para usurios com algum tipo de
defici3ncia, se"a ela fsica ou mental, como viso, audio, cognio, neurol4gicas,
etc... 5este artigo sero abordadas as necessidades de acessibilidade dos deficientes
udio6visuais, e as diretrizes previstas pela W&$ para disposio de conte2do para
esse grupo de usurios.
2 DEEN!O"!I#ENTO
2$1 %rinc&pi's e Rec'(endaes s'bre Acessibilidade na Web
5esta seo sero discutidos os princpios e recomendaes que so
necessrias para construir +eb sites e*ou aplicaes +eb acessveis de acordo com a
W&$. 7ale a pena ressaltar que os princpios, so regras ou caractersticas bsicas que
+eb sites devem conter para ter conte2do acessvel. as recomendaes descrevem,
com base nos princpios, o que fazer para satisfazer tal princpio.
8s princpios se dividem em quatro partes, que so) Perceptvel, Opervel,
Compreensvel e Robusto, respectivamente.
2$1$1 Perceptvel
# informao e os componentes da interface do usurio t3m de ser
apresentados aos usurios em formas que eles possam perceber
%(ttp)**+++.ilearn.com.br*,-*W$#./0*9perceivable, /001', ou se"a, todo conte2do
apresentado no stio +eb deve prover formas alternativas de apresentao de
conte2do de maneira que diferentes tipos de usurios possam saber da e!ist3ncia de
tal conte2do. !emplo, $#:,$;# sonoro para deficientes udio6visuais, para
validao de dados.
2$1$1$1 Recomendaes
#lternativas em ,e!to 6 <ornecer alternativas em te!to para qualquer conte2do
no te!tual permitindo, assim, que o mesmo possa ser alterado para outras
formas mais adequadas = necessidade do indivduo, tais como impresso em
caracteres ampliados, braille, fala, smbolos ou linguagem mais simples
%http://www.ilearn.com.br/TR/WCAG20/#text-equiv, /001'. !emplo, legenda
para imagens, e!pressas pelo atributo >alt?. #lem disso alternativas em te!to
so bastante eficientes no caso de problemas de carregamento com algum item
de pgina, devido ao te!to sempre ser renderizado primeiro. 7oltando ao
e!emplo anterior, quando alguma imagem, que por algum motivo no
carregada, o te!to da sua legenda e!ibido em seu lugar.
@dias com Aase no ,empo 6 <ornecer alternativas para mdias com base no
tempo %http://www.ilearn.com.br/TR/WCAG20/#meia-equiv, /001'. #ntes de
mais nada, o primeiro ponto a ser abordado neste t4pico ) 8 que so mdias
com base no tempoB -esposta) C todo conte2do de udio ou vdeo e!istente
em um stio +eb, se"a ele ao vivo ou pr6gravado. :ara este tipo de conte2do
recomendado que se"a disponibilizado uma breve descrio, se"a sonora no
caso de cegos ou legenda no caso de surdos, equivalente ao conte2do e!ibido,
para que o usurio com alguma dessas defici3ncias possa saber, antes de
acompan(ar na ntegra, do que se trata tal conte2do. 5o caso do
acompan(amento na ntegra, necessrio que se"a fornecido, legendas ou
udio sincronizados ao tempo de e!ibio de tal mdia %udio ou vdeo' at o
fim de sua e!ecuo. Dm detal(e importante, essas regras e*ou recomendaes
no se aplicam caso a mdia com base no tempo se"a uma forma alternativa de
algum conte2do publicado. 5ovamente, o e!emplo do $#:,$;# sonoro.
#daptvel 6 $riar conte2dos que possam ser apresentados de diferentes
maneiras %por e!., um laEout mais simples' sem perder informao ou estrutura
%http://www.ilearn.com.br/TR/WCAG20/#content-!tructure-!eparatio n , /001'.
8 e!emplo citado " e!plica do que se trata, mas acerca dessa adptao de
laEout e!istem algumas caractersticas que devem ser seguidas, se"a para
laEouts mobile ou para cone!es lentas assim como o .oogle fez com o .mail
com a opo de carregar a aplicao em (tml bsico quando a cone!o est
lenta. C recomendado que a adaptao manten(a a todas as informaes
disponveis na verso padro. #lm disso dese"vel que adaptao manten(a
a mesma estrutura ou semel(ante do laEout principal, se isso no for possvel,
no caso de laEout mobile, as informaes transmitidas no laEout padro que
dependerem da estrutura devem ser e!pressas em forma de te!to. !emplo,
uma barra de ferramentas ou um item de barra de ferramenta. #inda sobre o
e!emplo, normalmente os itens de menus ou ferramentas so facilmente e*ou
apenas identificados atravs de suas caractersticas sensoriais %taman(o, forma,
cor, imagens, etc...'. C necessrio que a percepo destes elementos no
dependa apenas destas caractersticas, mesmo em laEouts tidos como padro.
Discernvel 6 <acilitar a audio e a visualizao de conte2dos aos usurios,
incluindo a separao do primeiro plano e do plano de fundo
%http://www.ilearn.com.br/TR/WCAG20/#vi!ual-auio-contra!t, /001'. #ssim
como o caso das caractersticas sensoriais de elementos descritos no item
anterior, recomendado que a cor no se"a o 2nico recurso utilizado para a
percepo de algum elemento do laEout, requisitar interao do usurio ou
identificar alguma ao. Fobre sons na pginas +eb, recomendvel que e!ista
mecanismos de para diminuir volume, pausar ou parar, para todos os que
e!ecutarem automaticamente e tiverem ou forem emitidos com durao de
mais de & segundos. Fobre o conte2do te!tual, recomendado que o +ebsite
possibilite o redimensionamento de fonte. #tualmente a maioria dos
navegadores como, <irefo!, 8pera, .oogle $(rome e Gntenet !plorer, dispe
desse recurso que pode ser acessado atravs das teclas de atal(o, >$trl H? para
aumentar a fonte, >$trl 6? para diminuir e >$trl 0? para restaurar ao taman(o
original. Iogo, suficiente adicionar uma observao no +eb site para
conscientizar o usurio sobre este recurso caso ele necessite, no (avendo a
necessidade de implementar esta funcionalidade no +ebsite. #lem disso no
recomendado a utilizao de te!to "ustificado. 5o caso de imagens de te!to,
esta recomendao no se aplica, alm do mais recomendado o uso de
imagens de te!to somente para funes decorativas ou quando esta tem algum
papel semJntico sobre o conte2do apresentado.
2$1$2 Opervel
8s componentes de interface de usurio e a navegao devem ser operveis
%(ttp)**+++.ilearn.com.br*,-*W$#./0*9operable, /001'. 8s vrios grupos de
usurios devem ser capazes de utilizar o +ebsite. Gsto quer dizer que a interface deve
ser simples e coesa, alem de oferecer formas alternativas de utilizao para que o
usurio identifique facilmente onde encontrar o acesso =s operaes que dese"ar.
!emplo, padronizao de grupos de itens, como o menu ou a navegao, e acesso
aos itens do site atravs do teclado.
2.1.2.1 Recomendaes
#cessvel por ,eclado 6 <azer com que toda a funcionalidade fique disponvel
a partir do teclado %http://www.ilearn.com.br/TR/WCAG20/##e$boar-
operation, /001'. C dese"vel que a utilizao destas funcionalidades a partir
do teclado se"a feita sem qualquer espao de tempo, a no ser que esta
operao necessite, primeiramente, de entrada de dados ou aes anteriores.
,empo Fuficiente 6 <ornecer tempo suficiente aos usurios para lerem e
utilizarem o conte2do %http://www.ilearn.com.br/TR/WCAG20/#time-limit!,
/001'. :ara conte2dos com tempo predefinido de visualizao necessrio que
o +ebsite fornea controles para que o usurio possa a"ustar, e*ou prolongar,
e*ou desativar o tempo de visualizao dos mesmos. $omo, por e!emplo,
pausar uma apresentao de slides. sta recomendao no se aplica a
conte2dos de e!ecuo em tempo real. !emplo, transmisso de eventos ao
vivo por stream de vdeo.
#taques pilpticos 6 5o criar conte2do de uma forma con(ecida que possa
causar ataques epilpticos %http://www.ilearn.com.br/TR/WCAG20/#!ei%ure,
/001'. !istem algumas caratersticas visuais, como o disparo de mais tr3s
flashes no intervalo de um segundo e o flash com vermel(o intenso, que podem
causar ataque epiltico. Iogo, estas caractersticas no devem compor a
apresentao de conte2do ou layout do +ebsite.
5avegvel 6 <ornecer formas de a"udar os usurios a navegar, localizar
conte2dos e determinar o local onde esto
%http://www.ilearn.com.br/TR/WCAG20/#navi&ation-mechani!m!, /001'. #s
pginas devem conter ttulos ou cabeal(os que identifique cada t4pico do
+ebsite. 5o caso de navegao sequencial do +ebsite, atravs de focalizao
de itens, o foco dos itens devem seguir de maneira a preservar a operabilidade
e*ou significado para que usurios possam compreender a navegao. #lem
disso o item focado deve receber algum destaque, como mudana de cor, por
e!emplo, para que usurio saiba onde e!atamente se encontra o item em foco.
,odo item que pode receber foco deve conter uma descrio, e!pressa pelo
atributo title, para identificar do que se trata tal item, isso facilita
conte!tualizao dos usurio que necessitam de aplicao de leitor de telas.
,ambm recomendado que o +ebsite oferea redundJncia no que tange a
navegao, isto , oferecer vrias maneiras de acessar o mesmo conte2do ou a
mesma pgina, alm de oferecer um mecanismo que informe ao usurio em
que pagina ele est navegando e*ou camin(o percorrido at c(egar a tal pgina.
2$1$) Compreensvel
# informao e a operao da interface de usurio t3m de ser compreensveis
%http://www.ilearn.com.br/TR/WCAG20/#uner!tanable, /001'. # interface deve apresentar
de forma clara toda informao acerca da utilizao do +ebsite. Dma boa prtica,
sempre e!ibir dicas em forma de, hints, tooltips ou mesmo e!emplos, sobre como
utilizar cada item.
2$1$)$1 Recomendaes
Iegvel 6 ,ornar o conte2do de te!to legvel e compreensvel
%http://www.ilearn.com.br/TR/WCAG20/#meanin&, /001'. # implementao do
+ebsite deve suportar vrios tipos de navegadores %<irefo!, $(rome, Gnternet
!plorer, 8pera' se"a desKtop ou mobile, alm de tecnologias assistivas %Ieitor
de ,elas', para que a informao do conte2do em te!to possa ser apresentada
aos diferentes tipo de usurios. ,ambm recomendado disponibilizar
mecanismos que au!iliem os usurios sobre o significado de palavras
incomuns e abreviaturas, e ainda, conte2do suplementar caso o te!to e!i"a mais
do que o nvel bsico para seu entendimento. !emplos, listas de definio,
notas de rodap.
:revisvel 6 <azer com que as pginas Web sur"am e funcionem de forma
previsvel %http://www.ilearn.com.br/TR/WCAG20/#con!i!tent-behavior, /001'. C
recomendado caracterizar, de forma sucinta, os itens de interface com a mesma
funcionalidade que apaream em varias pginas, bem como os mecanismos de
navegao. #lm disso, recomendado que as alteraes de definio de
elementos de entrada de dados, assim como elementos que podem receber
foco, no implique em mudana automtica de conte!to, a no ser que o
usurio se"a avisado previamente. Gsto implica que, toda ao de alterao de
conte!to deve partir da solicitao do usurio. @udana de conte!to significa
alteraes importantes no conte2do da pgina, que se realizadas sem a
autorizao do usurio, podem desorienta6lo
%http://www.ilearn.com.br/TR/WCAG20/#context-chan&ee', /001' como, mudana
de foco de elemento, mudana de pgina, alterao de conte2do que altera o
significado da pgina.
#ssist3ncia de ntrada 6 #"udar os usurios a evitar e corrigir erros
%(ttp)**+++.ilearn.com.br*,-*W$#./0*9minimize6error, /001'. # interface
do +ebsite deve oferecer as informaes necessrias para que o usurio
consiga evitar e corrigir eventuais erros. !emplo, mensagens de erros com
sua descrio e, novamente, dicas e*ou e!emplos de como o usurio deve
utilizar cada item. C recomendado que a mensagem de erro e o pr4prio erro
se"am facilmente identificados. Dma boa prtica padronizar a apresentao
das mensagens de erro, bem como seu local de apario e apresentar ao usurio
as formas de preveno e resoluo de tal problema.
2$1$* Robusto
8 conte2do tem de ser robusto o suficiente para poder ser interpretado de
forma concisa por diversos agentes do usurio, incluindo tecnologias assistivas
%http://www.ilearn.com.br/TR/WCAG20/#robu!t, /001'. $omo citado anteriormente, o
+ebsite deve suportar vrios tipos de navegadores, mobile ou no, bem como
aplicativos assistivos.
2$1$*$1 Recomendaes
$ompatvel 6 @a!imizar a compatibilidade com atuais e futuros agentes de
usurio, incluindo tecnologias assistivas. -ecomenda6se que cada elemento de
marcao deve ser utilizado de acordo com suas especificaes de valor
sinttico, no deve (aver atributos duplicados e o valor do atributo >id? deve
ser 2nico por pgina. #lm disso, esperado, que a estrutura de marcao se"a
semJntica %(tml semJntico', ou se"a, usar cada elemento de acordo com sua
definio semJntica, de forma a optimizar a navegao e renderizao os
+ebsites
) +ONIDERA,E -INAI
#tualmente, fato que, dentre a maioria dos +ebsites e!istentes na rede e que
empregam principios de acessibilidade, o fazem, no mnimo possvel. @as, tambm
fato que, nunca antes se falou tanto sobre acessibilidade na +eb e que sites acessveis
uma tendencia mundial, uma vez que governos de vrios pases, como o Arasil,
apoiam e levam = serio esta iniciativa, aponto de criarem portarias e*ou leis espcficas
para tratar o assunto. Fem falar do ponto de vista mercadolgico do cenrio atual que,
cada vez mais empresas esto falando sobre mercado de nic(o, logo uma empresa
que, oferece suporte diferenciado em seu sistema de e6commerce a essa fatia do
mercado %clientes com necessidades especiais', faturar mais. # renovao e
otimizao de +ebsites, aplicaes e sistemas +eb devem ser constantes, de forma a
acompan(ar as mudanas tecnol4gicas e de conte!to.