Website Centro Universitário de Belo Horizonte - Uni-BH
Inspeção de usabilidade
Técnicas aplicadas: •
Percurso cognitivo
•
Análise Heurística
Novembro 2007
Eduardo Loureiro
SUMÁRIO
1. CONCEITUAÇÃO GERAL........................................................................2 1.1 Inspeções de usabilidade .................................................................2 1.2 Percurso cognitivo .........................................................................3 1.3 Análise heurística..........................................................................5
2. SOBRE O WEBSITE DO UNI-BH ................................................................8
3. APLICAÇÃO DO PERCURSO COGNITIVO ......................................................9 3.1 Planejamento da análise (definição de tarefas, cenários, públicos e seqüência de ações) ........................................................................................9 3.2 Análise .................................................................................... 11
4. APLICAÇÃO DA ANÁLISE HEURÍSTICA ...................................................... 19 4.1 Análise .................................................................................... 21
5. CONCLUSÕES ................................................................................. 25
Inspeção de usabilidade | Website Uni-BH | Novembro 2007
2
1. CONCEITUAÇÃO GERAL
1.1 Inspeções de usabilidade
A inspeção de usabilidade engloba métodos de avaliação de interfaces aplicadas por especialistas. Os métodos podem ser aplicados em qualquer fase do ciclo de design, com o objetivo de se encontrar as falhas de usabilidade, que possam atrapalhar os usuários durante a utilização do sistema. A aplicação das técnicas de inspeção de usabilidade é uma alternativa menos dispendiosa, do ponto de vista de custo e de tempo, em relação aos testes de usabilidade, pois podem ser aplicadas sem a presença do usuário alvo da interface. Porém, a característica de não envolver diretamente os usuários, faz com que as inspeções não conseguem prever 100% dos problemas de usabilidade. Dessa forma, as técnicas de inspeções devem ser aliadas aos testes com usuários, para que o maior número possível de problemas de usabilidade possa ser encontrado. Foram aplicadas as duas técnicas de inspeção de usabilidade para a avaliação do website do Centro Universitário de Belo Horizonte, o percurso cognitivo e a avaliação heurística. Depois foi feita uma comparação entre quais problemas em comum foram encontrados pelas duas técnicas.
Eduardo Loureiro | contato@eduardoloureiro.com | eduardoloureiro.com
Inspeção de usabilidade | Website Uni-BH | Novembro 2007
3
1.2 Percurso cognitivo
A técnica do percurso cognitivo consiste na avaliação de tarefas típicas realizadas pelos usuários da interface, a fim de encontrar problemas de usabilidade relacionados à facilidade de aprendizagem dos passos necessários para realizar as tarefas. Dessa forma, os especialistas simulam o percurso das tarefas realizadas pelos usuários, verificando se a cada passo o usuário conseguiria alcançar o objetivo correto, evoluindo na interação com a interface. A aplicação da técnica consiste em: •
Definição de quem são os usuários da interface, analisando suas características e comportamentos.
•
Definição das tarefas típicas que serão analisadas.
•
Definição da seqüência de ações para a realização correta de cada tarefa.
•
Definição da interface a ser analisada, que é a descrição de informações necessárias para que as tarefas sejam realizadas, como requisitos, regras funcionais etc.
Os especialistas têm como guia as questões listadas abaixo, para descrever a interação do usuário com a interface, através de uma história, que poderá ser um caso de sucesso caso o usuário consiga alcançar seu objetivo, ou um caso de fracasso, caso o objetivo não seja alcançado. As seguintes questões devem ser respondidas pelos especialistas:
1. Os usuários farão a ação correta para atingir o resultado desejado? •
Dada a decomposição de uma tarefa em sub-tarefas, o usuário saberá por onde começar?
•
Saberá qual é o próximo passo? O que o usuário vai tentar fazer a cada momento?
2. O usuário perceberá que a ação correta está disponível? •
Onde está o elemento de interface correspondente ao próximo passo?
•
Que ações a interface torna disponíveis?
Eduardo Loureiro | contato@eduardoloureiro.com | eduardoloureiro.com
Inspeção de usabilidade | Website Uni-BH | Novembro 2007
4
3. O usuário associará o elemento de interface correto à meta a ser atingida? •
O elemento de interface revela seu propósito e comportamento?
•
O usuário consegue identificar os elementos de interface?
4. Se a ação correta é tomada, o usuário perceberá que progrediu em direção à solução da tarefa? •
Como a interface apresenta o resultado de cada ação?
•
O resultado apresentado tem correspondência com o objetivo do usuário?
Eduardo Loureiro | contato@eduardoloureiro.com | eduardoloureiro.com
Inspeção de usabilidade | Website Uni-BH | Novembro 2007
1.3 Análise heurística
A análise heurística é uma técnica de inspeção feita por especialistas, que tomam como base princípios e orientações práticas de usabilidade. O objetivo é identificar os problemas de usabilidade existentes nas interfaces, através da rigorosa aplicação desses princípios durante o processo de análise. Os problemas encontrados foram classificados em 3 graus de criticidade: •
Alta
•
Média
•
Baixa
Essa classificação tem o objetivo de identificar quais são os problemas mais graves, que impedem a interação do usuário com a interface; quais são medianos, que tem grande chance de causar problemas na interação; e quais são leves, que eventualmente podem causar problemas de interação. Os graus de criticidade são proporcionais à prioridade com que os problemas devem ser solucionados. Problemas de criticidade alta devem ser resolvidos em curto prazo; problemas médios têm prioridade média de resolução; e problemas de criticidade baixa podem ser solucionados em longo prazo. Para a avaliação do website do Uni-BH, foram utilizadas 15 recomendações baseadas nos 10 princípios de Jakob Nielsen (1993), adequadas ao novo cenário da Internet (evolução dos usuários, das interfaces, das conexões e da tecnologia). São elas: 1. Relevância dos elementos Informações irrelevantes ao contexto devem ser evitadas.
2. Linguagem simples e compreensível As expressões, labels e nomenclaturas devem ser claras, utilizando o vocabulário do usuário.
Eduardo Loureiro | contato@eduardoloureiro.com | eduardoloureiro.com
5
Inspeção de usabilidade | Website Uni-BH | Novembro 2007
6
3. Reconhecimento de padrões Padrões e convenções gerais já estabelecidos na web devem ser usados para tornar a interface do site mais intuitiva.
4. Minimização da carga cognitiva (memória) do usuário O usuário não deve precisar recorrer à memória para conseguir realizar as tarefas.
5. Consistência A interface do site deve ser consistente em termos de navegação, design, formato e posição dos elementos de interação.
6. Feedback e transparência do sistema O usuário deve ser informado sobre o resultado de suas ações.
7. Controle do usuário O site deve oferecer ao usuário a opção de abortar processos, voltar atrás, desfazer e refazer ações.
8. Eficiência, acessibilidade e flexibilidade de uso Os sites devem ser fáceis de usar e acessíveis para usuários de todos os níveis de experiência e dificuldade de acesso.
9. Recuperação de erros O site deve ter mensagens de erros consistentes, que informem ao usuário o que exatamente aconteceu e orientem o que deve ser feito para solucionar o problema.
10. Prevenção de erros A interface do site deve prever possíveis erros por parte do usuário, procurando evitálos.
Eduardo Loureiro | contato@eduardoloureiro.com | eduardoloureiro.com
Inspeção de usabilidade | Website Uni-BH | Novembro 2007
7
11. Agrupamento Intuitivo de informações Tópicos e informações semelhantes devem estar agrupados juntos para facilitar o acesso do usuário.
12. Informações hierarquizadas As informações devem ser organizadas de forma hierárquica, com pesos diferentes e apropriados à sua importância.
13. Apresentação do texto Os textos devem ser redigidos especificamente para leitura na Internet, onde o usuário varre a informação em vez de lê-la integralmente.
14. Tempo de resposta O carregamento das páginas do site deve ser rápido para que o usuário não desvie sua atenção ou até mesmo desista de acessar o site.
15. Obviedade do conceito / conteúdo O conteúdo do site deve ser óbvio e auto-evidente ao primeiro relance, além de completo e atualizado.
Eduardo Loureiro | contato@eduardoloureiro.com | eduardoloureiro.com
Inspeção de usabilidade | Website Uni-BH | Novembro 2007
2. SOBRE O WEBSITE DO UNI-BH
O Centro Universitário de Belo Horizonte – Uni-BH é uma instituição particular de ensino superior, localizada em Belo Horizonte e com 43 anos de atividade. O website do Uni-BH é o principal canal de comunicação online da instituição com os seus públicos. Ele possui informações pertinentes para as pessoas que desejam ingressar em algum de seus cursos oferecidos, ou tem interesse em algum serviço prestado pela instituição, para as pessoas que já são seus clientes, ou seja, alunos e para seus funcionários, os professores. Dessa forma, o público do website do Uni-BH, pode ser classificado em dois grandes grupos: •
Público externo: pessoas que desejam se tornar alunos da instituição e pessoas que utilizam os serviços prestados a comunidade.
•
Público interno: alunos, funcionários e professores.
Eduardo Loureiro | contato@eduardoloureiro.com | eduardoloureiro.com
8
Inspeção de usabilidade | Website Uni-BH | Novembro 2007
9
3. APLICAÇÃO DO PERCURSO COGNITIVO
Para a aplicação do percurso cognitivo foram escolhidas quatro tarefas, sendo que duas pertinentes aos alunos, público interno do Uni-BH e as outras duas pertinentes ao público externo, ou seja, pessoas sem relação com o Uni-BH.
3.1 Planejamento da análise (definição de tarefas, cenários, públicos e seqüência de ações)
USUÁRIO - Aluno (Universitários que utilizam o site do Uni-BH para obter informações específicas disponibilizadas para o público interno).
TAREFA 1 - Consultar resultado da bolsa ProUni. CENÁRIO - O aluno quer saber se o seu nome está na lista do resultado da bolsa ProUni. SEQÜÊNCIA DE AÇÕES Passo 1 – Acessar o item “Programa de bolsas” no menu de navegação. Passo 2 – Acessar o item “Classificados - ProUni 2007/2º” no sub-menu de navegação. Passo 3 – Clicar no elemento “Classificados” para visualizar o arquivo com o resultado da bolsa.
TAREFA 2 - Consultar os recessos acadêmicos do mês atual no calendário acadêmico. CENÁRIO - O aluno quer saber em quais dias do mês não terá aula devido a recessos acadêmicos. SEQÜÊNCIA DE AÇÕES Passo 1 – Acessar o item “Calendário e Guia Acadêmico” na parte superior do site. Passo 2 – Encontrar o mês atual na página acessada. Passo 3 – Percorrer a programação do mês para encontrar os recessos.
Eduardo Loureiro | contato@eduardoloureiro.com | eduardoloureiro.com
Inspeção de usabilidade | Website Uni-BH | Novembro 2007
10
USUÁRIO - Público externo (Pessoas sem relação com o Uni-BH, interessadas em ingressar em algum curso, ou interessadas nos serviços oferecidos para a sociedade).
TAREFA 3 - Ver horários de funcionamento dos serviços prestados pela clínica-escola. CENÁRIO - A pessoa quer se informar sobre os horários de atendimento da clínicaescola. SEQÜÊNCIA DE AÇÕES Passo 1 – Selecionar em “Escolha seu curso” dentro de “Graduação”, o curso de Fisioterapia. Passo 2 – Clicar no link “Conheça o site do curso”. Passo 3 – Clicar no link “Clínica Escola” no menu “Páginas”.
TAREFA 4 - Saber quais são os documentos necessários para a matrícula no Vestibular. CENÁRIO - O candidato ao vestibular, quer se certificar sobre quais documentos precisará para realizar a matrícula na instituição. SEQÜÊNCIA DE AÇÕES Passo 1 – Clicar no banner referente ao Vestibular. Passo 2 – Clicar no menu “QUERO SABER +”. Passo 3 – Dentro do combo “Qual é a sua dúvida?”, selecionar o item matrícula. Passo 4 – Rolar a página até o título “Quais os documentos necessários para efetuar a matrícula?”.
Eduardo Loureiro | contato@eduardoloureiro.com | eduardoloureiro.com
Inspeção de usabilidade | Website Uni-BH | Novembro 2007
11
3.2 Análise
» Tarefa 1 - Consultar resultado da bolsa ProUni
Questões / Passos
Acessar o item “Programa de Acessar o item “Classificados bolsas” no menu de - ProUni 2007/2º” no subnavegação menu de navegação
Clicar no elemento “Classificados” para visualizar o arquivo com o resultado da bolsa
A ação que o usuário pretende realizar está presente na interface
Sim.
Sim.
Sim.
A ação correta é evidente para o usuário?
Sim. Mas o usuário precisa varrer todo o menu até chegar ao último, que é a opção correta.
Sim, mas é apenas um item entre vários no sub-menu. Não há uma classificação entre o Sim. que é inscrição, o que é resultado e o que é apenas informação.
O usuário irá associar as ações corretas ao que pretende fazer?
Sim.
Sim.
Sim.
Irá o usuário interpretar de forma correta a resposta do sistema a ação escolhida?
Sim.
Sim.
Sim.
Resultados No geral a tarefa 1 está bem resolvida na interface do website, mas alguns problemas podem se originar devido à falta de destaque dos itens, que o usuário deve clicar. São eles: •
Visibilidade prejudicada No passo 1, o item a ser acessado “Programa de Bolsas”, é o último do menu principal de navegação, que possui vários itens que não tem uma separação visual clara, o que pode prejudicar o processo de “varredura”, feita pelos usuários atrás da informação desejada.
Figura 1 - Menu de navegação principal do website do Uni-BH
Eduardo Loureiro | contato@eduardoloureiro.com | eduardoloureiro.com
Inspeção de usabilidade | Website Uni-BH | Novembro 2007
•
12
No passo 2, o item que deve ser acessado também não tem o devido destaque por estar inserido entre outros vários itens no sub-menu de navegação, sem nenhuma classificação aparente.
Figura 2 - Sub-menu de navegação da página "Programa de Bolsas"
» Tarefa 2 - Consultar os recessos acadêmicos do mês atual no calendário acadêmico Questões / Passos
Acessar o item “Calendário e Encontrar o mês atual na Guia Acadêmico” na parte página acessada superior do site
Percorrer a programação do mês para encontrar os recessos
A ação que o usuário pretende realizar está presente na interface
Sim.
Sim.
Sim.
A ação correta é evidente para o usuário?
Não. A opção se encontra em um menu auxiliar localizado na extremidade superior do site.
Não. Para visualizar o mês atual é necessário rolar a barra Sim. de rolagem para baixo.
O usuário irá associar as ações corretas ao que pretende fazer?
Sim.
Sim.
Sim.
Irá o usuário interpretar de forma correta a resposta do sistema a ação escolhida?
Sim.
Sim.
Sim.
Eduardo Loureiro | contato@eduardoloureiro.com | eduardoloureiro.com
Inspeção de usabilidade | Website Uni-BH | Novembro 2007
13
Resultados Na tarefa 2, também foram encontrados problemas referentes à visibilidade dos elementos de interação necessários para que o usuário encontre a informação desejada. Porém, os problemas apontados são mais graves e podem prejudicar a realização da tarefa de forma mais contundente.
•
No passo 1, a opção correta se encontra em um menu auxiliar na extremidade superior do website. O item correto se mistura com outros, que não tem qualquer relação entre si. O agrupamento arbitrário desses itens nessa localização não tem nenhum motivo estratégico aparente e pode fazer com que o usuário passe despercebido por eles.
Figura 3 - Menu auxiliar de navegação
•
No passo 2, ao acessar a página “Calendário e Guia Acadêmico”, o calendário não se encontra em ordem cronológica lógica. Dessa forma o usuário precisa rolar a barra de rolagem até encontrar o mês atual, que poderia já estar situado na parte de cima.
Eduardo Loureiro | contato@eduardoloureiro.com | eduardoloureiro.com
Inspeção de usabilidade | Website Uni-BH | Novembro 2007
Figura 4 - Página "Calendário e Guia Acadêmico"
Eduardo Loureiro | contato@eduardoloureiro.com | eduardoloureiro.com
14
Inspeção de usabilidade | Website Uni-BH | Novembro 2007
15
» Tarefa 3 - Ver horários de funcionamento dos serviços prestados pela clínicaescola
Questões / Passos
Selecionar em “Escolha seu curso” dentro de “Graduação”, o curso de Fisioterapia
Clicar no link “Conheça o site Clicar no link “Clínica do curso” Escola” no menu “Páginas”
A ação que o usuário pretende realizar está presente na interface
Não. É preciso escolher o curso de fisioterapia dentro do combo.
Sim.
Sim.
A ação correta é evidente para o usuário?
Sim.
Sim.
Sim.
O usuário irá associar as ações corretas ao que pretende fazer?
Não. É necessário que ele saiba que a Clínica-escola é um projeto do curso de fisioterapia.
Não. Não há nenhuma indicação de que as informações sobre a clínicaescola estão dentro do site do curso de fisioterapia.
Sim.
Irá o usuário interpretar de forma correta a resposta do sistema a ação escolhida?
Sim.
Sim.
Sim.
Resultados A tarefa 3 apresenta problemas graves onde as opções corretas não têm relação direta com o objetivo do usuário.
•
O passo 1 tem seu inicio prejudicado pelo problema de se precisar acessar o menu de opões para se achar a opção correta, que é o curso de fisioterapia.
•
Ainda no passo 1, ocorre um grave problema entre a opção correta e o objetivo do usuário, pois é necessário que ele saiba que a clínica-escola é um serviço oferecido pelo curso de fisioterapia. Talvez nem todos os usuários vão saber previamente dessa informação.
•
No passo 2, outro grave problema ocorre, pois não há qualquer indicação de que as informações sobre a clínica-escola se encontram dentro do site do curso.
Eduardo Loureiro | contato@eduardoloureiro.com | eduardoloureiro.com
Inspeção de usabilidade | Website Uni-BH | Novembro 2007
16
Figura 5 - Página do curso de Fisioterapia
» Tarefa 4 - Saber quais são os documentos necessários para a matrícula no Vestibular
Questões / Passos
Dentro do combo “Qual Clicar no banner Clicar no menu “QUERO é a sua dúvida?”, referente ao Vestibular SABER +” selecionar o item matrícula
A ação que o usuário pretende realizar está presente na interface
Sim.
Rolar a página até o título “Quais os documentos necessários para efetuar a matrícula?” Sim.
Sim.
Sim. Sim.
A ação correta é evidente para o usuário?
O usuário irá associar as ações corretas ao que pretende fazer?
Irá o usuário interpretar de forma correta a resposta do sistema a ação escolhida?
Sim.
Sim.
Sim.
Sim.
Não. Não há qualquer indicação de que as informações sobre matrícula se encontram dentro desse item do menu.
Sim, mas ele quer saber informações específicas, ele ainda não possui dúvidas como esta proposto na interface.
Sim.
Não. A página não possui Sim. título e o menu clicado não fica marcado.
Eduardo Loureiro | contato@eduardoloureiro.com | eduardoloureiro.com
Não. Não há indicações corretas sobre onde na página se encontra a informação desejada. Sim.
Inspeção de usabilidade | Website Uni-BH | Novembro 2007
Resultados Na tarefa 4, assim como na tarefa 3, também ocorrem problemas de não correlação direta entre as opções corretas a serem seguidas pelos usuários e seus objetivos específicos. •
No passo 2, não há qualquer indicação de que as informações sobre matrícula se encontram dentro do item “Quero saber +”.
Figura 6 - Página inicial do site do Vestibular Uni-BH
•
Ainda no passo 2, ao clicar no item correto, não há feedback sobre qual item foi clicado ou para qual página o usuário foi direcionado.
Figura 7 - Página "Quero saber +" do site do Vestibular
Eduardo Loureiro | contato@eduardoloureiro.com | eduardoloureiro.com
17
Inspeção de usabilidade | Website Uni-BH | Novembro 2007
•
No passo 3, pode ocorrer uma falha na comunicação com o usuário, pois as opções, inclusive a opção desejada pelo usuário, se encontram em um combo box com o título “Qual é a sua dúvida?”, quando na verdade ainda não existe uma dúvida, mas um desejo de encontrar determinada informação.
Figura 8 - Página "Quero saber +" do site do Vestibular
•
No passo 4, como não existe um índice geral sobre quais informações estão disponibilizadas naquela página, o usuário precisa rolar a barra de rolagem e varrer todo o texto em busca da informação que deseja.
Figura 9 – Parte de baixo da página "Quero saber +"
Eduardo Loureiro | contato@eduardoloureiro.com | eduardoloureiro.com
18
Inspeção de usabilidade | Website Uni-BH | Novembro 2007
19
4. APLICAÇÃO DA ANÁLISE HEURÍSTICA
A análise heurística foi feita nas páginas onde se perpassam as quatro tarefas analisadas no percurso cognitivo. Além da página inicial do website, que é por onde todas as tarefas se iniciam, serão analisadas: •
A página “Programa de bolsas” da tarefa 1 “Consultar resultado da bolsa ProUni”;
•
A página “Calendário e Guia Acadêmico” da tarefa 2 “Consultar os recessos acadêmicos do mês atual no calendário acadêmico”;
•
A página do curso de fisioterapia da tarefa 3 “Ver horários de funcionamento dos serviços prestados pela clínica-escola”;
Legenda das heurísticas utilizadas na avaliação: H1. Relevância dos elementos H2. Linguagem simples e compreensível H3. Reconhecimento de padrões H4. Minimização da carga cognitiva (memória) do usuário H5. Consistência H6. Feedback e transparência do sistema H7. Controle do usuário H8. Eficiência, acessibilidade e flexibilidade de uso H9. Recuperação de erros H10. Prevenção de erros H11. Agrupamento Intuitivo de informações H12. Informações hierarquizadas H13. Apresentação do texto
Eduardo Loureiro | contato@eduardoloureiro.com | eduardoloureiro.com
Inspeção de usabilidade | Website Uni-BH | Novembro 2007
H14. Tempo de resposta H15. Obviedade do conceito / conteúdo
Eduardo Loureiro | contato@eduardoloureiro.com | eduardoloureiro.com
20
Inspeção de usabilidade | Website Uni-BH | Novembro 2007
21
4.1 Análise » Página inicial ID Problema
Heurística(s) Recomendação desobedecida(s)
Criticidade
H8
O tamanho das fontes está definido em pixels na folha de estilo, deve-se usar outra unidade de identificação para que o redimensionamento não fique comprometido no Internet Explorer.
Alta
Baixa
1
No browser Internet Explorer 6.0, não é possível aumentar o tamanho dos textos, o que prejudica a acessibilidade.
2
Há uma falta de padrão entre os links. Alguns recebem underline quando se passa o mouse (hover), enquanto outros não apresentam esse mesmo comportamento, ficando inalterados.
H5
Determinar um padrão para todos os links, com preferência para o underline para o estado hover para que o usuário perceba com clareza de que se trata de um link.
3
A ferramenta de busca é caracterizada apenas com o ícone de “lupa” sem nenhum label e o botão para concretizar a ação também é apenas um ícone sem label. Apesar dos ícones utilizados já serem convenções mundiais, usuários mais leigos podem encontrar dificuldades em identificar a ferramenta de busca.
H3 H15
Para tornar a ferramenta mais intuitiva, labels devem ser utilizados junto aos ícones.
Baixa
4
O logo do Uni-BH possui link redundante para a própria página inicial, além do rótulo “Home” no ALT. Esse comportamento é próprio das páginas internas, mas não faz sentido na página inicial podendo ocasionar erros.
H10
Retirar o link e o rótulo do logo do UniBH.
Baixa
5
Na área dinâmica em destaque, o banner atual permanece com o link apontando para ele mesmo, o que pode ocasionar erros.
H10
Retirar o link do banner, quando este se encontra ativado.
Baixa
6
Em volta dos links de algumas seções existem áreas vazias que possuem links que não apontam para lugar algum. Esse erro pode confundir os usuários, já que, deixa áreas vazias com o mesmo aspecto de links reais.
H10
Retirar os links dessas áreas vazias.
Média
7
Ao desabilitar a folha de estilos o conteúdo do website não fica corretamente organizado e as imagens não têm descrição apropriada no atributo ALT. Isso pode confundir usuários portadores de deficiência visual, que utilizam leitores de tela para navegar, a encontrar a informação desejada e se localizar no website.
H8
Estruturar o código HTML de maneira semântica de acordo com as regras criadas pela W3C.
Eduardo Loureiro | contato@eduardoloureiro.com | eduardoloureiro.com
Alta
Inspeção de usabilidade | Website Uni-BH | Novembro 2007
22
3
4
5
6
6
6
Figura 10 – Página inicial do website do Uni-BH
Eduardo Loureiro | contato@eduardoloureiro.com | eduardoloureiro.com
6
Inspeção de usabilidade | Website Uni-BH | Novembro 2007
23
» Programa de bolsas Os problemas 1, 3 e 7 encontrados na página inicial também se repetem na página “Programa de bolsas”. ID Problema
1
2
O conteúdo mais importante da seção, ou seja, as informações dinâmicas, que geram trafego para a seção, são as atualizações sobre inscrições, resultados e outras informações sobre as bolsas. Entretanto esse conteúdo é o que recebe menos destaque na seção, ficando na parte inferior do sub-menu de navegação, a baixo da barra de rolagem da pagina. Além desse fator negativo as informações sobre os tipos de bolsas ficam juntas e misturadas. Tudo isso pode acarretar em dificuldade dos usuários encontrarem as informações desejadas.
O resultado das bolsas, assim como outras informações semelhantes, é divulgado apenas em formato PDF, o que pode impedir usuários portares de deficiência visual de acessar o conteúdo.
Heurística(s) Recomendação desobedecida(s)
Criticidade
Rápida: Trazer o conteúdo do item “Atualizações” para a parte superior do sub-menu de navegação.
H1 H12 H15
H8
Mais complexa: Repensar a estrutura da seção, organizado o conteúdo dinâmico de cada tipo de bolsa, em forma de destaques, no lugar do texto de apresentação. Dessa forma, logo que entrasse nas seção o usuário já veria as inscrições, resultados e outras informações sobre as bolsas, sem precisar procurar essa informação em uma lista de links misturados. Segundo o WCAG (Web Content Accessibility Guidelines), que é um conjunto regras criado pela W3C para assegurar que os conteúdos publicados na internet sejam acessíveis, toda a informação disponibilizada em formato PDF também deve estar em formato HTML.
Média
Alta
Caso a informação precise estar em formato PDF, então ao menos o documento deve ser estruturado semanticamente para tornar-se um PDF acessível e capaz de ser interpretado por um software leitor de tela.
» Calendário e Guia Acadêmico Os problemas 1, 3 e 7 encontrados na página inicial também se repetem na página “Calendário e Guia Acadêmico”. ID Problema
1
A informação que mais interessa em um calendário é a atual, entretanto o mês atual do calendário encontra-se a baixo da barra de rolagem, fazendo o usuário perder tempo tendo que rolar a barra de rolagem até encontrar o mês atual.
Heurística(s) Recomendação desobedecida(s)
H1 H12 H15
Inverter a ordem do calendário fazendo com que os meses passados fiquem na parte inferior e que o mês atual fique visível assim que o usuário acesse a seção.
Eduardo Loureiro | contato@eduardoloureiro.com | eduardoloureiro.com
Criticidade
Baixa
Inspeção de usabilidade | Website Uni-BH | Novembro 2007
24
» Página do curso de Fisioterapia Os problemas 1, 3 e 7 encontrados na página inicial também se repetem na página do curso de Fisioterapia. ID Problema
1
O link “Conheça o site do curso” leva o usuário para fora do website do Uni-BH sem nenhum aviso prévio, o que pode confundir os usuários. Além disso, as informações contidas dentro desse site externo poderiam estar na própria seção do curso no website do Uni-BH, evitando o excesso de cliques e evitando que o usuário saia do website para acessar informações que não tem um motivo claro e evidente para estarem separadas em outra página WEB.
Heurística(s) Recomendação desobedecida(s)
Criticidade
Sinalizar corretamente, que o link leva a um website externo. H4 H6 H15
Integrar o conteúdo do site do curso dentro da própria seção do curso no website do Uni-BH.
Eduardo Loureiro | contato@eduardoloureiro.com | eduardoloureiro.com
Baixa
Inspeção de usabilidade | Website Uni-BH | Novembro 2007
25
5. CONCLUSÕES
Foram encontrados 11 problemas por cada técnica de inspeção de usabilidade, totalizando 22 problemas. Dentre eles apenas 2 problemas foram levantados por ambas as técnicas. São eles:
» Programa de bolsas O fato da informação pertinente, que é dinâmica encontrar-se sem o devido destaque abaixo da barra de rolagem, na parte inferior da página. Além disso, as informações sobre todos os tipos de bolsas encontram-se misturados sem nenhuma estruturação ou organização.
» Calendário e Guia Acadêmico O fato do mês atual, que é o mais importante no calendário, estar situado abaixo da barra de rolagem, enquanto os meses passados encontram-se na parte superior da página. Isso faz com que o usuário tenha o trabalho adicional de mover a barra de rolagem para baixo até encontrar o mês atual.
Eduardo Loureiro | contato@eduardoloureiro.com | eduardoloureiro.com