60
UNIVERSIDADE FEDERAL DE SÃO JOÃO DEL-REI Ronan José Lopes Acessibilidade Web: um estudo de caso na Universidade Federal de São João del-Rei São João del-Rei 2014

Acessibilidade Web: um estudo de caso na Universidade ... · UNIVERSIDADEFEDERALDESÃOJOÃODEL-REI Ronan José Lopes Acessibilidade Web: um estudo de caso na Universidade Federal

  • Upload
    others

  • View
    0

  • Download
    0

Embed Size (px)

Citation preview

Page 1: Acessibilidade Web: um estudo de caso na Universidade ... · UNIVERSIDADEFEDERALDESÃOJOÃODEL-REI Ronan José Lopes Acessibilidade Web: um estudo de caso na Universidade Federal

UNIVERSIDADE FEDERAL DE SÃO JOÃO DEL-REI

Ronan José Lopes

Acessibilidade Web: um estudo de caso naUniversidade Federal de São João del-Rei

São João del-Rei2014

Page 2: Acessibilidade Web: um estudo de caso na Universidade ... · UNIVERSIDADEFEDERALDESÃOJOÃODEL-REI Ronan José Lopes Acessibilidade Web: um estudo de caso na Universidade Federal

UNIVERSIDADE FEDERAL DE SÃO JOÃO DEL-REI

Ronan José Lopes

Acessibilidade Web: um estudo de caso na UniversidadeFederal de São João del-Rei

Monografia apresentada ao curso de Ciênciada Computação da Universidade Federal deSão João del-Rei, como requisito parcial paraobtenção do título de Bacharel em Ciência daComputação.

Orientadora: Elisa de Tuler Albergaria

Universidade Federal de São João del-Rei – UFSJ

Bacharelado em Ciência da Computação

São João del-Rei2014

Page 3: Acessibilidade Web: um estudo de caso na Universidade ... · UNIVERSIDADEFEDERALDESÃOJOÃODEL-REI Ronan José Lopes Acessibilidade Web: um estudo de caso na Universidade Federal

Resumo

A popularização do uso da internet para fins diversos tornou viável a uti-lização da mesma para disponibilização de informações e serviços de interesse dapopulação. Os órgãos governamentais, assim como outras entidades, passaram a fa-zer uso da web para facilitar o acesso a esses recursos. Entretanto, a princípio nãohouve uma preocupação com que esses meios fossem desenvolvidos buscando incluirtambém os cidadãos que tenham qualquer tipo de limitação para interagir com essessistemas. Para garantir o direito de inclusão desses cidadãos, foi sancionado no Brasilo Decreto 5.296/2004, que determina como prioridade a promoção de acessibilidadenos âmbitos de administração pública. Buscando verificar a adequação ao decretomencionado, este trabalho apresenta um estudo de caso na Universidade Federal deSão João del-Rei, no contexto de acessibilidade web. Esse estudo consiste de umprocesso de levantamento dos problemas de acessibilidade no portal e sistemas dauniversidade, além da estruturação e implementação de alterações que solucionemos problemas identificados. Essa implementação foi auxiliada pelo uso do SistemaGerenciador de Conteúdo WordPress, apontado pelo estudo também aqui desenvol-vido como mais adequado ao contexto, tendo-se como principal requisito a geraçãode conteúdo acessível.

Palavras-chaves: acessibilidade web, interação humano-computador, sistemas ge-renciadores de conteúdo

Page 4: Acessibilidade Web: um estudo de caso na Universidade ... · UNIVERSIDADEFEDERALDESÃOJOÃODEL-REI Ronan José Lopes Acessibilidade Web: um estudo de caso na Universidade Federal

Abstract

The popularity of the Internet for various purposes has become feasible touse it for the provision of information and services of interest of the population.Government agencies, as well as others, began to make use of the web to facilitateaccess to these resources. However, first there wasn’t a concern that the assets weredeveloped aiming also include citizens who have any kind of limitation to interactwith these systems. To ensure the right of inclusion of these citizens, was sanctionedin Brazil Decree 5.296/2004, determining a priority to promoting accessibility in theareas of public administration. Seeking to verify suitability to the decree mentioned,this paper presents a case study at the Federal University of São João del-Rei, inthe context of web accessibility. This study is a process of problem identificationin accessibility on the portal and systems of the university, in order to design andimplement changes that solve the problems identified. This implementation was aidedby WordPress Content Management System, appointed by the study also developedhere as most appropriate to the context, having as main requirement the generationof accessible content.

Key-words: web accessibility, human-computer interaction, content managementsystems

Page 5: Acessibilidade Web: um estudo de caso na Universidade ... · UNIVERSIDADEFEDERALDESÃOJOÃODEL-REI Ronan José Lopes Acessibilidade Web: um estudo de caso na Universidade Federal

Lista de abreviaturas e siglas

ASES Avaliador e Simulador de Acessibilidade de Sítios

CSS Cascading Style Sheets

DIBIB Divisão de Biblioteca

DICON Divisão de Acompanhamento e Controle Acadêmico

e-MAG Modelo de Acessibilidade em Governo Eletrônico

GNU/GPL GNU General Public License

HTML Hypertext Markup Language

IHC Interação Humano-Computador

LIBRAS Língua Brasileira de Sinais

NEAD Núcleo de Educação à Distância

NTINF Núcleo de Tecnologia da Informação

PHP Hypertext Preprocessor

PNE Pessoa com Necessidades Especiais

PV Ponto de Verificação

SGBD Sistema Gerenciador de Banco de Dados

SGC Sistema Gerenciador de Conteúdo

UFSJ Universidade Federal de São João del-Rei

W3C World Wide Web Consortium

WAB Web Accessibility Barrier

WAI Web Accessibility Initiative

WCAG Web Content Accessibility Guidelines

Page 6: Acessibilidade Web: um estudo de caso na Universidade ... · UNIVERSIDADEFEDERALDESÃOJOÃODEL-REI Ronan José Lopes Acessibilidade Web: um estudo de caso na Universidade Federal

Sumário

1 Introdução . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 71.1 Justificativa . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 81.2 Objetivos . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 81.3 Organização . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 9

2 Referencial Teórico . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 102.1 Interação Humano-Computador . . . . . . . . . . . . . . . . . . . . . . . . 10

2.1.1 Acessibilidade na Web . . . . . . . . . . . . . . . . . . . . . . . . . 102.1.2 Diretrizes de Acessibilidade . . . . . . . . . . . . . . . . . . . . . . 112.1.3 Entrevistas com Usuários . . . . . . . . . . . . . . . . . . . . . . . . 13

2.2 Sistemas Gerenciadores de Conteúdo . . . . . . . . . . . . . . . . . . . . . 132.2.1 SysWeb . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 142.2.2 Wordpress . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 152.2.3 Joomla . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 162.2.4 Drupal . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 162.2.5 Plone . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 17

3 Trabalhos Relacionados . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 18

4 Metodologia . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 204.1 Proposta do Sistema Gerenciador de Conteúdo . . . . . . . . . . . . . . . . 20

4.1.1 Funcionalidades de Suporte à Acessibilidade . . . . . . . . . . . . . 204.1.2 Critérios Secundários . . . . . . . . . . . . . . . . . . . . . . . . . . 22

4.2 Promoção de Acessibilidade no Portal da UFSJ . . . . . . . . . . . . . . . 234.2.1 Levantamento de Problemas de Acessibilidade . . . . . . . . . . . . 234.2.2 Estruturação e Implementação de Alterações . . . . . . . . . . . . . 244.2.3 Validação das Alterações . . . . . . . . . . . . . . . . . . . . . . . . 25

5 Resultados . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 265.1 Proposta de Sistema Gerenciador de Conteúdo . . . . . . . . . . . . . . . . 265.2 Promoção de Acessibilidade no Portal . . . . . . . . . . . . . . . . . . . . . 27

5.2.1 Levantamento de Problemas de Acessibilidade . . . . . . . . . . . . 275.2.2 Implementação do Portal Acessível . . . . . . . . . . . . . . . . . . 295.2.3 Validação da Implementação . . . . . . . . . . . . . . . . . . . . . . 32

Conclusão . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 37

Page 7: Acessibilidade Web: um estudo de caso na Universidade ... · UNIVERSIDADEFEDERALDESÃOJOÃODEL-REI Ronan José Lopes Acessibilidade Web: um estudo de caso na Universidade Federal

Apêndices 38

APÊNDICE A Avaliação de Acessibilidade - Portal Atual . . . . . . . . . . . 38A.1 Software ASES . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 38

A.1.1 Busca de Notícias . . . . . . . . . . . . . . . . . . . . . . . . . . . . 38A.1.2 Inverno Cultural . . . . . . . . . . . . . . . . . . . . . . . . . . . . 39A.1.3 Mais Notícias . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 40A.1.4 Mapa Estrutural . . . . . . . . . . . . . . . . . . . . . . . . . . . . 41A.1.5 Página de Notícia . . . . . . . . . . . . . . . . . . . . . . . . . . . . 42A.1.6 Página Inicial . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 43A.1.7 Vestibular . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 44A.1.8 Vídeo Institucional . . . . . . . . . . . . . . . . . . . . . . . . . . . 45

A.2 Software Hera . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 46

APÊNDICE B Termo de Consentimento Livre e Esclarecido . . . . . . . . . . 48

APÊNDICE C Atividades Desenvolvidas Pelos Entrevistados . . . . . . . . . 50

APÊNDICE D Entrevistas Com Usuários - Respostas e Anotações . . . . . . 51D.1 Entrevistado 01 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 51D.2 Entrevistado 02 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 53D.3 Entrevistado 03 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 55

Referências . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 57

Page 8: Acessibilidade Web: um estudo de caso na Universidade ... · UNIVERSIDADEFEDERALDESÃOJOÃODEL-REI Ronan José Lopes Acessibilidade Web: um estudo de caso na Universidade Federal

1 Introdução

A intensificação e diversificação do uso da internet trouxeram aos usuários novosserviços disponíveis na rede, juntamente com uma mudança de conceito sobre a utilizaçãoda mesma. O surgimento de plataformas como blogs, wikis, redes sociais, dentre outras,marcam o advento do que é conhecida como a segunda geração da web, ou web 2.0(O’REILLY, 2005). Entretanto, nem todos os usuários conseguem usufruir desses recursos.Pessoas com necessidades especiais (PNE’s), idosos com dificuldade em se movimentar eoutros usuários com diversos tipos de limitações enfrentam barreiras para ter acesso einteragir com o conteúdo da rede.

Sendo o acesso à informação um direito universal, a preocupação com a garantiade acessibilidade na web tem sido tema de constantes debates. Com a finalidade de ela-borar diretrizes e normas que garantam a acessibilidade em websites, a World Wide WebConsortium (W3C)1, órgão responsável principalmente pela criação de padrões da web,elaborou o modelo de desenvolvimento Web Content Accessibility Guidelines (WCAG)2.Atualmente em sua segunda versão, o WCAG contém diretivas que auxiliam o desenvol-vimento de websites acessíveis.

Embora tenha-se disponível esse modelo internacional de diretrizes, diversos paí-ses optaram por desenvolver seu próprio documento, com a justificativa de se adequaremmelhor ao seu contexto. No caso do Brasil, após ter-se determinado a acessibilidade comorequisito para websites governamentais pelo Decreto 5.296/04, criou-se o Modelo de Aces-sibilidade em Governo Eletrônico (e-MAG)3, baseado no WCAG. Uma vez que foi baseadono modelo internacional, o documento brasileiro não o contradiz, diferenciando-se basica-mente em sua estrutura.

Os modelos mencionados são constituídos de pontos de verificação (PVs) que auxi-liam tanto o desenvolvimento de websites acessíveis quanto a verificação de conformidadepara websites já existentes. Essa verificação pode ser realizada tratando-se o documentocomo uma checklist, em que seus itens correspondem aos PVs do modelo. Contudo, deacordo com o aspecto do website, a sua conservação em conformidade com o modelo podeencontrar alguns empecilhos.

Em websites de característica dinâmica cuja geração de novas páginas é frequente(como portais de notícias, por exemplo) é comum a utilização de Sistemas Gerenciadoresde Conteúdo (SGC’s) para auxiliar a publicação, edição e administração dessas informa-ções. Nesse caso, o empecilho consiste em manter as páginas geradas futuramente por esses

1http://www.w3.org/2http://www.w3.org/TR/WCAG20/3http://www.governoeletronico.gov.br/acoes-e-projetos/e-MAG

Page 9: Acessibilidade Web: um estudo de caso na Universidade ... · UNIVERSIDADEFEDERALDESÃOJOÃODEL-REI Ronan José Lopes Acessibilidade Web: um estudo de caso na Universidade Federal

sistemas em acordo com o modelo de acessibilidade. Tal desafio dificulta então o atendi-mento às diretrizes por parte de websites que utilizem esses sistemas, tornando o quesitoacessibilidade um aspecto relevante na comparação e escolha do SGC a ser utilizado emuma aplicação.

1.1 JustificativaUma vez que a Universidade Federal de São João del-Rei (UFSJ)4 trata-se de um

órgão público, a acessibilidade aos seus recursos faz-se obrigatória nos diversos âmbitos dainstituição. Visando garantir esse direito, existe uma iniciativa na universidade intitulada"Projeto Incluir"5. A proposta do programa é fazer a inclusão de pessoas com qualquertipo de limitação através de projetos que envolvem diversos setores da universidade.

Dentre os problemas a serem resolvidos pelo projeto, inclui-se a promoção deacessibilidade web na utilização do portal e sistemas da UFSJ. Estes foram desenvolvidossem uma preocupação inicial em garantir que seu conteúdo fosse acessível a qualquerusuário. Por esse motivo, alunos e funcionários da instituição com necessidades especiaisenfrentam problemas ao navegar pelo website da universidade. Uma vez que o uso dessesambientes é imprescindível a todos os usuários, faz-se necessário prover uma solução parao problema em questão.

Além disso, para solucionar efetivamente o problema, é preciso garantir que aspáginas e o conteúdo dinâmico em geral criados posteriormente estejam em acordo comos requisitos de acessibilidade. Atualmente, O portal de notícias da UFSJ juntamentecom as páginas de unidades acadêmicas são gerenciados por um sistema interno, intituladoSysWeb. Esse sistema foi desenvolvido pelo Núcleo de Tecnologia da Informação (NTINF)6

da universidade, e uma vez que esse sistema foi desenvolvido sem a preocupação ematender os requisitos de acessibilidade, faz-se necessário uma solução em termos de SistemaGerenciador de Conteúdo que atenda a esses requisitos.

1.2 ObjetivosA proposta deste trabalho busca a promoção de acessibilidade no portal da UFSJ,

levando-se em conta os desafios apontados anteriormente. O processo que visa cumprir esseobjetivo consiste basicamente de 3 etapas: levantamento dos problemas de acessibilidadeno atual portal, implementação de alterações para correção desses erros e validação dasalterações implementadas. A etapa de implementação deve ainda contar com o auxílio douso de um Sistema Gerenciador de Conteúdo, dada a característica dinâmica do portal de

4http://www.ufsj.edu.br5http://www.ufsj.edu.br/incluir/projeto_incluir.php6http://www.ufsj.edu.br/ntinf/

Page 10: Acessibilidade Web: um estudo de caso na Universidade ... · UNIVERSIDADEFEDERALDESÃOJOÃODEL-REI Ronan José Lopes Acessibilidade Web: um estudo de caso na Universidade Federal

notícias da universidade. Para tal, busca-se fazer também um estudo comparativo entreos principais SGC’s disponíveis, a fim de identificar o mais adequado ao contexto.

Para o estudo dos Sistemas Gerenciadores de Conteúdo, o principal aspecto a seraveriguado refere-se à geração de conteúdo acessível, a fim de garantir que as novas páginascriadas se mostrem adequadas aos requisitos de acessibilidade. Como critério secundárioda proposta, leva-se em consideração aspectos desejáveis em um SGC, a fim de facilitar asua adesão pela universidade. O resultado final do trabalho visa ser um portal acessívelequivalente ao atual, proposto ao NTINF como sugestão de implementação efetiva.

1.3 OrganizaçãoAs seções deste trabalho estão divididas da seguinte forma: No capítulo 2, é apre-

sentado o referencial teórico e alguns conceitos importantes. O capítulo 3 lista um breveestudo de alguns trabalhos relacionados. O capítulo 4 apresenta a metodologia para de-senvolvimento do trabalho. No capítulo 5 são exibidos os resultados obtidos e por fim, nocapítulo 6 conclui-se o trabalho.

Page 11: Acessibilidade Web: um estudo de caso na Universidade ... · UNIVERSIDADEFEDERALDESÃOJOÃODEL-REI Ronan José Lopes Acessibilidade Web: um estudo de caso na Universidade Federal

2 Referencial Teórico

Para uma melhor contextualização e compreensão do trabalho desenvolvido, o en-tendimento de alguns conceitos e técnicas utilizadas são fundamentais. Esta seção destina-se a fazer uma abordagem desses conceitos que são utilizados como referencial teórico dotrabalho. Assim como no objetivo do trabalho, há uma divisão entre duas seções: a pri-meira apresenta conteúdo referente ao processo de avaliação da interação homem-máquina,enquanto a segunda faz uma descrição de características gerais de Sistemas Gerenciadoresde Conteúdo.

2.1 Interação Humano-ComputadorA Interação Humano-Computador (IHC) é definida como uma disciplina interes-

sada no projeto, implementação e avaliação de sistemas computacionais interativos parauso humano, juntamente com os fenômenos relacionados a esse uso (HEWETT et al.,1992). No contexto do trabalho aqui desenvolvido, a área de interesse da IHC é principal-mente a de avaliação, uma vez que os sistemas já foram projetados e implementados. Assub-seções seguintes fornecem o embasamento teórico necessário para avaliar e identificaros problemas de acessibilidade no portal da UFSJ.

2.1.1 Acessibilidade na Web

Garantir a acessibilidade, de forma geral, refere-se à remoção de barreiras queimpeçam pessoas com necessidades especiais ou qualquer tipo de limitação de ter acessoa recursos necessários em seu cotidiano. No contexto da web, trata-se de garantir que ousuário consiga compreender e interagir com o conteúdo que lhe é apresentado. Ou ainda,como definido por (BARBOSA;SILVA, 2010), "o critério de acessibilidade está relacionadocom a capacidade de o usuário acessar o sistema para interagir com ele, sem que a interfaceimponha obstáculos."

Usuários com necessidades especiais necessitam de assistência nessa interação comos sistemas, uma vez que a maior parte deles exige uma boa capacidade de percepção deinteração com o conteúdo. Para auxiliá-los nesse processo, existem ferramentas classifi-cadas como tecnologias assistivas. No entanto, antes de tudo, é preciso ter em conta osdiferentes tipos de necessidades especiais, mostradas na figura 1. A estratégia de assistên-cia ao usuário se dá de acordo com o tipo de necessidade especial que ele possui.

Para os usuários com deficiência auditiva, por exemplo, uma estratégia de promo-ção de acessibilidade web é disponibilizar o conteúdo da página em vídeos ou animações

Page 12: Acessibilidade Web: um estudo de caso na Universidade ... · UNIVERSIDADEFEDERALDESÃOJOÃODEL-REI Ronan José Lopes Acessibilidade Web: um estudo de caso na Universidade Federal

Figura 1: Possíveis tipos de necessidades especiais1

na Língua Brasileira de Sinais (LIBRAS). Para os usuários com deficiência motora, exis-tem componentes em hardware para facilitar sua interação (como teclados em braille, porexemplo). Já os usuários com visão limitada, podem ter o apoio de softwares leitores detela, que são programas que fazem a leitura de conteúdo textual através de uma voz sinte-tizada. Para o último tipo de assistência, faz-se necessário o suporte do programador, umavez que o funcionamento correto dos leitores de tela depende diretamente do conteúdoque a aplicação exibe.

Para que o uso desses leitores de tela seja eficaz no contexto da web, necessita-seque o conteúdo a ser apresentado esteja de acordo com padrões estabelecidos, que permi-tem aos leitores de tela se comportarem da forma esperada. Entretanto, existe uma grandevariedade de tecnologias para exibição de conteúdo na web à disposição do desenvolvedor.Devido a essa variedade de opções, o que se observa é que esses conteúdos se configuramde formas muito variadas quanto à sua estrutura, impossibilitando que a assistência aousuário com deficiência visual se dê de forma esperada. As diretrizes de acessibilidade vêm,então, definir os padrões que permitam o funcionamento eficiente dessas ferramentas.

2.1.2 Diretrizes de Acessibilidade

Conforme introduzido no primeiro capítulo, existem conjuntos de diretrizes quevisam garantir que um website ou sistema web esteja acessível a pessoas com qualquertipo de limitação. Esses cojuntos de diretrizes apoiam tanto o desenvolvimento quantoa verificação de websites já desenvolvidos, uma vez que a lista de pontos de verificaçãopode ser tratada com uma checklist de adequação. Este trabalho concentra seu estudo eé embasado nos dois modelos de diretrizes já introduzidos: o WCAG e o e-MAG.

O modelo WCAG, ou Web Content Accessibility Guidelines (diretrizes de aces-1Disponível em: <http://pt.slideshare.net/aiadufmg/acessibilidade-15430154> Acesso em nov. 2014.

Page 13: Acessibilidade Web: um estudo de caso na Universidade ... · UNIVERSIDADEFEDERALDESÃOJOÃODEL-REI Ronan José Lopes Acessibilidade Web: um estudo de caso na Universidade Federal

sibilidade de conteúdo da web) foi criado pela WAI2 (Web Accessibility Initiative), quetrata-se de um grupo de trabalho da W3C, criado especialmente para tratar de assun-tos relacionados a acessibilidade. As diretrizes do modelo são constituídas por pontos deverificação, que são basicamente normas a serem atendidas. Como exemplo, o ponto deverificação 1.1 do modelo: "Forneça um equivalente textual para todo o elemento nãotextual. Pode ser feito através do atributo ‘alt’, ou ‘longdesc’ ou no conteúdo do elemento(...)".

Ademais, a cada ponto de verificação é atribuído um nível de prioridade e o nívelde concordância do website com o modelo é definido pelo nível mais alto em que todas asrecomendações são atendidas. Esse nível de prioridade varia entre 1 e 3, sendo os pontos deprioridade 1 os mais importantes, seguidos respectivamente pelos níveis de prioridade 2 e3. Atualmente em sua segunda versão (2.0), o modelo contém 12 recomendações divididasem 4 princípios de acessibilidade, segundo consulta ao documento disponibilizado por(GOVERNO ELETRÔNICO, 2014):

∙ Perceptível: a informação e os componentes da interface do usuário têm de serapresentados aos usuários em formas que eles possam perceber.

∙ Operável: Os componentes de interface de usuário e a navegação têm de ser ope-ráveis.

∙ Compreensível: A informação e a operação da interface de usuário têm de sercompreensíveis.

∙ Robusto: O conteúdo tem de ser robusto o suficiente para poder ser interpretadode forma concisa por diversos agentes do usuário, incluindo recursos de tecnologiaassistiva.

Apesar da existência do modelo internacional, foi desenvolvido no Brasil (e emoutros países) um modelo voltado para o contexto nacional. O e-MAG (modelo brasileiro)encontra-se atualmente em sua terceira versão (3.1). Conforme analisado por (ROCHA;DUARTE, 2012) em um estudo comparativo dos modelos, seus objetivos e significados nãose diferem muito, observando-se uma diferença somente na estrutura e na organização dosdocumentos. A justificativa para uso do e-MAG está na maior facilidade de compreensão(uma vez que foi escrito em nosso idioma) e pelo fato de ter sido elaborado tendo comoreferência o contexto nacional.

Esses documentos de diretrizes de acessibilidade podem ter sua verificação de con-formidade trabalhosa para sistemas mais complexos e de codificação extensa. Visando au-xiliar essa tarefa, existem softwares desenvolvidos exclusivamente com este intuito, como

2http://www.w3.org/WAI/

Page 14: Acessibilidade Web: um estudo de caso na Universidade ... · UNIVERSIDADEFEDERALDESÃOJOÃODEL-REI Ronan José Lopes Acessibilidade Web: um estudo de caso na Universidade Federal

por exemplo o ASES3, DaSilva4 e Hera5. Baseando-se em algum conjunto de diretrizes, es-ses programas operam fazendo uma varredura no website, a fim de encontrar inadequaçõescom os requisitos de acessibilidade. Ao fim, apresenta-se como resultado da verredura umrelatório com os erros encontrados e suas respectivas localizações. Entretanto, nem todosos pontos podem ser verificados automaticamente, fazendo-se necessária uma verificaçãomanual.

2.1.3 Entrevistas com Usuários

Apesar da existência dos pontos de verificação para uma validação quantitativa daconformidade de um website com os requisitos de acessibilidade, uma forma de validaçãomais semântica e objetiva pode ser feita através de entrevistas e testes com usuários. Parao contexto da aplicação, o público-alvo das entrevistas são os usuários que apresentamalgum tipo de necessidade especial, tendo sua interação com o sistema possivelmentecomprometida.

A entrevista com o usuário trata-se de uma conversa guiada por um roteiro deperguntas ou tópicos, no qual um entrevistador busca obter informação de um entrevis-tado (SEIDMAN,1998). No contexto do trabalho, a informação a ser obtida refere-se àsprincipais dificuldades encontradas pelos usuários do portal e sistemas da universidadeao interagir com os mesmos. Essa informação auxiliará na identificação de alteraçõesque devem ser realizadas com uma maior urgência, além de permitir fazer um pequenolevantamento sobre a condição atual de navegação no portal por parte desses usuários.

2.2 Sistemas Gerenciadores de ConteúdoUm Sistema Gerenciador de Conteúdo é um software que possibilita a criação, o

gerenciamento, a distribuição, a publicação e a recuperação de informações, sendo queo gerenciamento do conteúdo deve ser definido sob o ponto de vista das atividades daspessoas e dos seus objetivos (BOIKO, 2001). É voltado para o auxílio de websites de ca-racterística dinâmica (como blogs, portais de notícias e fóruns), onde gerenciar as páginasindividualmente seria uma tarefa laboriosa, e portanto, faz-se necessário esse auxílio degestão do conteúdo. O SGC pode ser subdividido ainda em duas partes: o front end, queé o conteúdo exibido ao usuário, e o back end, que é a interface para administração dowebsite.

Nas subseções abaixo faz-se uma abordagem geral dos Sistemas Gerenciadoresde Conteúdo selecionados para estudo na proposta de SGC a ser utilizado pela UFSJ:

3http://www.governoeletronico.gov.br/acoes-e-projetos/e-MAG/ases-avaliador-e-simulador-de-acessibilidade-sitios

4http://www.dasilva.org.br/5http://www.sidar.org/hera/index.php.pt

Page 15: Acessibilidade Web: um estudo de caso na Universidade ... · UNIVERSIDADEFEDERALDESÃOJOÃODEL-REI Ronan José Lopes Acessibilidade Web: um estudo de caso na Universidade Federal

SysWeb 6, WordPress7, Joomla 8, Drupal9 e Plone10. Todos os sistemas selecionados sãode código-aberto, o que de antemão possibilita alterações em sua codificação para atenderrequisitos de uma aplicação específica.

2.2.1 SysWeb

O SysWeb é o atual sistema que auxilia a gestão de conteúdo no portal da Uni-versidade Federal de São João del-Rei e faz parte de um conjunto de sistemas internosdesenvolvidos para auxiliar a prestação de serviços na universidade. Ele é responsávelpelo gerenciamento de páginas de unidades acadêmicas (como os cursos de graduação,por exemplo) e notícias da página principal, administradas pela Assessoria de Comuni-cação Social (ASCOM) da UFSJ. O sistema desenvolvido na linguagem PHP permite ainserção, edição e remoção de conteúdo nas páginas gerenciadas. Um exemplo de cadastrode página é exibido na figura 2.

Figura 2: Cadastro de Página no SysWeb

Conforme pode-se observar na figura, o sistema oferece uma interface gráfica comcampos para inserção de título, opções de menu, dentre outros. Essa interface oferecetambém algumas ferramentas essenciais para a edição do conteúdo em si, como formataçãode fonte, inserção de imagem, hyperlinks e outras funcionalidades exibidas na figura 3.Para o conteúdo inserido, gera-se o respectivo código HTML. Pode optar-se ainda porfazer a edição do conteúdo em código HTML manualmente. As informações das páginas

6https://www.intranet2.ufsj.edu.br/principal.php7http://br.wordpress.org/8http://www.joomla.org/9https://www.drupal.org/

10http://plone.org.br/

Page 16: Acessibilidade Web: um estudo de caso na Universidade ... · UNIVERSIDADEFEDERALDESÃOJOÃODEL-REI Ronan José Lopes Acessibilidade Web: um estudo de caso na Universidade Federal

gerenciadas são armazenadas no servidor do NTINF, onde utiliza-se o SGBD proprietárioSQLServer11.

Figura 3: Edição de Conteúdo no SysWeb

2.2.2 Wordpress

O Wordpress é o Sistema Gerenciador de Conteúdo mais utilizado e possui a maiorcomunidade ativa, com mais de 200 milhões de usuários no mundo (ZAMORA, 2010). Sãoapontadas como vantagens a sua facilidade de instalação, além da simplicidade de modi-ficação e adaptação de layouts. Outra vantagem do WordPress é seu grande número deextensões (KIRK, 2010), que permite adicionar funcionalidades ao website desenvolvido.

Atualmente em sua terceira versão (3.9.1), o WordPress é distribuído sob a licençaGNU General Public License (GPL)12. Em linhas gerais, a GPL permite a liberdade deutilização, estudo, alteração e redistribuição do software livre. Essa propriedade permiteque o WordPress (assim como qualquer software sob a licença) tenha seu código-fontealterado para atender os requisitos da aplicação.

Para armazenar as informações, configurações e conteúdo do website gerenciado,o Wordpress requer a instalação do Sistema Gerenciador de Banco de Dados (SGBD)MySQL13 5.0 ou superior (conforme indicado em seu website). É requisito também parasua utilização a linguagem de programação Web PHP na versão 5.2.4 ou superior. Paraexecutar a interface de administração (back end), faz-se necessário também a instalaçãodo servidor web Apache14. Tratando-se de um software que roda em ambiente web, é umaferramenta multi-plataforma, podendo ser utilizada em qualquer sistema operacional comnavegador web instalado.

11https://www.microsoft.com/pt-br/server-cloud/products/sql-server/12http://www.gnu.org/licenses/gpl-howto.pt-br.html13http://www.mysql.com/14http://www.apache.org/

Page 17: Acessibilidade Web: um estudo de caso na Universidade ... · UNIVERSIDADEFEDERALDESÃOJOÃODEL-REI Ronan José Lopes Acessibilidade Web: um estudo de caso na Universidade Federal

Figura 4: Logotipo do Sistema Gerenciador de Conteúdo WordPress

2.2.3 Joomla

Criado em 2005, o Joomla foi desenvolvido a partir de um gerenciador de conteúdomais antigo intitulado Mambo e encontra-se hoje em sua terceira versão (3.3.1). De formasemelhante ao WordPress, o Joomla utiliza a combinação da linguagem de programaçãoweb PHP com o SGBD MySQL. Entretanto, além do Apache, a interface de administraçãopode rodar no servidor web IIs15.

Os pontos positivos do Joomla são, assim como no WordPress, sua comunidadeativa e a grande quantidade de extensões disponíveis para instalação. No entanto, suacurva de aprendizado se mostra um pouco mais acentuada para funcionalidades básicas(GOVERNO ELETRÔNICO, 2012). Sua distribuição também encontra-se sob a licençaGNU General Public License.

Figura 5: Logotipo do Sistema Gerenciador de Conteúdo Joomla!

2.2.4 Drupal

O SGC Drupal, por sua vez, foi lançado em 2001 e encontra-se hoje em sua sétimaversão (7.28). Assim como os SGC’s anteriores, é distribuído sob a licença GNU/GPL eé suportado na linguagem PHP. Os módulos fornecidos pelo Drupal em sua instalaçãopadrão que merecem destaque, mostrados por (CHAGAS et al., 2008) são:

∙ Block: Gerencia o conteúdo dos menus do website.

∙ Blog: Possibilita aos usuários registrados manterem um blog (website pessoal).

∙ Book: Possibilita a publicação de documentos estruturados.

∙ Forum: Possibilita criar grupos de discussão.15http://www.iis.net/

Page 18: Acessibilidade Web: um estudo de caso na Universidade ... · UNIVERSIDADEFEDERALDESÃOJOÃODEL-REI Ronan José Lopes Acessibilidade Web: um estudo de caso na Universidade Federal

∙ Locale: Possibilita apresentar o website em diferentes idiomas.

∙ Poll: Possibilita a criação de enquetes simples.

∙ Search: Possibilita efetuar buscas por conteúdos específicos no website.

Como SGBD, além do MySQL, tem-se como alternativa o PostgreSQL16. Em umacomparação superficial, conforme mostra (ALECRIM, 2008), o MySQL trata-se de umSGBD de desenvolvimento mais ágil e intuitivo, voltado para aplicações simples. O Post-greSQL por sua vez, é um SGBD otimizado para aplicações mais complexas, que exigemmaior robustez do SGBD.

Figura 6: Logotipo do Sistema Gerenciador de Conteúdo Drupal

2.2.5 Plone

O SGC Plone surgiu em 1999, ainda quando a web tinha sua característica depáginas mais estáticas. Apresenta características mais particulares em termos de utilizaçãoem relação aos outros SGC’s apresentados. Foi desenvolvido na linguagem Python e utilizacomo servidor web o Zope 17. Sua única semelhança com os demais SGC’s é a licença dedistribuição GNU/GPL.

Conforme mostrado no estudo comparativo de SGC’s em (GOVERNO ELETRÔ-NICO, 2012), os pontos positivos do Plone são sua interface amigável para gestão deconteúdo e sua robustez para necessidades complexas, sendo utilizada por grande jornaise organizações. No entanto, como ponto negativo, sua curva de aprendizado é muito acen-tuada, o que dificulta sua adesão. Além disso, o seu núcleo (core) é considerado o maiore mais pesado entre os SGC’s.

Figura 7: Logotipo do Sistema Gerenciador de Conteúdo Plone

16http://www.postgresql.org/17http://www.zope.org/

Page 19: Acessibilidade Web: um estudo de caso na Universidade ... · UNIVERSIDADEFEDERALDESÃOJOÃODEL-REI Ronan José Lopes Acessibilidade Web: um estudo de caso na Universidade Federal

3 Trabalhos Relacionados

Devido à crescente preocupação com a promoção de acessibilidade na web, muitostrabalhos têm sido desenvolvidos abordando o assunto. Em complementação ao referencialteórico, artigos e trabalhos científicos que abordaram conteúdos semelhantes serviram deapoio na construção da metodologia a ser utilizada.

O primeiro passo na avaliação de acessibilidade no portal e sistemas da Univer-sidade Federal de São João del-Rei consiste em definir as métricas que determinarão aadequação das páginas avaliadas. O estudo desenvolvido por (ROCHA; DUARTE, 2012)apoia a tomada de decisão acerca de tais métricas através de um estudo comparativo en-tre os dois conjuntos de diretrizes de acessibilidade definidas na seção anterior: as WCAG(modelo internacional) e o e-MAG (modelo brasileiro). O estudo apresentado possibi-lita um melhor entendimento de como as diretrizes foram construídas e sua evolução,bem como suas diferenças e o contexto em que são aplicadas. Para o contexto de umórgão público como a UFSJ, o estudo apontou o modelo e-MAG como mais adequado,ressaltando-se que este não fere os princípios propostos pelo modelo internacional.

Um exemplo de aplicação de diretrizes de acessibilidade foi mostrado no trabalhodesenvolvido por (FREIRE; CASTRO; FORTES, 2009) através de uma análise quanti-tativa no cenário brasileiro. A proposta desse trabalho é avaliar os websites de governosbrasileiros durante os anos de 1996 a 2007, baseando-se em uma métrica proposta por(PARMANTO; ZENJ, 2005), denominada WAB (Web Accessibility Barrier). Essa mé-trica consiste basicamente em obter uma média de inadequações por página, onde osproblemas encontrados nas páginas têm como peso o inverso de sua prioridade definidapelo modelo. Para identificar tais inadequações, utilizou-se como pontos de verificaçãoaqueles definidos pelo modelo internacional WCAG. Através dos resultados apresentados,pode-se inferir que, apesar da lei sancionada, os websites dos governos estaduais apontamuma taxa significativa de barreiras para o usuário com limitações.

Outro exemplo de aplicação prática das diretrizes foi desenvolvido por (SILVA; NU-NES; OLIVEIRA, 2012), em um trabalho cujo objetivo é bem próximo à correção de errosde acessibilidade dos sistemas da UFSJ. Trata-se de um estudo de caso para tornar aces-sível aos usuários o portal da Pró-Reitoria de Pós-Graduação e Pesquisa (POSGRAP) –Universidade Federal de Sergipe (UFS)1. Para alcançar esse objetivo, utilizando o WCAGcomo referência, fez-se a avaliação automática do website com o software DaSilva, a fim dese detectar problemas de acessibilidade. Através dos erros indicados, realizou-se o trabalhode correção dos mesmos e validação das alterações. O trabalho aqui desenvolvido busca

1http://posgrap.ufs.br/

Page 20: Acessibilidade Web: um estudo de caso na Universidade ... · UNIVERSIDADEFEDERALDESÃOJOÃODEL-REI Ronan José Lopes Acessibilidade Web: um estudo de caso na Universidade Federal

estender esse procedimento aos principais sistemas da UFSJ, utilizando uma metodologiasemelhante.

Além do procedimento de identificação e correção de problemas de acessibilidade,o outro objetivo deste trabalho é a proposta de um SGC mais adequado ao cenário de uso,sem deixar de atender aos requisitos de acessibilidade. (AMARAL et al., 2011) relatamem seu trabalho o desenvolvimento de um portal para o projeto de ensino de Geome-tria Descritiva via web (WebGD)2. O portal foi desenvolvido utilizando o SGC Joomla,buscando ainda garantir a acessibilidade no conteúdo gerado. Tratando-se o Joomla deum software de código aberto, as funcionalidades de acessibilidade que não eram nativaspuderam ser implementadas em sua codificação. Algumas dessas funcionalidades serviramcomo referência na comparação dos Sistemas Gerenciadores de Conteúdo na proposta deSGC a ser apresentada neste trabalho.

A seleção dos Sistemas Gerenciadores de Conteúdo que fariam parte da análisepara proposta foi auxiliada pela avaliação produzida por (CHAGAS et al., 2008). Essaavaliação trata-se de uma abordagem mais geral dos principais SGC’s de código aberto,não voltada ao quesito acessibilidade. Entretanto, essa abordagem levantou aspectos sobreos sistemas que são relevantes na indicação de potenciais candidatos à proposta. NoveSGC’s de código aberto foram analisados, selecionados segundo requisitos desejáveis emum software. Mesmo se tratando de uma análise superficial, os aspectos abordados sãorelevantes em qualquer aplicação que se faça necessário a comparação dos SGC’s. Para otrabalho a ser aqui desenvolvido, o requisito principal é a geração de conteúdo acessível.

Por fim, ainda apoiando a proposta de Sistema Gerenciador de Conteúdo, o tra-balho desenvolvido por (SATO, 2008) também faz um estudo comparativo que tem comocenário, assim como o trabalho aqui desenvolvido, uma universidade pública brasileira.Entretanto, além de aspectos mais gerais dos sistemas, o trabalho levou em consideraçãotambém a adequação com as diretrizes de acessibilidade. Todavia, conforme apontadopelo próprio estudo, muitos pontos das diretrizes são subjetivos e portanto, faz-se neces-sário uma análise mais aprofundada para um resultado mais conclusivo. O trabalho aquidesenvolvido vem então realizar esse estudo mais aprofundado, fazendo uma comparaçãoentre os SGC’s que leva em consideração aspectos relevantes no suporte à acessibilidade.

2http://www.webgd.ufsc.br/

Page 21: Acessibilidade Web: um estudo de caso na Universidade ... · UNIVERSIDADEFEDERALDESÃOJOÃODEL-REI Ronan José Lopes Acessibilidade Web: um estudo de caso na Universidade Federal

4 Metodologia

A fim de solucionar os problemas e cumprir os objetivos expostos na primeiraseção, apresenta-se neste capítulo os métodos utilizados, bem como suas característicase a justificativa para sua escolha. Conforme introduzido anteriormente, o processo depromoção de acessibilidade web na UFSJ subdivide-se em três etapas: identificação deerros de acessibilidade, implementação de alterações e validação das alterações realizadas.Entretanto, antes de iniciar a etapa de implementação, é necessário que se tenha obtido aproposta de SGC, a fim de utilizar o mesmo para gerenciar o conteúdo (páginas e notícias)do portal implementado.

Esse estudo baseia-se primordialmente no suporte à acessibilidade provido peloSGC, averiguado através da existência de algumas funcionalidades de apoio à navegaçãodos usuários com necessidades especiais. Ademais, foram estabelecidos também aspectosdesejáveis ao SGC como critérios secundários. Dessa forma, uma vez atendido o requisitode acessibilidade, busca-se propor um Sistema Gerenciador de Conteúdo que melhor seadeque à sua aplicação. As etapas de todo esse processo são detalhadas nas sub-seçõesseguintes.

4.1 Proposta do Sistema Gerenciador de ConteúdoA fim de apresentar como proposta à universidade um Sistema Gerenciador de

Conteúdo que melhor adesão baseado em seu contexto, faz-se nesta seção um estudocomparativo entre 5 SGC’s já apresentados: SysWeb, WordPress, Joomla, Drupal e Plone.Os sistemas foram selecionados buscando obter-se um conjunto heterogêneo, ressaltando-se suas particularidades na comparação. Nas subseções abaixo detalham-se as etapas desseprocesso:

4.1.1 Funcionalidades de Suporte à Acessibilidade

Em uma análise comparativa de recursos de acessibilidade dos sistemas gerencia-dores de conteúdo, utilizou-se como referência algumas funcionalidades do trabalho im-plementado por (AMARAL et al., 2011). Essas funcionalidades auxiliam a navegação dousuário que possua limitações principalmente visuais e eventualmente utilize um softwareleitor de tela. As funcionalidades selecionadas para comparação foram:

∙ Alto contraste entre o plano de fundo e o conteúdo textual:O alto contraste em uma página facilita a leitura por parte de usuários com baixa

Page 22: Acessibilidade Web: um estudo de caso na Universidade ... · UNIVERSIDADEFEDERALDESÃOJOÃODEL-REI Ronan José Lopes Acessibilidade Web: um estudo de caso na Universidade Federal

visão e está listado como a recomendação 4.1 do e-MAG: "Oferecer contraste mí-nimo entre plano de fundo e primeiro plano". A figura 8 ilustra o resultado daimplementação dessa funcionalidade no trabalho de (AMARAL et al., 2011):

(a) Página Original (b) Alto Contraste

Figura 8: Comparação da página em seu contraste original e alto contraste

∙ Botões ou ferramentas que permitam ao usuário alterar o tamanho da fonte dapágina:Também torna o conteúdo da página mais perceptível, permitindo que o usuárioajuste o tamanho que lhe for mais adequado. O portal da UFSJ já contém essafuncionalidade no topo da página, conforme pode ser observado na figura 9.

Figura 9: Barra superior do portal da UFSJ

∙ Teclas de atalho para acesso imediato às seções do website:

As teclas de atalho facilitam a navegação do usuário para pontos estratégicos dapágina. "Os atalhos deverão funcionar através de números precedidos da tecla padrãode cada navegador (Alt no Internet Explorer, Shift + Alt no Firefox, Shift + Esc noOpera, etc.). Os atalhos que deverão existir nas páginas do Governo Federal são osseguintes: 1 para ir ao conteúdo, 2 para ir ao menu principal e 3 para ir à caixa depesquisa"(GOVERNO ELETRÔNICO, 2014). Um exemplo de implementação dasteclas de atalho é demonstrado no próprio documento, exibido na figura 10.

∙ Identificação do idioma principal da página no hipertexto:Trata-se de uma inserção bem simples no código-fonte da página, que identifica oidioma principal da página em questão. Essa informação é relevante para softwaresque fazem a leitura da página, para que identifiquem corretamente o idioma do

Page 23: Acessibilidade Web: um estudo de caso na Universidade ... · UNIVERSIDADEFEDERALDESÃOJOÃODEL-REI Ronan José Lopes Acessibilidade Web: um estudo de caso na Universidade Federal

Figura 10: ”Cabeçalho da identidade digital de governo (versão verde) com barra de acessibilidade notopo” (GOVERNO ELETRÔNICO, 2014)

áudio que será sintetizado. Para identificar o idioma como português, por exemplo,basta inserir a seguinte marcação no código HTML:<meta http-equiv="content-language"content="pt-br"/>

∙ Ferramenta que permita ampliar uma região de interesse durante a navegação pelowebsite (Zoom):Também buscando tornar o conteúdo mais perceptível, uma ferramenta de zoompermite ampliar uma área em específico da página, permitindo ressaltar o conteúdoao qual esteja atento. Além de texto, permite-se realçar conteúdo não-textual, comoimagens, vídeos, animações, dentre outros.

4.1.2 Critérios Secundários

Na possibilidade de mais de um Sistema Gerenciador de Conteúdo apresentar de-sempenho satisfatório na análise comparativa de funcionalidades anteriormente descrita,faz-se também uma análise de outros aspectos relevantes à proposta, levando-se em con-sideração as necessidades da universidade. Juntamente com as funcionalidades de apoioà acessibilidade, esses aspectos formam o conjunto de critérios para seleção de SGC maisadequado para a gestão do portal. Tais critérios são listados e justificados abaixo:

∙ Curva de aprendizado: Uma vez que os futuros usuários da interface de admi-nistração do SGC possivelmente não estejam habituados ao uso de Sistemas Geren-ciadores de Conteúdo, é relevante que o sistema proposto tenha funcionalidades defácil uso e compreensão, a fim de facilitar a adesão ao mesmo.

∙ Segurança: Apesar de os conteúdos exibidos no portal serem de acesso público, éessencial que no back-end (administração do portal) o SGC mantenha protegidas asinformações e funcionalidades referentes à gestão do portal, garantindo a integridadedas notícias e páginas cadastradas no sistema.

∙ Comunidade de usuários ativos: Visando apoiar tanto o desenvolvimento dosistema (e eventuais manutenções) quanto sua utilização, a comunidade de usuáriosdo SGC auxilia em seu suporte, através de fóruns de discussões e demais plataformasque possibilitem a troca de experiência entre os usuários. Um número significativo

Page 24: Acessibilidade Web: um estudo de caso na Universidade ... · UNIVERSIDADEFEDERALDESÃOJOÃODEL-REI Ronan José Lopes Acessibilidade Web: um estudo de caso na Universidade Federal

de usuários nessa comunidade gera uma grande quantidade de material de apoio,ampliando as possíveis fontes de consultas por parte de usuários com dúvidas ouproblemas.

4.2 Promoção de Acessibilidade no Portal da UFSJ

4.2.1 Levantamento de Problemas de Acessibilidade

Para a promoção de acessibilidade web na UFSJ, o primeiro passo foi fazer umlevantamento das inadequações presentes no atual portal da universidade. Uma vez que averificação considera as páginas individualmente, selecionou-se um conjunto heterogêneode páginas do portal levando em consideração seu conteúdo, uma vez que a estruturabásica é a mesma para todas as páginas. Para a identificação desses erros, foram tomadoscomo referência os pontos de verificação das diretrizes do WCAG e do e-MAG. Essa veri-ficação foi apoiada pelo uso das ferramentas de avaliação automática Hera e o Avaliadore Simulador de Acessibilidade de Sítios (ASES).

Figura 11: Avaliador de Acessibilidade Hera

O Hera é uma ferramenta online e utiliza o modelo internacional (WCAG) paraverificação, tendo sua utilização e eficácia mostradas por (FREIRE et al., 2009) no tra-balho de análise quantitativa descrito nos trabalhos relacionados. O ASES, por sua vez,é um software desenvolvido pelo governo brasileiro para apoiar a adequação dos websi-tes com os requisitos de acessibilidade, suportando tanto o modelo brasileiro quanto ointernacional. A versão utilizada foi a primeira versão para Sistemas Operacionais Linux,uma vez que sua versão atual (2.0) estava em processo de atualização e ainda se mostravainstável.

Figura 12: Avaliador de Acessibilidade ASES

Page 25: Acessibilidade Web: um estudo de caso na Universidade ... · UNIVERSIDADEFEDERALDESÃOJOÃODEL-REI Ronan José Lopes Acessibilidade Web: um estudo de caso na Universidade Federal

Além da verificação automática, fez-se uso também da entrevista com usuários paralevantamento de erros. Os usuários foram entrevistados em seu ambiente de trabalho ou deuso cotidiano do computador pessoal, mediante a assinatura do termo de consentimentodisponível no Apêndice B. Na entrevista, além de perguntas abertas e fechadas, foramdesignadas tarefas a serem desempenhadas pelos usuários no portal da UFSJ, a fim deidentificar os principais obstáculos na navegação. As tarefas designadas, bem como asperguntas realizadas (juntamente com as respostas fornecidas) podem ser consultadasnos Apêndices C e D, respectivamente.

4.2.2 Estruturação e Implementação de Alterações

Os erros levantados na primeira fase do processo são apontados com base na visãodo usuário do sistema, também conhecido como front end. As alterações que devem serrealizadas, no entanto, se dão no back end da aplicação, que no caso em questão refere-seao servidor web que hospeda o portal (atualmente mantido pelo NTINF). Já o desenvol-vimento do novo portal se deu de forma independente em uma máquina com servidor weblocal, de forma que o resultado final obtido seja apresentado como proposta de adesãoefetiva ao NTINF, departamento responsável pelo website da universidade.

Na implementação a ser realizada, procurou-se manter o layout e demais aspectosestruturais do portal atual da universidade. Logo, a estrutura HTML das páginas, bemcomo folhas de estilos e scripts da codificação atual (fornecida pelo NTINF) podem serreaproveitados nessa implementação. O principal desafio na implementação consiste entãoem substituir as consultas ao banco de dados de notícias e páginas acadêmicas atuaispelas consultas ao banco do Sistema Gerenciador de Conteúdo, permitindo gerenciá-lasna interface de administração do sistema. Além disso, deve implementar-se também asdemais funções relacionadas ao portal (como busca, listagem e paginação de notícias),bem como funções de apoio à navegação.

Durante o desenvolvimento, utilizou-se um computador pessoal com Sistema Ope-racional Linux (Ubuntu 14.04). O servidor web local executado na máquina é o Apache2.4.7 e a linguagem PHP em sua quinta versão (5.5.9-1). Para armazenamento de da-dos e meta-dados dos SGC’s, optou-se pelo SGBD relacional MySQL, na versão 5.5.38.Sob estas configurações (comumente denominadas como ambiente LAMP - Linux ApacheMySQL PHP), foi possível fazer a instalação e configuração básica dos Sistemas Gerenci-adores de Conteúdos analisados neste estudo (com excessão do Plone, o qual requeriu ainstalação adicional do servidor web Zope).

1Disponível em: <http://www.nazly.me/getting-lamp-to-work-in-ubuntu-hardy> Acesso em out.2014.

Page 26: Acessibilidade Web: um estudo de caso na Universidade ... · UNIVERSIDADEFEDERALDESÃOJOÃODEL-REI Ronan José Lopes Acessibilidade Web: um estudo de caso na Universidade Federal

Figura 13: Ambiente LAMP no Sistema Operacional Ubuntu 14.041

4.2.3 Validação das Alterações

Para validar as alterações realizadas na etapa anterior deve-se, novamente, repetiro processo de levantamento de erros. O portal implementado deve, no entanto, estardisponível online para que as aplicações de avaliação tenham acesso ao mesmo. Para tal,utilizou-se o serviço de hospedagem grátis 1FreeHosting2, que não adiciona publicidadee atende aos requisitos necessários para o funcionamento do portal integrado ao SGC. Oendereço do portal foi registrado sob o domínio pixub3, configurado para não ser indexadoem máquinas de busca. Uma vez online, o gerenciamento do conteúdo está disponível aosusuários responsáveis, através do login no painel de administração por um usuário quepossua as devidas permissões.

Após o novo levantamento de erros, é possível analisar então os pontos de verifica-ção que o portal implementado não satisfez. Através da análise desses pontos, é possívelidentificar melhorias futuras a serem feitas na implementação. As etapas de implementa-ção e validação das alterações constituem então um processo iterativo, que pode se repetircom o intuito de solucionar gradativamente as inadequações presentes na página.

2http://www.1freehosting.com/3http://www.ufsj.pixub.com/

Page 27: Acessibilidade Web: um estudo de caso na Universidade ... · UNIVERSIDADEFEDERALDESÃOJOÃODEL-REI Ronan José Lopes Acessibilidade Web: um estudo de caso na Universidade Federal

5 Resultados

5.1 Proposta de Sistema Gerenciador de ConteúdoNa análise de proposta do Sistema Gerenciador de Conteúdo, foram analisadas

previamente as funcionalidades de suporte à acessibilidade descritas no capítulo anterior.Além de sua existência nativa no SGC, levou-se em consideração também uma busca nosrepositórios oficiais por plugins que provessem essas funcionalidades. Os resultados sãoapresentados na tabela 1 e como pode se observar, a maior parte das funcionalidades nãosão nativas dos sistemas. Por se tratarem de softwares de código aberto, existe um grandenúmero de plugins desenvolvidos não somente pela empresa responsável, mas também porterceiros.

Tabela 1: Funcionalidades Presentes nos SGC’s

Funcionalidade SysWeb WordPress Joomla Drupal PloneAlto Contraste - Plugin1 Plugin2 Plugin3 -Tamanho da Fonte Sim Plugin1 Plugin2 Plugin4 -Teclas de Atalho - Plugin5 Sim Plugin6 SimIdentificação de Idioma Utilizado - Sim Sim - SimFerramenta de Zoom - Plugin7 Plugin2 - -

Ainda analisando os resultados, observa-se que o atual gerenciador de conteúdodo portal (SysWeb) obteve o pior desempenho, dispondo apenas da funcionalidade detamanho de fonte. Dentre os sistemas estudados, os que se destacaram no critério analisadoforam Wordpress e Joomla, que contêm as 5 funcionalidades analisadas. A definição daproposta, fica então, dependente dos critérios secundários, conforme definidos no capítuloanterior. Para tal, o documento disponbilizado pelo (GOVERNO ELETRÔNICO, 2012)contém um comparativo que permite analisar as funcionalidades descritas. Os resultadossão apresentados na tabela 2.

Ao analisar os aspectos propostos, comparando-se diretamente os dois SGC’s,observa-se que o Wordpress apresenta um desempenho moderadamente superior. Ape-sar de ambos se mostrarem satisfatórios no suporte a funcionalidades de acessibilidadee possuírem comunidades de usuários atuantes, no quesito de curva de aprendizagem o

1https://wordpress.org/plugins/wp-accessibility/2http://extensions.joomla.org/extensions/style-a-design/accessibility3https://drupal.org/project/high_contrast4https://drupal.org/project/text_resize5http://wordpress.org/plugins/accessibility-access-keys/6https://drupal.org/project/keyboard_shortcut7https://wordpress.org/plugins/zoom-widget/

Page 28: Acessibilidade Web: um estudo de caso na Universidade ... · UNIVERSIDADEFEDERALDESÃOJOÃODEL-REI Ronan José Lopes Acessibilidade Web: um estudo de caso na Universidade Federal

Tabela 2: Critérios Secundários e Informações Gerais

Característica WordPress JoomlaVersão avaliada 3.3.2 1.5

Curva de Apren-dizado

Baixa para alimentação e funci-onalidades básicas. A criação detemas e Plugins exige conheci-mento na área.

Média.

Segurança

A versão 2.1.1 é a mais vulnerá-vel.Cuidados básicos na criação dobanco de dados e escolha de Idse senhas de administração resol-vem muitas vulnerabilidades.Outros plugins que tornam o WPmais seguro são os Better WP Se-curity e o WP Security Scan.

A versão 1.5 tem vulnerabilida-des críticas. As extensões são oponto fraco do SGC, devendo seter especial atenção a elas.A Comunidade mantém umgrupo de segurança, que podeauxiliar nesse quesito.

Comunidade deUsuários

Atuante/estabelecida.http://br.wordpress.org/(comunidade em português)

Atuante/estabelecida.http://www.joomla.com.br/Joomla Brasil

Wordpress se mostrou mais apropriado, tendo seu uso mais facilmente assimilável pe-los usuários administradores do conteúdo. Observou-se ainda que, no quesito segurança,ambos apresentaram vulnerabilidades nas versões citadas, requisitando a atenção do de-senvolvedor. No entanto, a utilização das versões mais recentes dos sistemas, juntamentecom a instalação dos plugins e o suporte da comunidade de segurança vêm prover umsistema mais seguro.

Por fim, é válido ressaltar ainda que, apesar de o estudo apontar o Wordpresscomo Sistema Gerenciador de Conteúdo acessível mais indicado, esse estudo é baseadono contexto e leva em consideração o cenário da aplicação (UFSJ). Em outros contex-tos, deve considerar-se analisar outros possíveis aspectos relevantes, como por exemplousabilidade, arquitetura do SGC, existência de outras funcionalidades específicas, dentreoutros. Ademais, a indicação do Wordpress não invalida o uso dos demais SGC’s, princi-palmente levando-se em consideração sua característica de sistemas de código aberto soba licença GNU/GPL, que permite que o desenvolvedor adapte a aplicação para atenderos requisitos desejados.

5.2 Promoção de Acessibilidade no Portal

5.2.1 Levantamento de Problemas de Acessibilidade

Os erros de acessibilidade foram levantados quantativamente pelos softwares deavaliação automática ASES e Hera, apresentados na metodologia. Na primeira avaliação,executada pelo ASES em sua versão 1.0 para sistemas operacionais Linux, utilizou-se omodelo nacional (e-MAG 2.0) como referência. A avaliação foi realizada em um conjunto

Page 29: Acessibilidade Web: um estudo de caso na Universidade ... · UNIVERSIDADEFEDERALDESÃOJOÃODEL-REI Ronan José Lopes Acessibilidade Web: um estudo de caso na Universidade Federal

de páginas heterogêneo quanto ao seu conteúdo, uma vez que a estrutura geral das páginasdo portal é a mesma, variando somente o seu conteúdo. Para cada prioridade do modelo,foram apresentados o índice de erros verificados em relação ao número total de pontosde verificação. O resultado é exibido na tabela 3 e uma descrição detalhada no ApêndiceA. É válido ressaltar que nem todos os pontos podem ser verificados automaticamentepela ferramenta, devido à característica subjetiva de alguns PVs que somente podem serverificados manualmente.

Tabela 3: Número relativos de erros de acessibilidade do portal atual (ASES)

PáginaPontos de Verificação

Prioridade 1 Prioridade 2 Prioridade 3Número de Erros Número de Erros Número de Erros

Busca de Notícias 2/24(8,33%) 3/19(15,78%) 1/14(7,14%)Inverno Cultural 2/24(8,33%) 3/19(15,78%) 1/14(7,14%)Mais Notícias 2/24(8,33%) 3/19(15,78%) 1/14(7,14%)Mapa do Site 2/24(8,33%) 3/19(15,78%) 1/14(7,14%)Página de Notícia 2/24(8,33%) 4/19(21,05%) 1/14(7,14%)Página Inicial 2/24(8,33%) 4/19(21,05%) 1/14(7,14%)Vestibular 2/24(8,33%) 3/19(15,78%) 1/14(7,14%)Vídeo Institucional 4/24(16,66%) 3/19(15,78%) 1/14(7,14%)

Conforme pode se observar na tabela, o índice de erros oscila muito pouco entre aspáginas e apresenta uma porcentagem relativamente baixa em relação ao total de pontosdo modelo. Dentre as páginas que oscilaram o índice de erros na verificação, observa-sea página inicial e a página de notícia, que não se adequaram ao PV 2.10 de prioridade 2(referente ao uso de cabeçalhos definidos pela tag HTML <h> em sequência lógica h1-h6).A página do vídeo institucional apresenta ainda um índice maior de erros na prioridade1, devido ao uso de um frame que contém o vídeo em questão mas que, no entanto, nãosegue os padrões estabelecidos (PVs 1.16 e 1.17).

A outra avaliação, efetuada pela ferramenta Hera em sua versão 2.1, foi baseada nomodelo internacional (WCAG 1.0). Essa avaliação foi realizada com o intuito de ratificara primeira e se deu somente na página inicial da universidade, uma vez que as demaispáginas compartilham a mesma estrutura geral. Ademais, a avaliação anterior mostrouque os índices não oscilaram significativamente entre as páginas analisadas. A exibição deresultados do Hera difere-se do ASES, mostrando os erros como pontos "não adequados"esubdividindo os demais pontos que puderam ser verificados em "adequados"e "não aplicá-veis"(pontos de verificação que referem-se a elementos não presentes na página). A tabela4 apresenta o resultado quantitativo da verificação, cuja descrição detalhada também estádisponível no Apêndice A.

Verifica-se pela avaliação feita que grande parte dos pontos analisados referem-sea medidas não aplicáveis, pertinentes a elementos não presentes na página (como tabelas,

Page 30: Acessibilidade Web: um estudo de caso na Universidade ... · UNIVERSIDADEFEDERALDESÃOJOÃODEL-REI Ronan José Lopes Acessibilidade Web: um estudo de caso na Universidade Federal

Tabela 4: Resultado quantitativo da avaliação do portal atual (Hera)

Prioridade Adequados Não Adequados Não AplicáveisPrioridade 1 0 2/8(25%) 6/8(75%)Prioridade 2 1/12(8,3%) 9/12(75%) 2/12(16,7%)Prioridade 3 0 4/8(50%) 4/8(50%)

multimídias, dentre outros tipos de conteúdo). O resultado se mostrou negativo pois,apesar desse elevado número de pontos não aplicáveis, somente um PV dentre todosfoi avaliado como adequado. Ademais, constatou-se um elevado índice de inadequações,principalmente para os pontos de verificação de prioridade 2. Observa-se ainda que onúmero relativo de inadequações é significativamente superior à primeira avaliação. Isso sedeve principalmente ao fato de que a porcentagem obtida na avaliação realizada pelo ASESrefere-se ao total de pontos de verificação de cada prioridade do modelo. Na avaliaçãorealizada pelo Hera, entretanto, o índice é relativo ao total de pontos que puderam serverificados pela avaliação automática.

Em uma análise mais direta dos problemas de acessibilidade do portal, as entre-vistas com os usuários (disponíveis no Apêndice D) levantaram relatos de travamentosdurante a leitura das páginas do portal, especialmente com conteúdo não-textual (ima-gem/vídeo). Ainda quanto a esse tipo de conteúdo, a ausência de descrição textual alter-nativa (atributo HTML "alt") dificulta a compreensão do elemento, uma vez que o usuáriocom deficiência visual não tem a percepção adequada da mídia exibida. Esses problemasocorrem principalmente nas páginas de notícias, onde concentra-se o maior uso de imagense vídeos.

Outros problemas levantados nas entrevistas referem-se à utilização de sistemasespecíficos da universidade, que têm sua navegação dificultada por botões que não podemser acessados pelo teclado e CAPTCHAs (Completely Automated Public Turing test totell Computers and Humans Apart) que apresentam exibição somente visual. Apesar denão ser o foco deste trabalho, tais problemas merecem atenção e sua devida solução emtrabalhos futuros, uma vez que esses sistemas da universidade também são utilizados poralunos e funcionários com necessidades especiais.

5.2.2 Implementação do Portal Acessível

Uma vez identificado o Sistema Gerenciador de Conteúdo a ser utilizado, o processode implementação consistiu basicamente em substituir as funcionalidades implementadasdo portal atual, fazendo a integração com o SGC WordPress. Portanto, a exibição, lis-tagem, busca e demais funções referentes às páginas e notícias foram reimplementadas.As funções para recuperação de páginas/notícias e meta-dados cadastrados no sistema,bem como sua assinatura e exemplos de uso foram consultados na página de referência

Page 31: Acessibilidade Web: um estudo de caso na Universidade ... · UNIVERSIDADEFEDERALDESÃOJOÃODEL-REI Ronan José Lopes Acessibilidade Web: um estudo de caso na Universidade Federal

de funções do WordPress8.

A integração do portal com o WordPress permitiu então o gerenciamento do con-teúdo dinâmico do portal pelo painel de administração do sistema. A figura 14 mostraa tela de listagem das notícias cadastradas no portal, intituladas no sistema de "posts".O sistema permite fazer as operações básicas de cadastro, alteração ou exclusão de notí-cias. Para o cadastro e alteração, o sistema dispõe de uma interface de uso comum paraedição de conteúdo (com opções de inserção de alinhamento de texto, figuras, dentre ou-tros), que pode ser efetuado também através da manipulação do código-fonte HTML. Aspáginas acadêmicas do portal (como "A UFSJ", "Iniciação Científica"e "Vestibular"), tam-bém gerenciadas pelo WordPress, dispõem de um menu com as mesmas funcionalidadesdescritas.

Figura 14: Painel de Administração das Notícias

O gerenciamento do conteúdo pelo Wordpress possibilita ainda a utilização derecursos adicionais comuns a Sistemas Gerenciadores de Conteúdo. Através da interface, épossível por exemplo, definir a visibilidade de uma postagem (pública, protegida por senhaou privada), palavras-chaves da postagem (que auxiliam na funcionalidade de busca),imagem destacada (que terá sua miniatura associada à notícia), além da possibilidade dainstalação de extensões para prover outras funcionalidades desejadas. A tela de edição deconteúdo juntamente com as funcionalidades descritas é exibida na figura 15.

Durante o processo de implementação, foram adicionadas ao portal as funciona-lidades levantadas no estudo apresentado anteriormente. Além de auxiliar a navegação,os plugins que proveem essas funcionalides adicionam opções de configurações de aces-sibilidade no painel de administração do WordPress. Buscou-se ainda na implementaçãocorrigir os erros levantados na etapa anterior, referentes à estrutura do código-fonte doportal vigente da universidade. As alterações em questão não afetam a estrutura e fun-cionalidades tradicionais do portal, mas respeitam padrões que proporcionam um melhorfuncionamento dos leitores de tela. O resultado da implementação pode ser visualizadona figura 16.

8http://codex.wordpress.org/Function_Reference

Page 32: Acessibilidade Web: um estudo de caso na Universidade ... · UNIVERSIDADEFEDERALDESÃOJOÃODEL-REI Ronan José Lopes Acessibilidade Web: um estudo de caso na Universidade Federal

Figura 15: Página de Edição da Notícia

Figura 16: Portal implementado com o SGC WordPress

É possível notar à esquerda da tela uma barra com três das funcionalidades imple-mentadas, que referem-se à ativação de temas com alto contraste, escala de cinza (parausuários com problemas de identificação de cores, como daltonismo) e alargamento dafonte. As funcionalidades de identificação de idioma utilizado e teclas de atalho não têmrepresentação visual. A ferramenta de zoom também está disponível, podendo ser inse-rida nas páginas desejadas através do painel de administração do WordPress. A figura 17mostra o aspecto do portal após a ativação do tema de alto contraste.

Quanto aos demais aspectos do portal, pode se observar que a implementaçãopreservou o seu layout e estrutura. Logo, para o usuário que não faz uso de nenhumaferramenta assistiva durante a navegação, não há alterações significativas em relação ao

Page 33: Acessibilidade Web: um estudo de caso na Universidade ... · UNIVERSIDADEFEDERALDESÃOJOÃODEL-REI Ronan José Lopes Acessibilidade Web: um estudo de caso na Universidade Federal

Figura 17: Portal implementado em alto contraste

portal atualmente vigente. Para os usuários que fazem uso de leitores de tela e outrosagentes de software, entretanto, espera-se que a melhor adequação do portal implementadoàs normas de acessibilidade torne a navegação mais fluente, sem a ocorrência de tantostravamentos como relataram os usuários entrevistados.

5.2.3 Validação da Implementação

A última etapa do processo de promoção de acessibilidade na UFSJ consiste, enfim,na verificação da validade da implementação utilizando o Sistema Gerenciador de Con-teúdo Proposto. Para tal, faz-se necessário um novo levantamento de erros, tendo-se comoalvo as mesmas páginas analisadas anteriormente, contudo implementadas utilizando ogerenciamento de conteúdo do WordPress. A primeira avaliação novamente utiliza o soft-ware ASES, com base no modelo nacional (e-MAG 2.0). Os resultados são exibidos natabela 5, sob o mesmo formato apresentado anteriormente.

Tabela 5: Número relativos de erros de acessibilidade do portal utilizando WordPress (ASES)

PáginaPontos de Verificação

Prioridade 1 Prioridade 2 Prioridade 3Número de Erros Número de Erros Número de Erros

Busca de Notícias 0 1/19(5,26%) 0Inverno Cultural 0 1/19(5,26%) 0Mais Notícias 0 1/19(5,26%) 0Mapa do Site 0 1/19(5,26%) 0Página de Notícia 0 1/19(5,26%) 0Página Inicial 0 1/19(5,26%) 0Vestibular 0 1/19(5,26%) 0Vídeo Institucional 0 1/19(5,26%) 0

Page 34: Acessibilidade Web: um estudo de caso na Universidade ... · UNIVERSIDADEFEDERALDESÃOJOÃODEL-REI Ronan José Lopes Acessibilidade Web: um estudo de caso na Universidade Federal

Pode se verificar que, segundo a nova avaliação, os problemas levantados anteri-ormente foram majoritariamente solucionados na nova implementação. O único ponto deverificação que ainda se mostrou irregular foi o PV 2.2, variando-se o número de ocor-rências para cada página. O PV 2.2 refere-se ao uso de medidas relativas e visa mantero tamanho proporcional entre os elementos da página, independentemente do dispositivoutilizado. Em trabalhos futuros, sua correção demandaria alterações tanto na estruturada página (folha de estilos) quanto nos conteúdos presentes que utilizassem medidas ab-solutas.

Na reavaliação realizada pelo Hera, também mantiveram-se os padrões utilizadosanteriormente para avaliar o portal atual. Conforme pode se verificar na tabela 6, nova-mente a maior parte dos PV analisados pela ferramenta não são aplicáveis à página. Noentanto, verifica-se que o índice de erros levantados decaiu significativamente em relação àavaliação anterior, devido às alterações da nova implementação. Tais alterações, apesar dereduzirem significativamente os PVs com erros, não necessariamente os classificam comoadequados. Isso se deve ao fato de que algumas dessas alterações consistem na substi-tuição dos elementos causadores de erros por equivalentes e uma vez que o PV referia-seao elemento substituído, esse torna-se não aplicável, contudo não causando problemas deacessibilidade.

Tabela 6: Resultado quantitativo da avaliação do portal utilizando WordPress (Hera)

Prioridade Adequados Não-Adequados Não AplicáveisPrioridade 1 1/10(10%) 1/10(10%) 8/10(80%)Prioridade 2 6/11(54,6%) 2/11(18,1%) 3/11(27,3%)Prioridade 3 3/8(37,5%) 1/8(12,5%) 4/8(50%)

Nos gráficos das figuras 18, 19 e 20 pode se observar uma comparação dos índicesrelativos de erros encontrados nas duas versões do portal. É possível constatar que, paratodas as prioridades, a nova versão do portal se mostrou mais adequada que a versãoanterior, sobretudo para os PVs de prioridade 2, que apresentaram o maior índice deerros anteriormente. Os pontos de verificação que ainda se mostram incorretos na novaversão do portal são listados abaixo:

∙ Ponto 3.2: Crie documentos validando a notação com a gramática formal publi-cada. (Prioridade 2)

∙ Ponto 3.4: Use unidades relativas em vez de absolutas nos valores dos atributos dalinguagem de notação e valores das propriedades das folhas de estilo. (Prioridade 2)

∙ Ponto 6.3: Certifique-se que as páginas são usáveis quando scripts, applets, ououtros objetos programáveis se encontram desativados ou não são suportados. (Pri-oridade 1)

Page 35: Acessibilidade Web: um estudo de caso na Universidade ... · UNIVERSIDADEFEDERALDESÃOJOÃODEL-REI Ronan José Lopes Acessibilidade Web: um estudo de caso na Universidade Federal

(a) Avaliação do portal atual (b) Avaliação do portal implementado

Figura 18: Validação da implementação - Prioridade 1

(a) Avaliação do portal atual (b) Avaliação do portal implementado

Figura 19: Validação da implementação - Prioridade 2

(a) Avaliação do portal atual (b) Avaliação do portal implementado

Figura 20: Validação da implementação - Prioridade 3

Page 36: Acessibilidade Web: um estudo de caso na Universidade ... · UNIVERSIDADEFEDERALDESÃOJOÃODEL-REI Ronan José Lopes Acessibilidade Web: um estudo de caso na Universidade Federal

A irregularidade do PV 3.4 é equivalente à da reavaliação anterior e consiste no usode unidades de medidas absolutas, quando sugere-se o uso de medidas relativas. O ponto3.2, por sua vez, refere-se à irregularidade do uso do seletor CSS "@-moz-document url-prefix"que não faz parte da documentação padrão, mas é específica do navegador MozillaFirefox9. Apesar da ocorrência, o uso do seletor se fez necessário somente para ocultaro botão de tema do escala de cinza (que atualmente não é suportado pelo navegador) eportanto não altera demais aspectos da página. O PV 6.3, por fim, se mostrou irregularpelo script da atual funcionalidade de tamanho de fonte do portal. Uma vez que buscoumanter-se a estrutura do portal atual e a funcionalidade que causou o erro trata-se de umrecurso de acessibilidade, optou-se por mantê-la.

Pode se verificar através de ambas as reavaliações (ASES e Hera) que a nova imple-mentação proposta se mostra mais acessível aos usuários, além de contar com os recursosdisponíveis pelo SGC WordPress que não estão presentes no atual gerenciador de con-teúdo da universidade (SysWeb). Ademais, durante o processo iterativo de implementaçãoe validação, ratificou-se a equivalência entre uma quantidade significativa de PVs dos mo-delos de acessibilidade mostrada por mostrada anteriormente por (ROCHA; DUARTE,2012). Tal equivalência foi confirmada verificando-se que as alterações realizadas a fimde solucionar os problemas levantados na primeira avaliação refletiram positivamente noresultado da segunda avaliação.

Finalmente, para efetuar a migração do código-fonte do portal atualmente vigentepara o implementado faz-se necessário a instalação do SGDB MySQL, bem como a criaçãode uma tabela destinada ao armazenamento de metadados do WordPress. Além disso, faz-se necessário também o cadastramento no banco das páginas e notícias já existentes, quepode ser feito conforme alguma das sugestões abaixo:

∙ Manualmente: a forma mais trivial e no entanto mais trabalhosa de se fazer o ca-dastramento das páginas e notícias. Na implementação realizada em máquina local,cadastrou-se somente para fins de testes cerca de 50 notícias e todas as páginas doportal. Levando-se em consideração que existem (até o presente momento) mais de600 notícias sendo exibidas no portal, apesar de possível, este torna-se um métodoinviável.

∙ Script de migração do banco atual para o WordPress: trata-se de uma forma maiságil de fazer o cadastro, dada através da implementação de um script que recupereas notícias do atual SGDB (SQLServer) para a tabela do WordPress no MySQL.A restrição, entretanto, é que a consulta deve ser realizada no servidor do NTINFe portanto, somente desenvolvedores com permissão de acesso podem utilizar essemétodo.

9https://www.mozilla.org/pt-BR/

Page 37: Acessibilidade Web: um estudo de caso na Universidade ... · UNIVERSIDADEFEDERALDESÃOJOÃODEL-REI Ronan José Lopes Acessibilidade Web: um estudo de caso na Universidade Federal

∙ Script para coleta: outra forma automática que agilizaria esse processo consiste emfazer a coleta das notícias, páginas e seus metadados através de um script (webcra-wling). Uma vez que a visibilidade das páginas e notícias é pública, não se tem arestrição do método anterior. Contudo, a implementação torna-se mais complexa,pois além da extração automática dos dados, deve-se fazer o tratamento tambémdas requisições ao servidor, de forma que estas não atinjam seu limite e a conexãoseja fechada.

Page 38: Acessibilidade Web: um estudo de caso na Universidade ... · UNIVERSIDADEFEDERALDESÃOJOÃODEL-REI Ronan José Lopes Acessibilidade Web: um estudo de caso na Universidade Federal

Conclusão

O estudo aqui desenvolvido, bem como os resultados obtidos, mostraram que é viá-vel a utilização de Sistemas Gerenciadores de Conteúdo para promoção de acessibilidadeem websites de característica dinâmica. Como tem crescido o número de plataformas queonde faz-se necessário o auxílio na gestão do conteúdo, a validação do uso de um SGCpara conteúdo acessível vem apoiar o desenvolvimento de aplicações onde a acessibilidadeé requisito.

Além dos websites de administração pública, a promoção de acessibilidade web édesejável mesmo em contextos onde esta não é condição obrigatória. Além do cumprimentode responsabilidade social, tornar acessível uma página na internet amplia o público leitordo conteúdo publicado. Ademais, com a característica dinâmica e as novas plataformas quesurgem na web, estes usuários não são apenas leitores passivos, mas também interagemcom esses sistemas e geram conteúdo a partir dessas interações.

Para trabalhos futuros, sugere-se a correção dos erros de acessibilidade remanes-centes no portal. Além disso, a promoção de acessibilidade web deve estender-se tambémaos sistemas internos da universidade, que também são constantemente utilizados poralunos e funcionários. Durante o trabalho desenvolvido identificou-se também, através doestudo para implementação, que o código-fonte do portal atual se apresenta mal estrutu-rado, uma vez que está pouco modularizado. Faz-se necessário então um refactoring nessecódigo, a fim de auxiliar futuras manutenções e alterações.

Page 39: Acessibilidade Web: um estudo de caso na Universidade ... · UNIVERSIDADEFEDERALDESÃOJOÃODEL-REI Ronan José Lopes Acessibilidade Web: um estudo de caso na Universidade Federal

APÊNDICE A – Avaliação de Acessibilidade -Portal Atual

A.1 Software ASESApresenta-se os pontos de verificação que mostraram-se inadequados para as prin-

cipais páginas da UFSJ de acordo com a avaliação de acessibilidade do software ASES,baseando-se no documento nacional (e-MAG). Nas tabelas apresentadas, a coluna "Ocor-rências"indica a quantidade de vezes que ocorreu a inadequação com o respectivo pontode verificação em questão.

A.1.1 Busca de Notícias

Tabela 7: Erros de Acessibilidade na Página de Buscas do Portal

P.V. Descrição Ocorrências

1.1Identificar o principal idioma utilizado nos documentos. O idi-oma do documento deve ser especificado na expressão HTML.(Prioridade 1)

1

1.11

Fornecer um equivalente textual a cada imagem (isso abrange:representações gráficas do texto, incluindo símbolos, GIFs ani-mados, imagens utilizadas como sinalizadores de pontos deenumeração, espaçadores e botões gráficos), para tanto, utiliza-se o atributo “alt” ou “longdesc” em cada imagem. (Prioridade1)

10

2.2

Utilizar unidades relativas, e não absolutas, nos valores dosatributos de tabelas, textos, etc. Em CSS não use valores ab-solutos como “pt” ou “px” e sim valores relativos como o “em”,“ex” ou em porcentagem. (Prioridade 2)

3

2.14Incluir caracteres pré-definidos de preenchimento nas caixasde edição e nas áreas de texto, até que os navegadores tratemcorretamente os controles vazios. (Prioridade 2)

1

2.15

Usar o elemento “label” juntamente com o atributo “id” paraassociar os rótulos aos respectivos controles dos formulários.Assim, os leitores de tela associarão os elementos do formu-lário de forma correta. Usando o comando “label” as pessoasque usam leitores de tela não terão problemas ao ler o formu-lário. Caso haja grupos de informação, controles, etc, a estesdevem estar devidamente diferenciados, seja por meio de espa-çamento, localização ou elementos gráficos. (Prioridade 2)

1

3.1 Não usar elementos considerados ultrapassados pelo W3C.(Prioridade 3)

5

Page 40: Acessibilidade Web: um estudo de caso na Universidade ... · UNIVERSIDADEFEDERALDESÃOJOÃODEL-REI Ronan José Lopes Acessibilidade Web: um estudo de caso na Universidade Federal

A.1.2 Inverno Cultural

Tabela 8: Erros de Acessibilidade na Página de "Inverno Cultural"do Portal

P.V. Descrição Ocorrências

1.1Identificar o principal idioma utilizado nos documentos. O idi-oma do documento deve ser especificado na expressão HTML.(Prioridade 1)

1

1.11

Fornecer um equivalente textual a cada imagem (isso abrange:representações gráficas do texto, incluindo símbolos, GIFs ani-mados, imagens utilizadas como sinalizadores de pontos deenumeração, espaçadores e botões gráficos), para tanto, utiliza-se o atributo “alt” ou “longdesc” em cada imagem. (Prioridade1)

10

2.2

Utilizar unidades relativas, e não absolutas, nos valores dosatributos de tabelas, textos, etc. Em CSS não use valores ab-solutos como “pt” ou “px” e sim valores relativos como o “em”,“ex” ou em porcentagem. (Prioridade 2)

3

2.14Incluir caracteres pré-definidos de preenchimento nas caixasde edição e nas áreas de texto, até que os navegadores tratemcorretamente os controles vazios. (Prioridade 2)

1

2.15

Usar o elemento “label” juntamente com o atributo “id” paraassociar os rótulos aos respectivos controles dos formulários.Assim, os leitores de tela associarão os elementos do formu-lário de forma correta. Usando o comando “label” as pessoasque usam leitores de tela não terão problemas ao ler o formu-lário. Caso haja grupos de informação, controles, etc, a estesdevem estar devidamente diferenciados, seja por meio de espa-çamento, localização ou elementos gráficos. (Prioridade 2)

1

3.1 Não usar elementos considerados ultrapassados pelo W3C.(Prioridade 3)

5

Page 41: Acessibilidade Web: um estudo de caso na Universidade ... · UNIVERSIDADEFEDERALDESÃOJOÃODEL-REI Ronan José Lopes Acessibilidade Web: um estudo de caso na Universidade Federal

A.1.3 Mais Notícias

Tabela 9: Erros de Acessibilidade na Página "Mais Notícias"do Portal

P.V. Descrição Ocorrências

1.1Identificar o principal idioma utilizado nos documentos. O idi-oma do documento deve ser especificado na expressão HTML.(Prioridade 1)

1

1.11

Fornecer um equivalente textual a cada imagem (isso abrange:representações gráficas do texto, incluindo símbolos, GIFs ani-mados, imagens utilizadas como sinalizadores de pontos deenumeração, espaçadores e botões gráficos), para tanto, utiliza-se o atributo “alt” ou “longdesc” em cada imagem. (Prioridade1)

10

2.2

Utilizar unidades relativas, e não absolutas, nos valores dosatributos de tabelas, textos, etc. Em CSS não use valores ab-solutos como “pt” ou “px” e sim valores relativos como o “em”,“ex” ou em porcentagem. (Prioridade 2)

3

2.14Incluir caracteres pré-definidos de preenchimento nas caixasde edição e nas áreas de texto, até que os navegadores tratemcorretamente os controles vazios. (Prioridade 2)

1

2.15

Usar o elemento “label” juntamente com o atributo “id” paraassociar os rótulos aos respectivos controles dos formulários.Assim, os leitores de tela associarão os elementos do formu-lário de forma correta. Usando o comando “label” as pessoasque usam leitores de tela não terão problemas ao ler o formu-lário. Caso haja grupos de informação, controles, etc, a estesdevem estar devidamente diferenciados, seja por meio de espa-çamento, localização ou elementos gráficos. (Prioridade 2)

1

3.1 Não usar elementos considerados ultrapassados pelo W3C.(Prioridade 3)

5

Page 42: Acessibilidade Web: um estudo de caso na Universidade ... · UNIVERSIDADEFEDERALDESÃOJOÃODEL-REI Ronan José Lopes Acessibilidade Web: um estudo de caso na Universidade Federal

A.1.4 Mapa Estrutural

Tabela 10: Erros de Acessibilidade na Página "Mapa Estrutural"do Portal

P.V. Descrição Ocorrências

1.1Identificar o principal idioma utilizado nos documentos. O idi-oma do documento deve ser especificado na expressão HTML.(Prioridade 1)

1

1.11

Fornecer um equivalente textual a cada imagem (isso abrange:representações gráficas do texto, incluindo símbolos, GIFs ani-mados, imagens utilizadas como sinalizadores de pontos deenumeração, espaçadores e botões gráficos), para tanto, utiliza-se o atributo “alt” ou “longdesc” em cada imagem. (Prioridade1)

10

2.2

Utilizar unidades relativas, e não absolutas, nos valores dosatributos de tabelas, textos, etc. Em CSS não use valores ab-solutos como “pt” ou “px” e sim valores relativos como o “em”,“ex” ou em porcentagem. (Prioridade 2)

3

2.14Incluir caracteres pré-definidos de preenchimento nas caixasde edição e nas áreas de texto, até que os navegadores tratemcorretamente os controles vazios. (Prioridade 2)

1

2.15

Usar o elemento “label” juntamente com o atributo “id” paraassociar os rótulos aos respectivos controles dos formulários.Assim, os leitores de tela associarão os elementos do formu-lário de forma correta. Usando o comando “label” as pessoasque usam leitores de tela não terão problemas ao ler o formu-lário. Caso haja grupos de informação, controles, etc, a estesdevem estar devidamente diferenciados, seja por meio de espa-çamento, localização ou elementos gráficos. (Prioridade 2)

1

3.1 Não usar elementos considerados ultrapassados pelo W3C.(Prioridade 3)

5

Page 43: Acessibilidade Web: um estudo de caso na Universidade ... · UNIVERSIDADEFEDERALDESÃOJOÃODEL-REI Ronan José Lopes Acessibilidade Web: um estudo de caso na Universidade Federal

A.1.5 Página de Notícia

Tabela 11: Erros de Acessibilidade na Página de Buscas do Portal

P.V. Descrição Ocorrências

1.1Identificar o principal idioma utilizado nos documentos. O idi-oma do documento deve ser especificado na expressão HTML.(Prioridade 1)

1

1.11

Fornecer um equivalente textual a cada imagem (isso abrange:representações gráficas do texto, incluindo símbolos, GIFs ani-mados, imagens utilizadas como sinalizadores de pontos deenumeração, espaçadores e botões gráficos), para tanto, utiliza-se o atributo “alt” ou “longdesc” em cada imagem. (Prioridade1)

10

2.2

Utilizar unidades relativas, e não absolutas, nos valores dosatributos de tabelas, textos, etc. Em CSS não use valores ab-solutos como “pt” ou “px” e sim valores relativos como o “em”,“ex” ou em porcentagem. (Prioridade 2)

3

2.10 Utilize elementos de cabeçalho de forma lógica, organizando oconteúdo de acordo com uma hierarquia. (Prioridade 2)

1

2.14Incluir caracteres pré-definidos de preenchimento nas caixasde edição e nas áreas de texto, até que os navegadores tratemcorretamente os controles vazios. (Prioridade 2)

1

2.15

Usar o elemento “label” juntamente com o atributo “id” paraassociar os rótulos aos respectivos controles dos formulários.Assim, os leitores de tela associarão os elementos do formu-lário de forma correta. Usando o comando “label” as pessoasque usam leitores de tela não terão problemas ao ler o formu-lário. Caso haja grupos de informação, controles, etc, a estesdevem estar devidamente diferenciados, seja por meio de espa-çamento, localização ou elementos gráficos. (Prioridade 2)

1

3.1 Não usar elementos considerados ultrapassados pelo W3C.(Prioridade 3)

5

Page 44: Acessibilidade Web: um estudo de caso na Universidade ... · UNIVERSIDADEFEDERALDESÃOJOÃODEL-REI Ronan José Lopes Acessibilidade Web: um estudo de caso na Universidade Federal

A.1.6 Página Inicial

Tabela 12: Erros de Acessibilidade na Página Inicial do Portal

P.V. Descrição Ocorrências

1.1Identificar o principal idioma utilizado nos documentos. O idi-oma do documento deve ser especificado na expressão HTML.(Prioridade 1)

1

1.11

Fornecer um equivalente textual a cada imagem (isso abrange:representações gráficas do texto, incluindo símbolos, GIFs ani-mados, imagens utilizadas como sinalizadores de pontos deenumeração, espaçadores e botões gráficos), para tanto, utiliza-se o atributo “alt” ou “longdesc” em cada imagem. (Prioridade1)

17

2.2

Utilizar unidades relativas, e não absolutas, nos valores dosatributos de tabelas, textos, etc. Em CSS não use valores ab-solutos como “pt” ou “px” e sim valores relativos como o “em”,“ex” ou em porcentagem. (Prioridade 2)

3

2.10 Utilize elementos de cabeçalho de forma lógica, organizando oconteúdo de acordo com uma hierarquia. (Prioridade 2)

1

2.14Incluir caracteres pré-definidos de preenchimento nas caixasde edição e nas áreas de texto, até que os navegadores tratemcorretamente os controles vazios. (Prioridade 2)

1

2.15

Usar o elemento “label” juntamente com o atributo “id” paraassociar os rótulos aos respectivos controles dos formulários.Assim, os leitores de tela associarão os elementos do formu-lário de forma correta. Usando o comando “label” as pessoasque usam leitores de tela não terão problemas ao ler o formu-lário. Caso haja grupos de informação, controles, etc, a estesdevem estar devidamente diferenciados, seja por meio de espa-çamento, localização ou elementos gráficos. (Prioridade 2)

1

3.1 Não usar elementos considerados ultrapassados pelo W3C.(Prioridade 3)

5

Page 45: Acessibilidade Web: um estudo de caso na Universidade ... · UNIVERSIDADEFEDERALDESÃOJOÃODEL-REI Ronan José Lopes Acessibilidade Web: um estudo de caso na Universidade Federal

A.1.7 Vestibular

Tabela 13: Erros de Acessibilidade na Página "Vestibular"do Portal

P.V. Descrição Ocorrências

1.1Identificar o principal idioma utilizado nos documentos. O idi-oma do documento deve ser especificado na expressão HTML.(Prioridade 1)

1

1.11

Fornecer um equivalente textual a cada imagem (isso abrange:representações gráficas do texto, incluindo símbolos, GIFs ani-mados, imagens utilizadas como sinalizadores de pontos deenumeração, espaçadores e botões gráficos), para tanto, utiliza-se o atributo “alt” ou “longdesc” em cada imagem. (Prioridade1)

10

2.2

Utilizar unidades relativas, e não absolutas, nos valores dosatributos de tabelas, textos, etc. Em CSS não use valores ab-solutos como “pt” ou “px” e sim valores relativos como o “em”,“ex” ou em porcentagem. (Prioridade 2)

4

2.14Incluir caracteres pré-definidos de preenchimento nas caixasde edição e nas áreas de texto, até que os navegadores tratemcorretamente os controles vazios. (Prioridade 2)

1

2.15

Usar o elemento “label” juntamente com o atributo “id” paraassociar os rótulos aos respectivos controles dos formulários.Assim, os leitores de tela associarão os elementos do formu-lário de forma correta. Usando o comando “label” as pessoasque usam leitores de tela não terão problemas ao ler o formu-lário. Caso haja grupos de informação, controles, etc, a estesdevem estar devidamente diferenciados, seja por meio de espa-çamento, localização ou elementos gráficos. (Prioridade 2)

1

3.1 Não usar elementos considerados ultrapassados pelo W3C.(Prioridade 3)

6

Page 46: Acessibilidade Web: um estudo de caso na Universidade ... · UNIVERSIDADEFEDERALDESÃOJOÃODEL-REI Ronan José Lopes Acessibilidade Web: um estudo de caso na Universidade Federal

A.1.8 Vídeo Institucional

Tabela 14: Erros de Acessibilidade na Página "Vídeo Institucional"do Portal

P.V. Descrição Ocorrências

1.1Identificar o principal idioma utilizado nos documentos. O idi-oma do documento deve ser especificado na expressão HTML.(Prioridade 1)

1

1.11

Fornecer um equivalente textual a cada imagem (isso abrange:representações gráficas do texto, incluindo símbolos, GIFs ani-mados, imagens utilizadas como sinalizadores de pontos deenumeração, espaçadores e botões gráficos), para tanto, utiliza-se o atributo “alt” ou “longdesc” em cada imagem. (Prioridade1)

10

1.16Assegurar a acessibilidade do conteúdo de frames, fornecendouma página alternativa através do elemento “noframes”. (Pri-oridade 1)

1

1.17 ar a cada frame um título que facilite a identificação dos framese sua navegação. (Prioridade 1)

1

2.2

Utilizar unidades relativas, e não absolutas, nos valores dosatributos de tabelas, textos, etc. Em CSS não use valores ab-solutos como “pt” ou “px” e sim valores relativos como o “em”,“ex” ou em porcentagem. (Prioridade 2)

5

2.14Incluir caracteres pré-definidos de preenchimento nas caixasde edição e nas áreas de texto, até que os navegadores tratemcorretamente os controles vazios. (Prioridade 2)

1

2.15

Usar o elemento “label” juntamente com o atributo “id” paraassociar os rótulos aos respectivos controles dos formulários.Assim, os leitores de tela associarão os elementos do formu-lário de forma correta. Usando o comando “label” as pessoasque usam leitores de tela não terão problemas ao ler o formu-lário. Caso haja grupos de informação, controles, etc, a estesdevem estar devidamente diferenciados, seja por meio de espa-çamento, localização ou elementos gráficos. (Prioridade 2)

1

3.1 Não usar elementos considerados ultrapassados pelo W3C.(Prioridade 3)

5

Page 47: Acessibilidade Web: um estudo de caso na Universidade ... · UNIVERSIDADEFEDERALDESÃOJOÃODEL-REI Ronan José Lopes Acessibilidade Web: um estudo de caso na Universidade Federal

A.2 Software HeraApresenta-se abaixo os pontos de verificação que mostraram-se inadequados na pá-

gina inicial do portal da Universidade Federal de São João del-Rei, de acordo com a avalia-ção de acessibilidade do software Hera, baseando-se no modelo internacional (WCAG 1.0).

Ponto 1.1:Forneça um equivalente textual para todo o elemento não textual. Pode ser feito atra-vés do atributo "alt", ou "longdesc"ou no conteúdo do elemento. Isto abrange: imagens,representações gráficas de texto, incluindo símbolos, regiões de mapas de imagem, ani-mações, como é o caso dos GIFs animados, applets e objetos programados, arte ASCII,painéis/frames, programas interpretáveis, imagens utilizadas em listas como sinalizadoresde pontos de enumeração, espaçadores, botões gráficos, sons (reproduzidos com ou seminteração do utilizador), arquivos de áudio independentes, faixas áudio de vídeo e trechosde vídeo. (Prioridade 1)

Ponto 3.2:Crie documentos validando a notação com a gramática formal publicada. (Prioridade 2)

Ponto 3.3:Use folhas de estilo para controlar a disposição dos elementos na página e a forma de osapresentar. (Prioridade 2)

Ponto 3.4:Use unidades relativas em vez de absolutas nos valores dos atributos da linguagem denotação e valores das propriedades das folhas de estilo. (Prioridade 2)

Ponto 4.3:Identifique o idioma principal do documento. (Prioridade 3)

Ponto 6.3:Certifique-se que as páginas são usáveis quando scripts, applets, ou outros objetos progra-máveis se encontram desativados ou não são suportados. Se isto não for possível, forneçainformação equivalente numa página alternativa acessível. (Prioridade 1)

Ponto 6.4:No caso dos scripts e dos applets, certifique-se que os eventos que o manipulam funcionamindependentemente do dispositivo de entrada. (Este ponto inclui o 9.3). (Prioridade 2)

Ponto 9.3:No caso dos scripts, especifique manipuladores de eventos por software em vez de mani-

Page 48: Acessibilidade Web: um estudo de caso na Universidade ... · UNIVERSIDADEFEDERALDESÃOJOÃODEL-REI Ronan José Lopes Acessibilidade Web: um estudo de caso na Universidade Federal

puladores de eventos dependentes de dispositivos. (Prioridade 2)

Ponto 9.5:Defina teclas de atalho para links importantes (incluíndo os que se encontram nos ma-pas de imagem client-side), controles de formulário, e grupos de controles de formulários.(Prioridade 3)

Ponto 10.2:Até que os agentes do utilizador suportem associações explícitas entre os rótulos e oscontroles de formulário, para todos os controles com rótulos implicitamente associados,certifique-se que os rótulos se encontram apropriadamente posicionados. (Prioridade 2)

Ponto 10.4:Até que os agentes do utilizador consigam manipular controles vazios corretamente, in-clua caracteres predefinidos de preenchimento nas caixas de edição e nas áreas de texto.(Prioridade 3)

Ponto 10.5:Até que os agentes do utilizador consigam distinguir links adjacentes, inclua caracteresnão "linkados", circundados por espaços, entre os links adjacentes. (Prioridade 3)

Ponto 11.1:Use tecnologias W3C quando a mesma esteja disponível e seja apropriada para uma ta-refa. Utilize as versões mais recentes, desde que suportadas. (Prioridade 2)

Ponto 11.2:Evite o uso de notação obsoleta das tecnologias do W3C. (Prioridade 2)

Ponto 12.4:Associe explicitamente os rótulos aos respectivos controles. (Prioridade 2)

———————————————————-

Page 49: Acessibilidade Web: um estudo de caso na Universidade ... · UNIVERSIDADEFEDERALDESÃOJOÃODEL-REI Ronan José Lopes Acessibilidade Web: um estudo de caso na Universidade Federal

APÊNDICE B – Termo de Consentimento Li-vre e Esclarecido

Título da Pesquisa: Levantamento dos problemas de acessibilidade web na UniversidadeFederal de São João del-Rei (UFSJ)

Nome do Pesquisador Principal ou Orientador(a): Elisa Tuler de Albergaria

Nome do(s) Pesquisadores assistentes/alunos: Ronan José Lopes

1. Natureza da pesquisa: O sr. está sendo convidado a participar desta pesquisaque tem como finalidade identificar os principais problemas que os usuários comqualquer tipo de necessidade especial enfrentam ao navegar e utilizar serviços nowebsite da UFSJ.

2. Envolvimento na pesquisa: Ao participar deste estudo o sr. permitirá que opesquisador Ronan José Lopes utilize os resultados obtidos na entrevista para oo projeto de extensão “Acessibilidade Web” da UFSJ, bem como em seu trabalhode conclusão de curso. O sr. tem liberdade de se recusar a participar e ainda serecusar a continuar participando em qualquer fase da pesquisa, sem qualquer tipode prejuízo. Sempre que quiser poderá pedir mais informações sobre a pesquisaatravés do telefone do pesquisador do projeto e, se necessário através do telefone doComitê de Ética em Pesquisa.

3. Participantes da pesquisa: Usuários do sistema com necessidades especiais.

4. Sobre as entrevistas: Consistem basicamente de perguntas diretas a respeito dosproblemas enfrentados pelo usuário na utilização do website da universidade. Alémdisso, há um pequeno roteiro de atividades a serem executadas pelo entrevistado nowebsite da universidade. Essa execução de atividades é assistida e gravada, a fim deidentificar os problemas mais críticos.

5. Riscos e desconforto: a participação nesta pesquisa não traz complicações legais.Os procedimentos adotados nesta pesquisa obedecem aos Critérios da Ética emPesquisa com Seres Humanos conforme Resolução no. 196/96 do Conselho Nacionalde Saúde. Nenhum dos procedimentos usados oferece riscos à sua dignidade.

6. Confidencialidade: as informações coletadas a respeito dos usuários neste estudosão estritamente confidenciais. Somente os resultados obtidos acerca dos problemasencontrados serão publicados, preservando o anonimato dos entrevistados.

Page 50: Acessibilidade Web: um estudo de caso na Universidade ... · UNIVERSIDADEFEDERALDESÃOJOÃODEL-REI Ronan José Lopes Acessibilidade Web: um estudo de caso na Universidade Federal

7. Benefícios: ao participar desta pesquisa o sr. não terá nenhum benefício direto.Entretanto, esperamos que este estudo traga informações importantes sobre a si-tuação atual do website da universidade, de forma a possibilitar a promoção deacessibilidade no mesmo.

8. Pagamento: o sr. não terá nenhum tipo de despesa para participar desta pesquisa,bem como nada será pago por sua participação.

Após estes esclarecimentos, solicitamos o seu consentimento de forma livre paraparticipar desta pesquisa. Portanto preencha, por favor, os itens que se seguem.

Obs: Não assine esse termo se ainda tiver dúvida a respeito.

Consentimento Livre e Esclarecido

Tendo em vista os itens acima apresentados, eu, de forma livre e esclarecida, mani-festo meu consentimento em participar da pesquisa. Declaro que recebi cópia deste termode consentimento, e autorizo a realização da pesquisa e a divulgação dos dados obtidosneste estudo.

Nome do Participante da Pesquisa

Assinatura do Participante da Pesquisa

Assinatura do Pesquisador

Assinatura do Orientador

Pesquisador Principal : Ronan José Lopes (37) 8806-1260

Demais pesquisadores: Elisa Tuler de Albergaria

Comitê de Ética em Pesquisa: Rua Guajajaras, 175, 4o andar – Belo Horizonte/MG

Telefone do Comitê: 3508-9110

Page 51: Acessibilidade Web: um estudo de caso na Universidade ... · UNIVERSIDADEFEDERALDESÃOJOÃODEL-REI Ronan José Lopes Acessibilidade Web: um estudo de caso na Universidade Federal

APÊNDICE C – Atividades DesenvolvidasPelos Entrevistados

As atividades descritas pelas situações abaixo foram aplicadas aos entrevistados,com o intuito de observar e levantar obstáculos e pontos críticos na navegação do usuáriopelo sistema. As atividades foram ordenadas considerando-se o nível de dificuldade deforma crescente. Tais atividades devem ser designadas pelo entrevistador uma a uma, deforma a interromper o processo caso o usuário mostre qualquer tipo de incômodo com arealização da tarefa.

Atividade 01:Você ingressou recentemente na UFSJ e se interessou pelos programas de Iniciação Cien-tífica da Universidade. Para obter mais informações, acesse a página com as informações,que se encontra no caminho Página Inicial > Iniciação Científica.

Atividade 02:O mapa do site é uma página que mostra toda a estrutura de páginas do site, permitindoo acesso rápido a páginas mais distantes. Acesse a página de mapa do site da UFSJ,disponível a partir do caminho Página Inicial > Mapa do Site.

Atividade 03:Você é um vestibulando da Universidade Federal de São João e deseja obter mais informa-ções sobre o Processo Seletivo do Sistema de Seleção Unificada (SISU). Acesse a devidapágina com as informações através do caminho Página inicial > Vestibular > ProcessoSeletivo do Sistema de Seleção Unificada (SISU).

Atividade 04:Dias atrás você assistiu a um vídeo resumo do 27𝑜 Inverno Cultural UFSJ, através deuma notícia exibida no site. Agora essa notícia não se encontra mais entre os destaquesda página inicial. Navegue até as demais notícias para tentar encontrá-la, através docaminho Página Inicial > Mais Notícias > videorresumo do 27𝑜 Inverno Cultural UFSJ.

Atividade 05:Você precisa solicitar um serviço de limpeza no SIC (Serviço de Informação ao Cidadão),sistema localizado no intranet. Acesse a página do serviço e faça a tentativa de logincom CPF e senha quaisquer (o login não precisa ser validado) através do caminho PáginaInicial > Intranet > SIC (Serviço de Informação ao Cidadão).

Page 52: Acessibilidade Web: um estudo de caso na Universidade ... · UNIVERSIDADEFEDERALDESÃOJOÃODEL-REI Ronan José Lopes Acessibilidade Web: um estudo de caso na Universidade Federal

APÊNDICE D – Entrevistas Com Usuários -Respostas e Anotações

D.1 Entrevistado 011 - Dados PessoaisIdade: 42 anos Sexo: MasculinoNível de Escolaridade: Superior – Comunicação e Jornalismo (CES/JF)Profissão: Assistente administrativo (ASCOM - UFSJ)Tempo de exercimento do cargo: 14 mesesNecessidade especial: (X) Sim ( ) Não Qual? R: Deficiência visual (total)

2 – O Usuário e a Tecnologia:2.1 - Experiência com o uso de computadores/internet: (X) Sim ( ) NãoHá quanto tempo faz uso? R: 5 anos

2.2 - Atividades mais realizadas:

(X) E-mail ( ) Redes Sociais (X) Pesquisas(X) Notícias ( ) Serviços de Banco (X) WebSite da UFSJ(X) Outras: Cursos online e sites do governo (Exemplo: http://www.scdp.gov.br)

2.3 - No website da UFSJ, quais dos sistemas ou recursos abaixo você utiliza?

( ) Calendário Acadêmico (X) Concursos ( ) DIBIB (Biblioteca)( ) Dicon ( ) Iniciação Científica (X) Intranet 1

( ) Mapa do Site (X) Página Inicial (Notícias) ( ) Portal Didático( ) Reitoria ( ) Vestibular ( ) Outra: Nenhuma.

3 – Questões de Acessibilidade3.1 - Você utiliza algum programa para auxiliar a utilização do computador?(X) Sim ( ) NãoQuais? R: Softwares leitores de tela – NVDA, DOSVOX e ocasionalmente Jaws.

3.2 - Ao navegar pelos websites que você normalmente acessa com mais frequência, comovocê define a facilidade de interação com esses sistemas?

1Formulários para prestação de serviços e memorando eletrônico (Sistema SIC)

Page 53: Acessibilidade Web: um estudo de caso na Universidade ... · UNIVERSIDADEFEDERALDESÃOJOÃODEL-REI Ronan José Lopes Acessibilidade Web: um estudo de caso na Universidade Federal

( ) Ótima (X) Boa ( ) Regular ( ) Ruim ( ) Péssima

3.3 - Quais são os principais obstáculos encontrados ao navegar por esses websites?- Identificação do conteúdo de uma imagem, devido à ausência de tags de descrição textual.- Ausência de teclas de atalho que facilitem a navegação por seções do site.

3.4 - Para o website e sistemas da UFSJ em específico, como você define a facilidade denavegação para os sistemas e recursos assinalados?

( ) Ótima ( ) Boa (X) Regular ( ) Ruim ( ) Péssima

3.5 - Quais são os principais obstáculos encontrados ao navegar pelos sistemas da UFSJ?- Solicitação de serviços: difícil navegação pela interface através do teclado.- Alguns elementos dos sistemas (como escolha de unidade organizacional, por exemplo)são utilizáveis somente através do mouse.

4 – Outras observações:- Entrevistado relatou muito travamento do software leitor de tela em páginas (não neces-sariamente da universidade) que contenham muitas imagens, dificultando a navegação.- Entrevistado apontou ineficiência dos programas leitores de tela em trabalhar com slides(.pdf,.ppt e demais).

5 - Desempenho nas atividades:- Atividade 01: Excelente desempenho. A página alvo foi atingida em um curto espaçode tempo, sem nenhum problema durante a navegação.

- Atividade 02: Excelente desempenho. A página alvo foi atingida em um curto espaçode tempo, sem nenhum problema durante a navegação.

- Atividade 03: Desempenho satisfatório. Apesar de haver uma grande quantidade delinks e seções no site, o usuário conseguiu atingir o objetivo em um tempo aceitável.

- Atividade 04: Desempenho insatisfatório. O usuário não demandou muito tempo paraconseguir acessar a página de notícias e, mas devido à grande quantidade links, mostrou-seum pouco perdido. Após algum tempo navegando, conseguiu atingir o link alvo.

- Atividade 05: Não concluída. O usuário conseguiu navegar até a página do SIC emtempo aceitável. O login, entretanto, exige que se informe a unidade organizacional, cujobotão não é possível habilitar através do teclado, mas somente pelo mouse, tornandoimpossível a conclusão da tarefa pelo usuário.

Page 54: Acessibilidade Web: um estudo de caso na Universidade ... · UNIVERSIDADEFEDERALDESÃOJOÃODEL-REI Ronan José Lopes Acessibilidade Web: um estudo de caso na Universidade Federal

D.2 Entrevistado 021 - Dados PessoaisIdade: 22 anos Sexo: MasculinoNível de Escolaridade: Cursando Ensino SuperiorProfissão: Estudante (6o período de Administração - UFSJ)Tempo de exercimento do cargo: -Necessidade especial: (X) Sim ( ) Não Qual? R: Deficiência visual (parcial)

2 – O Usuário e a Tecnologia:2.1 - Experiência com o uso de computadores/internet: (X) Sim ( ) NãoHá quanto tempo faz uso? R: 3 anos

2.2 - Atividades mais realizadas:

(X) E-mail (X) Redes Sociais (X) Pesquisas(X) Notícias ( ) Serviços de Banco (X) WebSite da UFSJ( ) Outras

2.3 - No website da UFSJ, quais dos sistemas ou recursos abaixo você utiliza?

( ) Calendário Acadêmico ( ) Concursos (X) DIBIB (Biblioteca)(X) Dicon ( ) Iniciação Científica (X) Intranet 2

( ) Mapa do Site (X) Página Inicial (Notícias) (X) Portal Didático( ) Reitoria ( ) Vestibular( ) Outra

3 – Questões de Acessibilidade3.1 - Você utiliza algum programa para auxiliar a utilização do computador?(X) Sim ( ) NãoQuais? R: Software leitor de tela Jaws e lupa nativa do sistema operacional Windows.

3.2 - Ao navegar pelos websites que você normalmente acessa com mais frequência, comovocê define a facilidade de interação com esses sistemas?

( ) Ótima ( ) Boa (X) Regular ( ) Ruim ( ) Péssima

3.3 - Quais são os principais obstáculos encontrados ao navegar por esses websites?- Lentidão na navegação devido a excesso de informação, dificultando que o usuário localizeo conteúdo desejado - Dificuldade na leitura de notícias (Com excessão do portal G13, osdemais websites apresentam obstáculos)

3http://www.g1.com.br/

Page 55: Acessibilidade Web: um estudo de caso na Universidade ... · UNIVERSIDADEFEDERALDESÃOJOÃODEL-REI Ronan José Lopes Acessibilidade Web: um estudo de caso na Universidade Federal

3.4 - Para o website e sistemas da UFSJ em específico, como você define a facilidade denavegação para os sistemas e recursos assinalados?

( ) Ótima (X) Boa ( ) Regular ( ) Ruim ( ) Péssima

3.5 - Quais são os principais obstáculos encontrados ao navegar pelos sistemas da UFSJ?- No intranet, a visualização de notas e faltas demanda muito tempo pelo teclado. Comoo usuário tem uma baixa visão, dispõe da possibilidade de fazer a navegação utilizando omouse em conjunto com a ferramenta lupa, agilizando o processo

4 – Outras observações:- Nenhuma.

5 - Desempenho nas atividades:- Não foi possível aplicar a parte prática da entrevista por falta de equipamento adaptadopara o uso do usuário.

Page 56: Acessibilidade Web: um estudo de caso na Universidade ... · UNIVERSIDADEFEDERALDESÃOJOÃODEL-REI Ronan José Lopes Acessibilidade Web: um estudo de caso na Universidade Federal

D.3 Entrevistado 031 - Dados PessoaisIdade: 29 anos Sexo: MasculinoNível de Escolaridade: Superior – Pós-Graduação em Gestão Empresarial (Centro de Patosde Minas)Profissão: Assistente em Administração (PROEX - UFSJ)Tempo de exercimento do cargo: 2 anos e 5 mesesNecessidade especial: (X) Sim ( ) Não Qual? R: Deficiência visual (parcial)

2 – O Usuário e a Tecnologia:2.1 - Experiência com o uso de computadores/internet: (X) Sim ( ) NãoHá quanto tempo faz uso? R: 16 anos

2.2 - Atividades mais realizadas:

(X) E-mail (X) Redes Sociais (X) Pesquisas(X) Notícias (X) Serviços de Banco (X) WebSite da UFSJ( ) Outras

2.3 - No website da UFSJ, quais dos sistemas ou recursos abaixo você utiliza?

(X) Calendário Acadêmico (X) Concursos (X) DIBIB (Biblioteca)( ) Dicon ( ) Iniciação Científica (X) Intranet 4

( ) Mapa do Site (X) Página Inicial (Notícias) ( ) Portal Didático(X) Reitoria ( ) Vestibular(X) Outra: Solicitação de serviços ao NTINF5

3 – Questões de Acessibilidade3.1 - Você utiliza algum programa para auxiliar a utilização do computador?(X) Sim ( ) NãoQuais? R: Software leitor de tela NVDA integrado com a voz sintetizada "Raquel", temade alto contraste e lupa (nativos do sistema operacional Windows).

3.2 - Ao navegar pelos websites que você normalmente acessa com mais frequência, comovocê define a facilidade de interação com esses sistemas?

( ) Ótima (X) Boa ( ) Regular ( ) Ruim ( ) Péssima2Sistema Integrado de Patrimônio, Administração e Contratos (SIPAC)3http://www.ufsj.edu.br/ntinf/solicitacao_de_servicos2.php

Page 57: Acessibilidade Web: um estudo de caso na Universidade ... · UNIVERSIDADEFEDERALDESÃOJOÃODEL-REI Ronan José Lopes Acessibilidade Web: um estudo de caso na Universidade Federal

3.3 - Quais são os principais obstáculos encontrados ao navegar por esses websites?- Websites com conteúdos pesados travam com frequência.- Imagens sem descrição textual.- Captchas disponíveis somente via imagem.

3.4 - Para o website e sistemas da UFSJ em específico, como você define a facilidade denavegação para os sistemas e recursos assinalados?

( ) Ótima ( ) Boa (X) Regular ( ) Ruim ( ) Péssima

3.5 - Quais são os principais obstáculos encontrados ao navegar pelos sistemas da UFSJ?- Captcha sem versão alternativa em áudio na página de solicitação de serviços do NTINF.- Imagens sem descrição textual.- Difícil navegação pelo teclado.- Incompatibilidade com o tema de Alto Contraste utilizado.

4 – Outras observações:- Nenhuma.

5 - Desempenho nas atividades:O usuário cumpriu todas as tarefas estabelecidas sem nenhum problema e em curto prazo.Apesar de ter visão limitada, o entrevistado consegue enxergar parcialmente e, juntamentecom o auxílio das ferramentas listadas acima consegue navegar fluentemente pelo website,inclusive utilizando o mouse. A única atividade que o usuário relatou não ser capaz decumprir no sistema é a inserção de textos captcha (que estão disponíveis no portal somenteem imagem), situação na qual necessita solicitar a ajuda de outra pessoa.

Page 58: Acessibilidade Web: um estudo de caso na Universidade ... · UNIVERSIDADEFEDERALDESÃOJOÃODEL-REI Ronan José Lopes Acessibilidade Web: um estudo de caso na Universidade Federal

Referências

J. Rocha and A. Duarte, Diretrizes de acessibilidade web: um estudo comparativoentre as WCAG 2.0 e o e-MAG 3.0. In Revista Inclusão Social, pages 73-86, 2012.Nenhuma citação no texto.

A. Freire, M. Castro and R. Fortes, Acessibilidade dos sítios web dos governosestaduais brasileiros: uma análise quantitativa entre 1996 e 2007. In Revista deAdministração Pública, pages 395-414, 2009. Nenhuma citação no texto.

B. Parmanto and X. Zeng, Metric for Web Accessibility Evaluation. In Journal ofthe American Society for Information Science and Technology, pages 1394-1404, 2005.Nenhuma citação no texto.

Q. Silva, M. Nunes and A. Oliveira, Respeito à cidadania: provendo acessibilidadeweb na Universidade Federal de Sergipe (UFS). In Revista GEINTEC - Gestão,Inovação e Tecnologia, São Cristóvão, pages 74-91, 2012. Nenhuma citação no texto.

M. Amaral, R. Cecílio, V. Ulbricht, C. Berg, G. Dandolini and D. Kaminski, WebsitesAcessíveis e o uso de CMS. In Cadernos de Informática, 2011. Nenhuma citação notexto.

F. Chagas, C. Carvalho and J. Silva, Um estudo sobre os sistemas de gerenciamentode conteúdo de código aberto. Relatório Técnico RT-INF_002-08, UniversidadeFederal de Goiás, 2008. Nenhuma citação no texto.

L. Sato, Um Estudo Comparativo de Sistemas de Gestão de Conteúdo Para aManutenção de Sítios Web em Universidades Públicas Brasileiras. UniversidadeEstadual de Maringá, 2008. Nenhuma citação no texto.

T. Hewett, R. Baecker, S. Card, T. Carey, J. Gasen, M. Mantei, G. Perlman, G. Strongand W. Verplank, ACM SIGCHI Curricula for Human-Computer Interaction,Technical Report, 1992. Nenhuma citação no texto.

S. Barbosa and B.Silva, Interação Humano-Computador. Elsevier Editora Ltda, 1a.edição. 2010. Nenhuma citação no texto.

B. Boiko, Content Management Bible. 2a edição. 2001. Nenhuma citação no texto.

O’REILLY,T. (2005). What Is Web 2.0 . Disponível em:<http://oreilly.com/web2/archive/what-is-web-20.html>. Acesso em: 15 de Ju-nho de 2014. Nenhuma citação no texto.

Page 59: Acessibilidade Web: um estudo de caso na Universidade ... · UNIVERSIDADEFEDERALDESÃOJOÃODEL-REI Ronan José Lopes Acessibilidade Web: um estudo de caso na Universidade Federal

AHMED,N. (2008). Getting LAMP to work in Ubuntu Hardy. Disponível em:<http://www.nazly.me/getting-lamp-to-work-in-ubuntu-hardy/>. Acesso em: 02 deNovembro de 2014. Nenhuma citação no texto.

ZAMORA,C. (2010). Top 5: Melhores gerenciadores de conteúdo da web.Disponível em: <http://www.uolhost.com.br/blog/top-5-melhores-gerenciadores-de-conteudo-da-web>. Acesso em: 16 de Junho de 2014. Nenhuma citação notexto.

KIRK,J. (2010). Which Open-Source CMS Has the Most Ac-tive Development Community? [Part Two]. Disponível em:<http://engineindustries.com/blog/jason/which-open-source-cms-has-most-active-development-community-part-two>. Acesso em: 17 de Junho de 2014. Nenhuma citaçãono texto.

GOVERNO ELETRÔNICO (2012). Comparativo dosSistemas de Gestão de Conteúdo. Disponível em:<https://www.consultas.governoeletronico.gov.br/ConsultasPublicas/consultas.do?acao=exibir&id=113>. Acesso em: 17 de Junho de 2014. Nenhuma citação no texto.

GOVERNO ELETRÔNICO (2014). E-MAG - Modelo de Acessibilidade emGoverno Eletrônico. Disponível em: <http://www.governoeletronico.gov.br/acoes-e-projetos/e-MAG>. Acesso em: 18 de Junho de 2014. Nenhuma citação notexto.

GOVERNO ELETRÔNICO (2014). Recomenda-ções de Acessibilidade: WCAG 2.0. Disponível em:<http://emag.governoeletronico.gov.br/cursoconteudista/desenvolvimento-web/recomendacoes-de-acessibilidade-wcag2.html>. Acesso em: 28 de Outubro de2014. Nenhuma citação no texto.

ALECRIM,E. (2008). Banco de dados MySQL e PostgreSQL. Disponível em:<http://www.infowester.com/postgremysql.php>. Acesso em: 18 de Junho de 2014.Nenhuma citação no texto.

What is Joomla?. Disponível em: <http://www.joomla.org/about-joomla.html>.Acesso em: 19 de Junho de 2014. Nenhuma citação no texto.

About Drupal. Disponível em: <http://drupal.org/about>. Acesso em: 19 de Junhode 2014. Nenhuma citação no texto.

Features in Plone 3.0 . Disponível em:<http://plone.org/products/plone/features/old/3.0/referencemanual-all-pages>.Acesso em: 22 de Junho de 2014. Nenhuma citação no texto.

Page 60: Acessibilidade Web: um estudo de caso na Universidade ... · UNIVERSIDADEFEDERALDESÃOJOÃODEL-REI Ronan José Lopes Acessibilidade Web: um estudo de caso na Universidade Federal

Function Reference - WordPress Codex. Disponível em:<http://codex.wordpress.org/Function_Reference>. Acesso em: 22 de Outubrode 2014. Nenhuma citação no texto.

I. Seidman, Interviewing As Qualitative Research: A Guide for Researchers inEducation and the Social Sciences. Columbia University, 1998. Nenhuma citaçãono texto.