avaliação heuristica

avaliação heuristica [Nielson 94] ao site da Miscode [v1]

Hoje apenas tive tempo de avaliar 3 pontos! Amanha tento acabar, ou pelo menos avaliar mais algumas heuristicas...

1. Visibilidade do estado do sistema

Conformance Question – CQ: O sistema mantém o utilizador informado acerca do que está a acontecer com o devido feedback, num tempo razoável?

Evidence conformance – EC: ao nível da visibilidade do sistema não tenho nada a apontar, Cada vez que clicamos nalgum link temos uma indicação sonora com um “clique” que nos mostra que vamos entrar numa nova página. Alem disso, e apesar de as páginas abrirem bastante rápido, sempre que abrimos uma página mais pesada temos a indicação “loading” que nos mostra que a página está a abrir.

M - é essencial para o utilizador ter noção de como o sistema está a responder às suas acções: quando clicou em algo realmente clicavel; o que está a acontecer quando uma página demora a abrir... A este nível, e numa primeira análise, não tenho nada a apontar ao site da Miscode.

5. Prevenção de erros

CQ: o utilizador corre o risco de cometer erros?

EC: existem links neste site que não parecem links; e existem elementos gráficos que parecem links. São exemplo disso o banner “fale connosco” que parece uma animação flash e não um link (passou despercebido na avaliação com utilizadores); e existe um elemento gráfico no topo da página “Comunicação Design Sistemas de Informação” que parecem links levando o utilizador a passar o cursor do rato lá inúmeras vezes.

M: à semelhança do que já referi na avaliação com utilizadores, o banner não deveria ser animado para não ser confundido com uma animação e o elemento gráfico colocado no topo da página deveria estar noutro lugar, quem sabe por baixo do logo com menos destaque, ou então poderia mesmo ser transformado em link e levar o utilizador a uma pagina que discriminasse essas três vertentes da Miscode. Seria uma mais valia para a empresa já que o utilizador teria uma noção mais clara das várias funções da Miscode; e seria óptimo para o utilizador que deixaria de “clicar em falso”.


10. Ajuda

CQ: existe informação para ajudar o utilizador, e essa informação é facilmente alcançável?

EC: o site tem motor de busca; Faq´s e mapa de site. No entanto não tem “ajuda”. Tanto o motor de busca, como as FAQ e o mapa de site estão bastante visíveis, contudo parece-me que o mapa de site poderia estar mais discriminado. Quanto ao link para a home page que deveria existir a par das FAQ e do mapa do site, apenas é visível quando se passa o cursor do rato por cima do logo. Apesar de grande parte dos utilizadores estarem já habituados a aceder à home page através do logo, parece-me que seria útil criar um link sempre visível chamado “home” ou “inicio” para que o site fosse usável até mesmo por utilizadores menos experientes.

M: a presença de elementos de ajuda tais como o motor de pesquisa e o mapa de site são preciosos para orientar o utilizador. De facto não deveriam ser necessários, mas devem ser usados para orientar eventuais utilizadores “perdidos”. Um link para a home page claro e sempre visível é igualmente precioso para o utilizador poder navegar com mais segurança e se sentir mais à vontade, pois sabe que mesmo que se perca no site, existe um link sempre presente que o leva ao inicio.


[PS: não liguem à fantastica tradução que fiz das "conformance questions" ...]
*****

Ups!!

pensava que era so para fazer uma apanhado das conclusões da aula passada... e por isso so postei sobre o teste com utilizadores!

Estou a tentar fazer a avaliação heuristica agora.... é isso e tentar não aterrar no teclado! =
***********

teste de usabilidade - teste com utilizadores

Teste de usabilidade ao site da Miscode

Teste com utilizadores

Para este teste estipulei três tarefas distintas:

Tarefa nº 1
O utilizador terá que encontrar o formulário específico de submissão de pedido de orçamento à Miscode.

Passos (o caminho mais curto): Estando na home page teria que aceder a “Parceiros” e encontrava aí juntamente com os logos dos parceiros, o pedido de orçamento.

Passos (o caminho mais longo): Estando na home page teria que clicar no banner que diz “fale connosco” » Seleccionar a opção “peça proposta” e teria então acesso ao formulário.

O teste:

Utilizador número 1:
Depois de 5 cliques (um erro) o utilizador desistiu, ao fim de 4.42 min.

Utilizador número 2:
Depois de 7 cliques (um erro) o utilizador encontrou, pelo caminho mais curto, ao fim de 1.36 min,

Utilizador número 3:
Conseguiu ao fim de dois cliques, e demorou 42 segundos.

Utilizador número 4:
Ao fim de 12 cliques (2 erros) conseguiu pelo caminho mais curto e demorou 2.58 min.

Conclusões:
O balanço é negativo. A média de tempo para o utilizador encontrar este formulário é de 2.02 min.
Na realização deste teste pude anotar que o utilizador navega um pouco por todos os links, tentando perceber qual estará mais relacionado com o pedido de orçamento. Todos acederam ao link “contactos”, o que me mostrou que provavelmente este formulário deveria estar dentro dessa secção.
A anotar também que o atalho “fale connosco” presente na home page não é intuitivo uma vez que ninguém clicou nele. O utilizador número 1 referiu mesmo, depois de lhe mostrar que poderia aceder por esse atalho, que pensava que esse “link” era uma animação Flash e não um botão.

Como é óbvio qualquer utilizador poderia aceder a esta ferramenta através do motor de pesquisa, mas para isso teria que saber previamente da existência dela. Não tendo esse conhecimento, o utilizador provavelmente limita-se a enviar um e-mail à Miscode a pedir orçamento. O que a meu ver é uma perda de tempo e desperdício de recursos já que esta ferramenta simplifica todo o processo. Ou seja, se o utilizador enviasse um e-mail à Miscode a pedir orçamento para uma empresa imobiliária por exemplo, a Miscode teria que responder ao e-mail a pedir dados da empresa, limites de custos…e a empresa teria que voltar a responder. Ora esta ferramenta já implica todas as questões pertinentes para a Miscode fazer um orçamento, e desta forma simplifica a comunicação.

Sugestão:
Tendo em conta os resultados, e depois da observação que fiz durante o teste, parece-me que seria aconselhável colocar este formulário na secção de contactos com uma designação específica tal como “Formulário para Pedido de Orçamento”. Quanto ao link presente na home page terá que ser mais visível: proponho apenas que seja eliminada a animação que o link tem.

(nota: enquanto elaborava esta análise escrita fui navegando no site e só agora reparei que o formulário também está presente na secção “empresa”. Isto remete-nos mais uma vez para um erro ao nível da usabilidade uma vez que alguns dos utilizadores que testei estiveram nessa mesma secção e também não repararam no formulário.



Tarefa nº 2
O utilizador deverá encontrar as propostas de emprego e candidatar-se a Designer no Porto.

Passos: estando na home page: “empresa” » “bolsa de emprego” » “designer (porto)” » “candidatar-se a Porto”

O teste:

Utilizador número 1:
Para executar o primeiro passo precisou de dois cliques, conseguindo depois terminar a tarefa com sucesso. Demorou 2.40seg.

Utilizador número 2:
Conseguiu aceder com sucesso (com cliques acertados) em 45 segundos.

Utilizador número 3:
Demorou 1 minuto. Para executar o primeiro passo precisou de 3 cliques (dois falhados) mas depois conseguiu executar a tarefa com sucesso.

Utilizador número 4:
Precisou de 6 cliques (1 erro) para executar o primeiro passo e no segundo passo precisou de dois cliques. Demorou 1.25seg


Conclusões:
A média de acesso ao conteúdo pretendido foi de 1.30min. Mais uma vez notei que o utilizador anda um pouco à deriva na home page a procurar qual o link que será mais indicado para o conteúdo pretendido. No entanto, comparando com a primeira tarefa o acesso a este conteúdo é nitidamente mais fácil.

Sugestão:
Poderíamos melhorar a usabilidade ao nível deste conteúdo se fosse colocado na home page um link para “recursos humanos” ou se incluíssemos esta informação no menu “contactos” com a mesma descrição: “bolsa de emprego”.



Tarefa nº 3
Aceder a todo o directório de notícias da Miscode.

Passos: (caminho mais curto): estando na home page o utilizador teria que clicar num dos banners de noticias em “ver todas”
Passos: estando na home page: “empresa”» “notícias”

O Teste:

Utilizador número 1:
Demorou apenas 20seg e foi pelo caminho mais curto.

Utilizador número 2:
Demorou apenas 25seg e também conseguiu aceder pelo caminho mais curto.

Utilizador número 3:
Conseguiu aceder pelo caminho mais longo em apenas 27 segundos.

Utilizador número 4:
Demorou apenas 10 segundos pelo caminho mais curto.

Conclusões:
Ao contrário do que pensava este conteúdo até foi bastante acessível. Das três tarefas foi a mais fácil.
Quando me testei a mim própria, antes de propor esta terceira tarefa, tentei aceder às noticias pelos banners da home page, e em vez de clicar em “ver todas” cliquei em cima do próprio banner, o que me remetia para a pagina dessa noticia em concreto e não para o directório de noticias.

-------------------------------

Em jeito de conclusão, resta dizer que o utilizador numero 1, enquanto navegava na home page referiu que pensava que o conteúdo no topo da pagina “COMUNICAÇÃO DESIGN SISTEMAS DE INFORMAÇÃO” fossem links e não apenas elementos gráficos. Pude verificar isso com os restantes utilizadores ao reparar que passavam o cursor por cima desse elemento gráfico várias vezes

Analise do site do ISEP v2

Antes de recomeçar esta segunda análise do site do ISEP, importa dizer que, estranhamente, no meu computador (e sim, estou a usar Opera e Jaws, tal como na faculdade) os atalhos “G” para fazer desaparecer as imagens, e “CTRL+G” (para navegar sem tabelas) não funcionam. Em vez disso abrem uma janela de “localizar”.
De qualquer forma, é possível, através do menu “ver” escolher essas funções para testar o site.

Assim, e após uma segunda análise (agora a solo =P) deste site posso dizer que, quanto a mim, os maiores erros estão ao nível:

. Da criação de diferentes sites para diferentes necessidades (uma versão flash e uma versão html);
. Do uso de tabelas erradamente;
. Das imagens que funcionam como links mas que não tem atributo Alt;
. Da utilização de elementos flash.

Sendo assim, e agora de forma mais detalhada, podemos ver que na primeira página estão disponíveis duas versões do site: uma em flash e outra em html.
Como já tinha referido no post anterior isto vai de todo contra o design inclusivo e universal.
Alem disso nem sequer é possível, para um invisual por exemplo, aceder à versão html uma vez que este menu inicial está organizado numa tabela.
Isto é um grande erro na medida em que o leitor de ecrã (neste caso o Jaws) lê a tabela linha a linha, distorcendo desta forma a informação que se pretende transmitir, já que a leitura, neste caso, para ser coerente, deverá ser feita na vertical e não na horizontal. Daí que quem entra neste site e começa a navegar com a ajuda de um leitor de ecrã, não consegue saber qual dos botões “entrar” é o link para a página html.
Se fizermos “ver » estilo » desactivar tabelas” vemos o quão ridícula e incoerente fica a formatação.

O uso de tabelas mantem-se ainda em algumas páginas internas distorcendo a informação. Teria sido muito mais inteligente usar notação e folhas de estilo para posicionar os elementos do layout.

Ainda na primeira pagina, podemos apontar mais uma falha de prioridade de nivel um: logo na pagina inicial tem uma imagem que serve como link para a pagina do IPP (instituto politecnico do porto) e que por não ter atributo "alt" o leitor de ecrã não lê. Assim ao navegarmos por links (tecla A), quando essa imagem é seleccionada não há indicação nenhuma. O mesmo acontece com mais uma imagem (link para a empresa responsável pelo desenvolvimento do site) que apesar de ter uma tag não tem atributo alt, e por isso, mais uma vez, ao navegarmos por links esse passa despercebido. [note-se que nas paginas internas, o próprio link para as normas de acessibilidade não tem atributo alt!!].

Finalmente ainda na primeira página existem dois elementos em flash (post it e menu “entrar” do lado direito) sem conteúdo alternativo que substitua esta funcionalidade. Ora, tendo em conta que, pelo menos o “post it” tem informação considerada importante, isto é uma falta grave. Além do mais este elemento flash serve também como link para os assuntos que anuncia, privando desta forma os invisuais [ou qualquer pessoa que por algum motivo prefira navegar pelo site através de um leitor de ecrã] dessa informação.

Estes dados pude obter através de uma avaliação manual utilizando, como já referi, o browser Opera em conjunto com o leitor de ecrã Jaws.

No entanto ferramentas como o Hera ou o Examinator permitem fazer uma avaliação automática e mostram mais alguns erros.
Para esta análise usei o Hera, o Examinator e o W3C markup validation service que detectou 25 erros ao nível do código fonte (por exemplo a falta de atributos como width, height, quality…) bem como o uso de uma versão HTML (html 4.0) desactualizada.

[..e vou dormir = ... to be continued..]

analise automatica e manual do site do Isep

Analise do site do ISEP


Por falta de material (phones…lol) este site foi analisado em conjunto com a Maria.

A primeira análise deste site foi feita com base por um lado numa análise automática (com a ferramenta Hera) e por outro numa análise manual (com o browser Opera, e o leitor de ecrã Jaws).

Antes de mais importa dizer que avaliamos a versão html do site… e este é precisamente o primeiro erro encontrado. Com efeito, este site apresenta-se em duas versões: uma em flash e outra em html. Isto vai desde logo contra a noção de acessibilidade, na medida em que o grande desafio deve estar na construção de sites universais e não em versões simplificadas para pessoas com necessidades especiais.
A acrescentar que, além do site estar disponível em duas versões, um invisual, sozinho, nunca teria forma de aceder à versão html uma vez que através do leitor de ecrã não é dada informação ao utilizador sobre qual link entra em qual versão:

O leitor de ecrã quando lê cada um daqueles botões “entrar”, lê de forma igual, e não existe qualquer ligação ao botão com a versão correspondente.


Correndo então o programa hera, o resultado foi:


Como podemos verificar existem dois erros de prioridade 1 e 11 possiveis erros a verificar. Nesta primeira análise vou apenas focar um dos pontos mais importantes e que falha neste website: a não disponibilização de textos equivalentes às imagens. Com efeito, e segundo o Hera, existem 8 elementos gráficos sem o seu correspondente textual.

Com a utilização da ferramenta Jaws pudemos também ter a percepção do quão “doloroso” é ter que navegar num site através da audição. Não só pela monotonia do discurso, pela linguagem pouco perceptível mas também pelo facto de sermos obrigados a ouvir inúmeras vezes os mesmos conteúdos. Neste sentido sugeríamos por exemplo que o menu que surge no início de todas as páginas aparecesse somente no fim da página para que o leitor de ecrã não o repetisse cada vez que o utilizador abre uma nova pagina. Assim, o utilizador poderia aceder de imediato aos conteúdos sem ter que ouvir todo o menu de novo. Quando quisesse aceder ao menu poderia faze-lo facilmente premindo a tecla A (avançar de link para link).

Para terminar esta primeira análise resta dizer que, a fim de intensificar esta experiência com o programa Jaws (enriquecedora, quanto a mim) optamos por desligar o monitor… escusado será dizer que nos perdemos completamente no site e tivemos que voltar a ligar inúmeras vezes o monitor para voltarmos a fazer “refresh” no site e começar a navegação de novo.

analise do site do ministerio da educação v2

[antes de mais fica aqui o endereço electronico do ministerio da educação que não escrevi no outro post].

Em primeiro lugar faço desde já uma revisão à pseudo análise anterior: ao contrário do que havia referido, neste site as tags não funcionam na totalidade, independentemente do browser ou sistema operativo. Algumas imagens, completamente dispensáveis, não têm nenhuma tag associada. A acrescentar também que depois de prestar mais atenção ao site reparei que, ao contrário do que tinha escrito no post anterior, este site tem pouca legibilidade, nomeadamente na caixa de pesquisa, onde mal se distingue a fonte branca por cima da caixa cinzento claro. O mesmo acontece na secção de notícias no canto inferior direito, onde mal se distingue as datas no fundo da página; e ainda no rodapé, na barra de ferramentas, que tem links igualmente imperceptíveis, indo assim contra a norma 3 do guia de boas praticas na construção de websites da Administração Directa e Indirecta do Estado, segundo a qual se deve procurar o contraste entre o fundo e o texto.

Como já havia referido na análise anterior, este site tem algumas falhas ao nível da informação mínima a publicar. Assim, não possui:

- FAQ´s (perguntas frequentes),
- ajuda,
- primeira visita (informação útil para quem visita o site pela primeira vez, nomeadamente ao nível de conteúdos do site, serviços, estruturação da informação ou esquema de navegação definido),
- missão de valores,
- politicas de privacidade e segurança,
- formulários para download,
- ligação para a home page do governo,
- arquivo,
- link para “voltar”.

Além disto tem também graves falhas ao nível da interactividade com o utilizador, uma vez que não tem link para sugestões ou reclamações, fórum ou chat on-line, nem newsletter, violando assim a norma 24 do guia de boas práticas supracitado.

No entanto quanto à apresentação da informação, o site possui um estilo consistente, apresentando contudo algumas falhas na medida em que muitos dos documentos são apresentados em formato PDF o que tem implicações ao nível das normas 3 e 7 uma vez que não disponibiliza nenhum link para fazer o download do software necessário para visualizar o documento, o que pode levar o utilizador a desistir de visualizar esse mesmo ficheiro.

Ainda em relação ao ponto 3, e como já referi, a utilização de imagens deve ser evitada na criação de web sites para reduzir o tempo de download da pagina. Neste site são usadas quatro imagens logo na home page. Ainda que não sejam muito pesadas, estão incluídas no site apenas por motivos estéticos, e portanto são inúteis.

Por outro lado este site respeita a norma de 800x600 [não consegui testar com a resolução 640x480] permitindo que mais pessoas tenham acesso aos conteúdos da página sem precisarem de fazer scroll na horizontal. [... tanto que neste momento tenho o site quase a entrar-me pelos olhos dentro... e ainda assim não tenho que fazer scroll na horizontal =) (que giro... a máscara do media player ocupa-me quase o ecra todo em 800x600... era capaz de me habituar a isto..lol....e isto de brincar com a resolução do ecrã vai ter que acabar porque organizar o desktop todo outra vez dá trabalho).

.

Finalmente, outro aspecto positivo neste site é a clareza da linguagem e maneira clara, simples e limpa como o site está estruturado.

analise do site do ministerio da educação

Numa primeira e rápida análise é possivel verificar que muitas das falhas deste site encontram-se ao nivel dos conteudos obrigatorios a afixar, e portanto, são falhas graves. São exemplos a ausencia de FAQ´s; de ajuda; de missão e valores da entidade; de politicas de privacidade e segurança e do nome da entidade fornecedora do site.
Além disto não tem ligação para a home page do governo nem link para sugestões ou botão para voltar.
No entanto, ao nivel da apresentação de conteudos parece-me um site bastante claro e consistente uma vez que mantem sempre a mesma estrutura na apresentação da informação e uma vez que recorre a fontes nao serifadas e por isso mais legiveis. Ao nivel da cor parece-me que a relação fundo texto está bem conseguida, no entanto o facto de existir texto a cores tais como laranja pode trazer algumas dificuldades de leitura.

Outro aspecto positivo neste site é a utilização de codigo html e css´s.
Contudo algumas funcionalidades não estão operacionais em alguns browsers / sistemas operativos, tais como as tags.


(to be continued....)