UM PORTAL UNIVERSITRIO ACESSVEL

Angelo Henrique da Silva1; Glauber Barbosa Porto2; Gleiston Lcio3, Nathali Gasbarro Meireles4, Pollyana Abreu7 (Orientadora) Centro Universitrio de Belo Horizonte, Belo Horizonte, MG.
2

angelohenq@gmail.com; 3glauberporto@gmail.com; 4gleistonl@gmail.com; 5nathaligasbarro@gmail.com

Resumo: Este trabalho tem o objetivo de apresentar um projeto de um site acessvel para o atendimento ao pblico da universidade UNI-BH inclusive os que possuem deficincia visual parcial ou total. Para isso foi realizado uma pesquisa para investigar as diretrizes do W3C que mais se adequam ao pblico com deficincia, em seguida foram pesquisados sites voltados para cegos com recursos de acessibilidade. Para avaliarmos as diretrizes propostas no W3C, fizemos a seleo de conjunturas que so mais pertinentes em relao interao com o cego e usamos para avaliar o site para esse pblico. Posteriormente, usamos o Dasilva para avaliar a acessibilidade. Esta pesquisa nos proporciona embasamento para desenvolvermos um projeto de acessibilidade para o site do UNI-BH. Palavras-chave: Sistema Web, Acessvel, Deficiente, Visual

Abstract: This work has the objective to present a project of an accessible website for the public of UNI-BH, including the visually disabled. For that, we intended to develop a research the W3C directives most suitable for this kind of public, the following process was to search websites with accessibility for the blind. In order to evaluate the directives proposed on W3C, we selected conjunctures which were more suitable to the interaction of the blind, and we used those to analyze the website for this public. Further, we used Dasilva to evaluate this accessibility. This research provides us base to develop an accessibility project for UNI-BHs website. Keywords: Web System, Accessible, Visual impairment

____________________________________________________________________________
1 INTRODUO qualquer ponto do mundo sem a necessidade de passar pela sabatina de uma seqncia de A World Wide Web surgiu com o objetivo de facilitar a troca A de informaes das entre pginas pesquisadores. metfora menus hierarquizados. Isso facilitaria tanto o acesso s informaes quanto a disponibilizao das mesmas. A proposta inicial funcionava num navegador baseado em linha de comando, escrita pelo prprio Berners-Lee em 1991.1 (Wikipedia, 2012) Aps a exploso da web no final da dcada de
1

interconectadas por ligaes chamadas links foi proposta pelo pesquisador Tim Berners-Lee (2011), para substituir aplicaes que disseminavam informaes de forma hierrquica. A descentralizao do hipertexto permitiria que fossem ligados documentos localizados em

<http://pt.wikipedia.org/wiki/World_Wide_Web > Acessada em 15/09/2012

e-xacta, Belo Horizonte, Vol. X, N. Y, p. aa-bb. (ano). Editora UniBH. Disponvel em: www.unibh.br/revistas/exacta/

1990 e comeo dos anos 2000, houve uma mudana de paradigma e a web passou a ser meio para a extenso e criao de servios que atendam s necessidades das pessoas ou mesmo facilitem suas vidas de alguma forma. Logo a evoluo da internet e seus usurios comearam a sentir necessidade de mais uma ferramenta para melhorar o aspecto visual das home pages, o design com um papel de interao com o usurio, logo a preocupao em tratar e padronizar esta nova ferramenta e tcnicas tornou-se fundamental criando assim a W3C, aps isso surgiu a necessidade em atender as pessoas com deficincias visuais e foi criada a WAI2, voltada para pessoas com deficincia tratando assim suas diretrizes. Neste momento, surge como parte fundamental o profissional de design. Podemos dividir o papel do design na web em duas partes que se interagem: esttica e usabilidade. Os profissionais da rea de design devem se preocupar com o pblico que possui deficincia visual no momento da criao dos layouts para facilitar a navegao dos usurios pensando a todo o momento como melhorar e disponibilizar os elementos no corpo do site. A partir da a internet transformou-se em uma nova mdia de comunicao com caractersticas particulares de acesso, partindo da exibio de Web sites atravs de navegadores com leitores de tela que possibilitam a sua leitura. Essa facilidade que a Web passou a oferecer para a troca de informaes de forma rpida e
2

despojada, logo despertou interesse nas pessoas em utiliz-la. Em nossa sociedade necessidades temos pessoas com que os

possuem

especiais

deficientes visuais, eles por sua vez tambm utilizam a internet como meio de comunicao, entretenimento, compras. Existe a preocupao em trazer a estes usurios um conforto na navegao, pensando nisto foi criado o leitor de telas que auxilia os deficientes. Mesmo com leitor de telas, o deficiente tem muitas dificuldades na compreenso em alguns sites porque eles utilizam design, que fazem o leitor pular a leitura da imagem, tornando-o assim incompreensivo, pois ficam lacunas em branco e dificultam o entendimento do usurio. Atualmente esta dificuldade de compreenso tem se tornado uma barreira ao deficiente visual, pretende-se quebrar esta barreira e inseri-lo ao social em um universo onde ele poder receber conhecimento e mudar a sua vida; transcreveremos o site da UNIBH disposto no endereo eletrnico http://www.unibh.br para o sistema de leitor de telas onde haver um ambiente algumas perceptvel, adaptvel, opervel diretrizes de acessibilidade W3C realidade do deficiente visual. Usamos tambm cabveis ao nosso projeto. conhecimento, interao e

DIRETRIZES DE ACESSIBILIDADE W3C,

DIFICULDADES VISUAIS.

QUE

IMPACTAM

NA

INTERAO DO SITE UNI-BH COM CEGOS E PESSOAS COM

Web Accessibility Initiative<http://www.w3.org/WAI/>

e-xacta, Belo Horizonte, Vol. X, N. Y, p. aa-bb. (ano). Editora UniBH. Disponvel em: www.unibh.br/revistas/exacta/

Percepo -> textos curtos e objetivos facilitam a

3
navegao do usurio com deficincia visual, pois ele no se perde em explicaes e direcionado de forma eficiente parte do portal que realmente lhe interessa, valendo-se de artefatos no visuais. Usaremos mtodos falados para chamar a ateno do usurio deficiente. Adaptao-> Deixar a pgina de forma simples estruturalmente sem perder as informaes caso a folha de estilo seja corrompida ou mesmo no lida. Operao-> Principalmente acessvel por teclado, pois o deficiente visual precisa acessar os menus atravs dos skips links, que pode-se navegar atravs do teclado. Nos formulrios, poder utilizar a tecla TAB afim de trocar de campo conforme a necessidade. Os landmarks tm a mesma funo de saltar trechos da pgina, s que devemos utiliz-los apenas para marcar blocos importantes e podermos chegar O primeiro passo para garantir que um sistema web seja acessvel validar seu cdigo, tanto CSS5, quanto HTML6 dentre outros (scripts ou formataes). No portal do consrcio W3C disponibilizado um validador para isso e no portal Adaptao de leitor de tela-> So softwares que fazem uma sntese dos elementos que esto na tela, alguns permitem interao at mesmo com o sistema operacional, eles fazem a leitura atravs de comando executado pelo teclado. Esses softwares leem as informaes, botes, links e so apresentados para o usurio em forma textual igual a tela do computador. Com isso o usurio que possui deficincia visual no perde nenhuma informao e ganha autonomia em suas tarefas no computador3 (NVDA Project, 2012)
3

REVISO LITERRIA A internet, por ser um meio de comunicao recente, e por estar em fase acelerada de crescimento, acaba sendo palco de diversas construes mal planejadas. Muitas vezes, focando no grande pblico, um sistema web inteiro projetado sem levar em considerao preceitos bsicos de usabilidade e principalmente de acessibilidade. Levando em conta que aproximadamente 16 milhes de pessoas no pas portam algum tipo de deficincia visual4, constata-se que no pequena a parcela da populao prejudicada pela falta de cuidado com a forma na qual os sistemas web fornecem acesso para seus usurios (Acessibilidade Legal, 2012).

diretamente a eles, como o menu de navegao, contedo principal, contedo de informao e complementos.

dasilva.org.br encontramos uma opo nacional para validao focada especialmente em acessibilidade7. (daSilva, 2012) Corrigindo os erros apontados por estes

validadores possvel sanar diversos problemas de acessibilidade e partir para uma adaptao mais apurada do sistema, como por exemplo a
4

http://www.nvda-project.org/

http://acessibilidadelegal.com/23-padroesweb.php 5 Folha de estilo em cascata (utilizada para controlar a formatao do site). 6 Linguagem de marcao (utilizada para criao da base do website). 7 http://www.dasilva.org.br/
e-xacta, Belo Horizonte, Vol. X, N. Y, p. aa-bb. (ano). Editora UniBH. Disponvel em: www.unibh.br/revistas/exacta/

disponibilizao de opes de aumento ou reduo do tamanho de fontes, alm de controle do contraste da tela em tempo real para o usurio. aconselhvel tambm que se separe

Todo o trabalho feito para simplificar a estrutura das pginas e deixar marcaes inteligentes que identificam o contedo, ser feito principalmente para melhorar a performance e facilitar a execuo de softwares de tecnologia assistiva.
Tecnologia assistiva so recursos e servios que visam facilitar o desenvolvimento de atividades dirias por pessoas com deficincia. Procuram aumentar as capacidades funcionais e assim promover a independncia e a autonomia de quem as utiliza. (MELO, 2007, p. 94)

apresentao, contedo e comportamentos em camadas.

Cada uma dessas camadas se acrescentam entre si, tendo como base o contedo. Assim, se precisarmos desativar a camada de apresentao deixando o contedo limpo, e ainda, se quisermos desativar comportamento e deixar a pgina com seus scripts desativados, isso no gerar perda de contedo e a pgina poder ser navegada sem restries.8 (Acessibilidade Legal, 2012)

Diversas so as opes de softwares com essa finalidade. Dentre eles podemos citar os leitores de tela, que so sistemas capazes de interagir com o navegador e/ou o sistema operacional do computador, transformando informaes textuais em auditivas atravs de sintetizadores de voz10. (Movimento Livre, 2012). Os principais leitores de tela atualmente so: NVDA (Non Visual Desktop Access) um software gratuito em e de grande com a aceitao, criado 2006,

Alm da grande importncia no que diz respeito comunicao e entretenimento, a internet vem se mostrando cada vez mais eficaz ramo de prestao de servios. No caso do governo, por exemplo, requisies, consultas e interaes com as diversas esferas do poder so comumente feitas pela internet. So funes que deveriam ter fcil acesso para toda a populao, no entanto, segundo estudo feito em 2010 pelo Comit Gestor de Internet no Brasil o CGI.BR, aproximadamente 98% dos portais do governo estavam fora dos padres de acessibilidade9. No meio privado a situao no muito diferente, por isso vemos a necessidade de abordar este tema, expondo as ferramentas disponveis no mercado e seu comportamento perante o portal da UNI-BH que desenvolveremos durante o semestre com foco nas normas da W3C/WAI.
8

vantagem de possuir uma verso porttil, ou seja, pode ser levado em um pen-drive sem a necessidade de instalao (NVDA Project, 2012) JAWS (Job Acess With Speech) Desenvolvido pela Freedom Scientific, um dos principais softwares leitores de tela do mundo, mas possui uma onerosa licena para uso. uma com O fabricante de as todas disponibiliza demonstrao,
10

verso

http://acessibilidadelegal.com/23-padroesweb.php 9 Dimenses e caractersticas da Web brasileira: Um estudo do gov.br pg

e-xacta, Belo Horizonte, Vol. X, N. Y, p. aa-bb. (ano). Editora UniBH. Disponvel em: www.unibh.br/revistas/exacta/

http://www.movimentolivre.org/artigo.php? id=50

5
funcionalidades, mas com limitao de 40 minutos de uso por dia .
11

mas no possvel definir qual o melhor, porque depende muito da adaptao do usurio. Por este motivo, no nos aprofundaremos no funcionamento de cada leitor de tela, mas testaremos o projeto portal UNI-BH acessvel no maior numero de sistemas possvel, emitindo ao final, uma anlise de como estes sistemas se comportaram perante o website. ANALISE DA ACESSIBILIDADE DO

(Freedomscientific, 2012) VIRTUAL VISION Desenvolvido

inteiramente no Brasil, o software foi criado em 1997 e est hoje na verso 7.0. Curiosamente surgiu devido uma demanda do banco Bradesco em 1995, para atender a solicitao de um cliente deficiente visual que queria acessar sua conta12, para utilizar o sistema necessrio adquirir uma licena.(Virtual Vision, 2012) DOSVOX Considerado no somente um software, mas um sistema operacional, o DOSVOX vem se desenvolvendo desde 1993 pelo Ncleo de Desenvolvimento Eletrnico da Universidade Federal do Rio de Janeiro (UFRJ), ele um sistema gratuito e tem a caracterstica positiva de ter grande parte de suas mensagens sonoras geradas por voz humana,, o que o torna mais agradvel para o uso prolongado13. ( UFRJ, 2012) ORCA Software que roda em ambiente Linux, gratuito, de cdigo fonte aberto e integra um ampliador da tela, para auxiliar as pessoas que possuem algum nvel de viso14 (Live Gnome Org, 2012) Cada sistema possui seus prs e contras,
11

SITE UNI-RIO DE ACORDO COM AS DIRETRIZES W3C. Foram analisados os sites das UFMG, NOVOS

faculdades, INFORIUM, KENEDY,

FUMEC, PITGORAS, ANHANGUERA,

UNIFENAS,

HORIZONTES E UNI-BH. Nenhum deles atende s diretrizes da W3C, por isso optamos por avaliar o site da faculdade UNI-RIO, que teve uma verso desenvolvida para o pblico com deficincia visual.(UNIRIO, 2012)

http://www.movimentolivre.org/artigo.php? id=50 12 http://www.virtualvision.com.br/sobre.html 13 http://intervox.nce.ufrj.br/dosvox/ 14 https://live.gnome.org/Orca.pt_BR#Sobre_o_Or ca

Diretrizes: 1) Prover alternativas equivalentes para contedo auditivo e visual

e-xacta, Belo Horizonte, Vol. X, N. Y, p. aa-bb. (ano). Editora UniBH. Disponvel em: www.unibh.br/revistas/exacta/

As poucas imagens existentes no site foram implantadas com texto alternativo, ou seja, mesmo que o usurio no visualize o site o leitor de telas ser capaz de ler o significado da imagem. 2) No depender somente de cor O site dispe de um controle em tempo de execuo que permite ao usurio modificar o padro de cores. Desta forma o usurio pode utilizar o site com layout padro, desenvolvido com poucas cores ou mudar para a verso de alto contraste, que coloca o segundo plano todo em preto e letras claras. 3) Usar marcao de HTML

assim a tabela possui poucas linhas e colunas, no sendo um empecilho para um leitor de telas. 6) Usar diretrizes em tecnologias em conformidade com o W3C O site no conta com formatos que no esto dentro das especificaes do W3C como Shockwave Flash, Postscript, e que requerem o uso de plug-ins ou aplicaes externas e no podem ser acessadas por outros agentes de usurio. Devemos evitar o uso de tecnologias ou extenses proprietrias significa manter as pginas acessveis a um maior nmero de usurios, usando uma maior variedade de hardware e software. 7) Usar solues provisrias. O site capaz de oferecer acessibilidade intermediria que assegura as tecnologias de acessibilidade operem corretamente em verses antigas de browsers. 8) Projetar para no dependncia de equipamentos. O site usa recursos que permitem o acesso aos elementos da pgina por uma variedade de dispositivos de entrada e sada de dados. Se, por exemplo, o controle de um formulrio somente puder ser acionado via mouse, algum acessando a pgina sem dispositivos de viso, por entrada de voz ou via teclado somente, poder no ser capaz de operar o formulrio.

propriamente. O site utiliza a linguagem XHTML 1.0 que habilitada para fornecer informaes de contedo, facilitando o entendimento do leitor de telas. 4) Clarificar o uso de linguagem natural Termos que sites em outros idiomas foram identificados com marcaes de HTML especficas, com uma legenda para que o leitor de tela fornea durante a navegao, a informao em Ingls e seu significado em portugus. 5) Criar tabelas que se transformem graciosamente Das 10 sees do site apenas 1 utiliza tabelas. No entanto esta tabela no para formatao de layout e sim apresentao de contedo e mesmo
e-xacta, Belo Horizonte, Vol. X, N. Y, p. aa-bb. (ano). Editora UniBH. Disponvel em: www.unibh.br/revistas/exacta/

7
9) Prover contexto e orientao. O site trabalha com o agrupamento de elementos com a mesma funo e o provimento de informao contextual sobre as relaes entre os elementos que sero til para todos os tipos de usurio. 10) Prover mecanismos claros de do W3C o para do site de analisarmos site da referncia a em

acessibilidade Utilizamos

UNI-RIO.

avaliao de acessibilidade para websites http://www.dasilva.org.br/. De acordo com o resultado do site DaSilva o site apresentou erros de no aplicao W3C/WAI. de algumas das diretrizes

navegao. O site contm mecanismos de navegao que e so claros e consistentes assegurando e a aumentam a capacidade de identificao reconhecimento, orientao do usurio enquanto estiver procurando informaes. O uso de grupos de navegao organizados permite a compreenso da estrutura do site. 11) Assegurar clareza e simplicidade nos documentos. O site mostrou consistncia no layout e ordenao das pginas, a descrio de elementos grficos ou linguagem clara torna mais acessvel a interao com as pginas. O uso de linguagem clara promove eficincia no processo de comunicao, facilita a interao para pessoas com problemas de aprendizagem ou com problemas de expresso.(Saci Org, 2012)

A ferramenta identificou alguns erros e avisos, que sendo corrigidos podem melhorar a acessibilidade do site. 1. Identificar utilizado o nos principal idioma O

documentos.

idioma do documento deve ser especificado no HTML. 2. Fornecer um equivalente textual a cada imagem isso abrange: GIFs utilizadas e ou (representaes grficas do texto, incluindo animados, enumerao, botes utiliza-se o smbolos, imagens

como sinalizadores de pontos de espaadores para atributo alt grficos), tanto,

longdesc em cada imagem. Obs.: Para scripts voc deve utilizar noscript. 3. Assegurar que todas as

informaes veiculadas com cor ANALISE DASILVA Nessa etapa usamos o validador DaSilva DA ACESSIBILIDADE DO estejam tambm disponveis sem cor. 4. Criar uma sequencia lgica de tabulao para percorrer links,
e-xacta, Belo Horizonte, Vol. X, N. Y, p. aa-bb. (ano). Editora UniBH. Disponvel em: www.unibh.br/revistas/exacta/

SITE UNI-RIO USANDO VALIDADOR

controles de formulrios e objetos. 5. Utilizar a linguagem mais clara e simples possvel, logicamente, adequada ao contedo do sitio. 6. Assegurar a acessibilidade do

diferentes pessoas acessam a internet, desenvolvemos este trabalho com objetivo de proporcionar o acesso ao site do UNI-BH a pessoas com deficincia visual total e parcial. Com isso iniciamos a criao do prottipo. O objetivo criar um site separado do principal, utilizando as mesmas informaes e aplicando as diretrizes de acessibilidade do W3C, tornando assim um site agil, interface simples e padronizado para o interpretador.

contedo de frames, fornecendo uma pgina alternativa atravs do elemento noframes. 7. Dar cada frame um ttulo que facilite a identificao dos frames e sua navegao. 8. Fornecer com equivalentes do textuais usurio),

Com HTML, CSS e Java Script, usamos ferramentas que nos proporcionam o melhor aproveitamento no desenvolvimento do site. Inicialmente foi desenvolvido a ferramenta para alterao do tamanho da fonte, de acordo com uma do das W3C, essa diretrizes foi opo de est acessibilidade marcao utilizado

para sons (reproduzidos ou no interao arquivos de udio independentes, trilhas de udio de vdeo e trechos de vdeo. (daSilva, 2012)

relativa,

PROTTIPO ACESSVEL.

DE

UMA

APLICAO

localizada superior a direita da pagina. Com essa funcionalidade o usurio que parcialmente cego poder escolher nveis de tamanho da fonte do site e assim adaptando a visualizao necessria. Na mesma localizao foi desenvolvida a ferramenta usurio com a tiver funcionalidade dificuldade de de alterao do contraste da pagina. O que visualizao poder usar est funo para alterar em nveis o contraste do site.

Aps longas pesquisas sobre as diretrizes de acessibilidade no site do W3C, efetuamos levantamento de informaes sobre sites de faculdades e universidades se estavam de acordo com as diretrizes, testes de com a ferramenta as dasilva e de descobrimos que os mesmos no esto acordo com diretrizes acessibilidade do W3C. Com o nosso das conhecimento formas com e que

Os menus do site foi usado marcao apropriada para no haver problemas

entendimento

e-xacta, Belo Horizonte, Vol. X, N. Y, p. aa-bb. (ano). Editora UniBH. Disponvel em: www.unibh.br/revistas/exacta/

9
com os softwares de interpretao. No foi utilizado tabelas, os mesmos foram desenvolvidos em listas no ordenada e utilizando a tecla TAB possivel uma navegao fcil com o interpretador. tornar uma ferramenta de grande valia s instituies privadas, tanto para que pblicas se quanto adaptem

acessibilidade demandada a todos os tipos de pblicos.

CONCLUSO Diante do exposto, podemos considerar este estudo de suma importncia uma vez que conclumos, via pesquisa de investigao das diretrizes do W3C, que existem diretrizes fundamentais a serem seguidas afim de adequar as informaes do site ao pblico visualmente deficiente fazendo com que o mesmo contedo possa ser acessado da forma mais assertiva possvel. A utilizao de de uma ferramenta como de o

REFERNCIAS
Wikipedia - Word Wide Web.

http://pt.wikipedia.org/wiki/World_Wide_ Web Acesso em 15/09/2012.

NVDA-Project. http://acessibilidadelegal.com/23-padroesweb.php Acesso em 15/09/2012. Acessibilidade Legal A importncia dos padres Web para a Acessibilidade de Sites. http://acessibilidadelegal.com/23-padroesweb.php Acesso em 10/10/2012 daSilva O primeiro avaliador de Acessibilidade em Portugues para Websites. http://www.dasilva.org.br Acesso em 16/09/2012 Movimento Livre Caminho Livre para a incluso do Deficiente Visual. http://www.movimentolivre.org/artigo.php? id=50 Acesso em 15/09/2012. JAWS Freedom Scientific. http://www.freedomscientific.com Acesso em 28/09/2012 . Visual Vision MicroPower. http://www.virtualvision.com.br Acesso em 28/09/2012 UFRJ Intervox. http://intervox.nce.ufrj.br/dosvox Acesso em 28/09/2012 UFRJ Intervox. http://intervox.nce.ufrj.br/dosvox Acesso em 28/09/2012 UNIRIO Universidade Federal do Estado do Rio de Janeiro. http://www2.unirio.br/unirio/propg/accessibilityinfo Acesso em so to03/10/2012 SACI ORG Recomendaes do W3C.
e-xacta, Belo Horizonte, Vol. X, N. Y, p. aa-bb. (ano). Editora UniBH. Disponvel em: www.unibh.br/revistas/exacta/

avaliao leque de

acessibilidade de

Dasilva possibilita a apresentao de um oportunidades melhoria identificado nos sites como elementos de no aplicao das diretrizes, que, quando adaptados proporcionar adaptada ao e corrigidos, uma pblico podem navegabilidade visualmente

diferenciada e ao mesmo tempo precisa e deficiente. Como forma de exemplificar nossa pesquisa, tomamos como base referencial o site do UNI-BH, que visa o alcance a vrios tipos de pblico e que apresentou contedo compatvel com sua abrangncia. Logo, tem-se que esta pesquisa pode se

Resumo das diretrizes. http://saci.org.br/? modulo=akemi&parametro=1726 Acesso em 03/10/2012

Web Accessibility Initiative (WAI) - home page www.w3.org/WAI/ Acesso em 14/11/2012

e-xacta, Belo Horizonte, Vol. X, N. Y, p. aa-bb. (ano). Editora UniBH. Disponvel em: www.unibh.br/revistas/exacta/