Opera e Jaws

Novembro 3, 2007 at 11:55 pm (Reviews)

Para terminar a análise da acessibilidade da Direcção Geral da Administração e do Emprego Público, foram usadas duas ferramentas essenciais para descortinar problemas de acessibilidade. Estas foram o browser Opera e o software para pessoas com problemas de visão Jaws. O Opera consegue desformatar uma página Web, tirando-lhe as imagens, as frames, as folhas de estilo e a formatação por tabelas e o Jaws é um leitor de ecrã.

Combinando estas duas ferramentas, o site de DGAEP apresenta, desde logo, o problema da não leitura das imagens. E como a maioria das imagens são hiperligações, não se percebe para onde aquela hiperligação se dirige.

Quando se desformata o site e se tira as imagens, cria-se uma sobreposição de texto, completamente impossível de descodificar. Em termos de estilo, não há títulos, por exemplo. As únicas ênfases são os sublinhados e os negritos.

Desta forma, a análise automática e manual feita anteriormente torna-se mais consistente, mas os problemas principais já tinham aparecido antes. Esta análise só veio confirmar que é importante que as imagens estejam legendadas, e que a formatação, o estilo de uma página de internet, deve ser feita através de CSS’s e não através de HTML, para possibilitar a personalização e a acessibilidade de qualquer conteúdo online.

Permalink Deixe um comentário

Manual de Boas Práticas da Administração Pública

Outubro 28, 2007 at 8:40 pm (Reviews)

Continuando a análise à acessibilidade do site da Direcção Geral da Administração e do Emprego Público, vou recorrer à ajuda do Manual de Boas Práticas da Administração Pública. O que este manual descreve é supostamente obrigatório de ser seguido por lei.

Os seguintes tópicos são um resumo daquilo que o manual descreve. No entanto, os tópicos não comentados são aqueles para os quais não detenho conhecimento para analisar. Só mais tarde poderei fazer uma análise mais consistente, com o decorrer da aula, e o uso de outras ferramentas, como o Jaws.

Em termos de informação mínima, um site tem que apresentar os seguintes conteúdos:

  1. Identificação e descrição do organismo que tutela o Website (com a missão, a descrição das actividades e serviços prestados, a descrição da estrutura organizacional, com eventual recurso a diagramas)

    • Logo no início tem a identificação do organismo que tutela o site (Ministério das Finanças e Administração Pública).
    • A missão, a estrutura, os serviços e publicações, o balanço social e os contactos são apresentados numa página cuja hiperligação se encontra na Homepage. No entanto, logo se encontra o problema de esta hiperligação ser apresentada através de uma imagem cuja alternativa em texto não a descreve eficazmente.
  2. Lista de contactos (endereço postal, telefones, faxes e endereço de correio electrónico), pessoais e/ou institucionais
    • A lista de contactos aparece na hiperligação descrita anteriormente.
  3. Lista com todas as publicações do organismo e respectivos documentos;
    • Há uma lista com as publicações do organismo, na hiperligação acima mencionada. No entanto, não há documentos associados, pois estas publicações não são grátis. Há somente uma descrição de cada publicação, incluindo a editora, o preço, etc.
  4. Legislação pertinente para a actividade da entidade;
    • Na “Orgânica da DGAEP” há legislação sobre a entidade.
  5. Eventos programados ou em curso;
    • Estes eventos aparecem numa lista logo na página principal.
    • No entanto, esta lista é uma mancha de texto pouco descodificável. Não há palavras/expressões em negrito que permitam a uma leitura transversal que permitam perceber o assunto de cada ponto.
  6. Relatório de contas;
    • Não há relatório de contas.
  7. Plano de actividades e orçamento;
    • Não há plano de actividades e orçamento.
  8. FAQ (Perguntas mais frequentes);
    • Há FAQ, mas muito limitada.
    • É muito centrada nos utilizadores que têm que utilizar o site por causa do seu ofício.
  9. Novidades;
    • Aparecem também na lista da página inicial.
    • É difícil distinguir o que é notícia de todas as outras entradas.
  10. Formulários para download;
    • Há documentos para download.
    • Estão sistematizados numa página, apesar de serem só quatro.
  11. Política de privacidade e segurança;
    • Não existe nenhuma hiperligação para este conteúdo.
  12. Primeira visita;
    • Não há nenhuma referência.
  13. Ajuda;
    • Não há ajuda, só FAQ’s, que são bastante limitados.
  14. Mapa do sítio;
    • Existe uma hiperligação para um Índice Detalhado para parece estar em construção.
  15. Motor de busca.
    • Não há motor de busca.

Em termos de Barras de navegação, a página inicial deve conter hiperligações para:

  1. Homepage do governo, administração directa e indirecta do estado/sectorial ou ministerial;
    • Não há hiperligações para a homepage do governo na secção “links”, mas há para outras entidades.
  2. Contactos;
    • A página inicial não tem lista de contactos, isto apresenta-se numa página secundária.
  3. Mapa do Website;
    • Não existe.
  4. Motor de busca.
    • Não existe.

Restantes páginas têm que conter hiperligações para:

  1. Página principal;
    • Nem todas as páginas têm esta hiperligação.
  2. Mapa do Website;
  3. Motor de busca;
  4. Sugestões;
  5. Voltar.

Pontos 2, 3, 4 e 5 não existem neste site.

No que toca à presentação da Informação o site tem que:

  1. Usar um estilo consistente – O uso de CSS – Cascading Style Sheet (folhas de estilo em cascata) pode ajudar bastante a cumprir este requisito. A separação do conteúdo estruturado (feito em HTML) do estilo/apresentação do documento (feito numa folha de estilo em CSS) revela-se altamente benéfico para a potenciação da acessibilidade;
    • A ser verificado posteriormente.
  2. Colocar informação baseada em texto.
    • A maioria da informação é baseada em texto. No entanto, muitas hiperligações importantes estão sob a forma de imagens dificilmente descodificáveis, não só por não serem muito discritivas visualmente, mas também por não terem um texto alternativo que explicite sobre a sua função.

No contexto das Imagens e sons:

  1. Recomenda-se um tamanho inferior a 30Kb e sugere-se o uso de miniaturas, que o utilizador poderá seleccionar para obter a mesma imagem mas com dimensões maiores.
    • Todas as imagens são de um tamanho reduzido.

Quanto ao Texto:

  1. Recomenda-se o uso de fontes do tipo “Sans Serif”, as quais se revelam de mais legíveis para quem lê em ecrãs. São exemplos o estilo “Verdana”, “Arial” ou mesmo “Tahoma”. As fontes e os tamanhos devem ser uniformes ao longo de todo o Website. Também neste particular o uso de CSS se reveste de particular importância. De notar também que o CSS permite definir todos estes elementos de forma diferenciada consoante a informação seja para ser apresentada no ecrã ou impressa. É possível ter um estilo de fonte “Verdana” no ecrã que quando impresso aparece “Arial” ou mesmo “Times New Roman”.
    • As fontes usadas são Sans Serif.
    • No entanto, o tamanho de letra e até as fontes vão mudando, de uma forma não padronizada.
    • CSS ainda para ser analisado.
  2. Procurar o contraste entre o texto e o fundo. Não recorrer a cores para distinguir blocos de texto.
    • Distingue-se bem o texto do fundo. Cores escuros na tipografia e branco no fundo.
    • Os blocos de texto são da mesma cor que o fundo da página (branco).

Indicar sempre o tamanho dos ficheiros para download.

  1. Não há indicação do tamanho dos ficheiros.

Arquivo documental

  1. Existência de um motor de busca.
    • Não há motor de busca.

Software Adicional

  1. Disponibilizar a hiperligação para o fornecedor do software: no caso da acessibilidade, esta recomendação deverá ser complementada com a indicação: sempre que o fornecedor dispuser de soluções relacionadas com acessibilidade, deverá também existir uma hiperligação para as respectivas páginas. É o caso do formato proprietário da ADOBE: PDF. Neste caso existem por parte da ADOBE uma série de recomendações dirigidas aos utilizadores e mesmo aos designers dos formatos PDF. Ver hiperligação do Programa Acesso da UMIC.
    • Há ficheiros em PDF, mas não há nenhuma hiperligação que leve ao fornecedor de software.

Compatibilidade de Browsers

  1. Deverão ser testadas as páginas em dois dos mais utilizados Browsers, nas suas duas últimas versões.
  2. Interessante é notar que na actualização mais recente do Guia de Boas Práticas, o Netscape tenha sido substituído pelo Opera.
  3. Atenção também ao uso de plug-ins. O utilizador pode não conseguir usar os novos plug-ins, por dificuldades de acesso da tecnologia que se encontra a utilizar, ou mesmo por não poder descarregar o plug-in, como poderá ser o caso quando acede num terminal público. É o caso por exemplo do Flash.
    • Este site não parece necessitar de plug-ins. Não utiliza Javascript nem Java.

Rapidez no download da primeira página e das restantes

  1. Tempos de download da página principal inferiores a 8 segundos com modems de 56Kbps;
  2. Tempos de download das restantes páginas inferiores a 20 segundos.

Compatibilidade HTML (recomendação 12)

  1. Recomenda-se o uso das directrizes do W3C no que diz respeito à notação a utilizar.
  2. No manual recomenda-se o uso da ferramenta Bobby para teste em relação aos diferentes navegadores. O Bobby actualmente on-line não permite tal análise. Em vez da verificação face a determinado tipo de navegadores, aconselhamos a conformidade da notação, nomeadamente o HTML e o CSS, com os padrões do W3C.

Resolução Gráfica

  1. Deverá ser possível navegar mesmo usando a resolução mínima.
  2. A norma actual é 800×600 pixéis mas deverá ser possível navegar em 640×480. “Uma regra prática para a construção de páginas é a de evitar que uma página quando acedida na resolução 640×480 surja com barras de scroll horizontais” (Oliveira, 2003: 67).
  3. Outro elemento importante quando se fala na resolução é a impressão de documentos. Documentos formatados rigidamente para resoluções de 800×600 aparecem com a margem direita cortada.

Concepção de páginas Simbolo da Acessibilidade na Internet

  1. Este capítulo trata essencialmente o desenho de páginas Web para cidadãos com necessidades especiais (CNE’s).
  2. Não se deve conceber Websites específicos para CNE’s, nem tão pouco versões simplificadas do Website normal, mas fazer um ÚNICO Website apropriado para TODOS.
    • Este site, logo na página de entrada, apresenta o símbolo da acessibilidade, não havendo mais do que uma versão do site.
  3. Simplicidade na forma; informação em formato texto, usar alt-tags nas imagens, não basear compreensão da informação por diferenças de cor; usar um elevado contraste; evitar contraste verde/vermelho; minimizar a utilização de tabelas; motor de busca posicionado no início da página; afixar o símbolo de acessibilidade à Web.

Conclusão

O site da Administração Geral da Administração e do Emprego Público tem vários problemas na questão da acessibilidade. Juntando a análise automática com esta análise manual bastante superficial, percebe-se que em termos de estrutura e até de conteúdos há muito a faltar ao site. Primeiro, a questão do espaço branco ser definido através de tabelas é um grande entrave à acessibilidade. Um processador de texto vai tentar ler a informação da página seguindo a lógica de uma tabela. O que é totalmente errado na estrutura desta página. Há também a questão das imagens não legendadas, e visualmente bastante ambíguas, e das manchas de texto que não permitem uma leitura rápida e eficaz do conteúdo que apresentam.

No entanto, o que é preciso salientar é o facto de estas normas existirem por uma razão muito pertinente. Um conteúdo, um serviço, um local, deve ser acessível ao maior número de pessoas. E apesar de muitas destas questões focarem as necessidades especiais de um grupo de pessoas, o facto é que tornar um site acessível permite não só o acesso por essas pessoas, mas facilita o uso e percepção desse mesmo site por pessoas sem esse tipo de necessidade. E não nos podemos esquecer que quanto mais fácil for o acesso a um conteúdo online, mais vezes irá uma pessoa voltar àquele site e mais pessoas esse mesmo site irá atrair.

Permalink Deixe um comentário

Análise da Acessibilidade do site da DGAEP

Outubro 28, 2007 at 4:46 pm (Reviews)

O World Wide Web Consortium (W3C) é um consórcio de empresas de tecnologia, em que se inserem as mais importantes organizações desta área. Fundado por Tim Berners-Lee em 1994 com o objectivo de levar a Web ao seu potencial máximo, o W3C aposta no desenvolvimento de protocolos comuns e fóruns abertos que promovem a sua evolução e asseguram a sua interoperabilidade. Desenvolve tecnologias denominadas padrões da Web para a criação e a interpretação dos conteúdos para esta plataforma. Sites desenvolvidos segundo esses padrões podem ser visitados e visualizados por qualquer pessoa ou tecnologia, independente do hardware ou do software. Para alcançar seus objectivos, o W3C possui diversos comités que estudam as tecnologias existentes para a apresentação de conteúdo na Internet e criam padrões de recomendação para a utilização dessas tecnologias. Com a padronização, os programas conseguem aceder facilmente aos códigos e entender onde deve ser aplicado cada conhecimento expresso no documento. De forma a tornar os websites mais acessíveis, principalmente para pessoas com necessidades especiais, o W3C criou a Web Accessibility Initiative (WAI) que desenvolveu directrizes, que podem ter três níveis de importância, para serem seguidas pelos criadores dos sites e seus conteúdos. Idealmente, o seguimento destas directrizes torna o conteúdo de um site completamente acessível para qualquer pessoa e qualquer tecnologia que aceda ao mesmo. Neste contexto, foi-me proposto analisar um site de administração pública portuguesa, que é, por lei, obrigado a obedecer a uma série de normas, incluindo as estipuladas pela WAI, para tornar o seu conteúdo acessível a todas as pessoas e tecnologias Nestas normas, há duas completamente direccionada para o acesso por parte de pessoas com necessidades especiais: concepção de páginas e testes de acessibilidade específicos. O site escolhido foi o da Direcção-Geral da Administração e do Emprego Público (DGAEP). Em primeiro lugar, uma análise manual.

Análise Automática

Para este tipo de análise, foi utilizada a ferramenta Hera, que categoriza os erros encontrados e oferece a localização dos mesmos na página. O url testado foi http://www.dgap.gov.pt/.

Prioridade

Verificar

Bem

Mal

N/A

1

10

-

1

6

2

15

1

9

4

3

13

2

1

3

Como anteriormente foi colocada neste site a lista de directrizes de acessibilidade do conteúdo Web, os erros terão somente uma referência a essa lista.

Prioridade 1

Erros

Ponto 8.1 – Scripts: Utilizam-se eventos dependentes do dispositivo e não existem eventos redundantes.

Pontos a Verificar

Ponto 1.1 – Imagens: Verifique que os textos alternativos, nas 11 imagens da página, resultam adequados.

A verdade é que os textos alternativos se limitam a nomear as imagens de “vazio” ou então nota-se que o texto é a réplica do nome do ficheiro, como por exemplo, no símbolo da acessibilidade o texto é “accesslogosm.gif”.

Ponto 2.1 – Cores: Verifique que não existe informação transmitida apenas pela cor.

Não há nenhum elemento que transmita informação só pela cor.

Ponto 4.1 – Mudanças de idioma: Verifique que todas as mudanças de idioma se encontram correctamente identificados. Deve valorar-se positivamente o uso de atributos como “hreflang” e “charset” para indicar o idioma e o jogo de caracteres no qual se apresentarão os conteúdos enlaçados.

Não há mudanças de idioma.

Ponto 5.1 – Tabelas de dados: Há 5 tabelas com 59 células de dados e nenhuma célula de cabeçalho (<th>). Verifique se há tabelas de dados, onde deverão ser identificados correctamente os cabeçalhos.

Não há tabelas de dados onde cabeçalhos sejam necessários.

Ponto 5.2 – Tabelas complexa: Há 5 tabelas sem células de cabeçalho. Verifique se há tabelas de dados complexas, com vários níveis lógicos de cabeçalhos, que requerem atributos para associar células de dados e de cabeçalhos.

As tabelas neste site são uma forma de distribuição de espaço, não tendo a função normal de hierarquização de dados.

Ponto 6.1 – Folhas de estilo: Verifique se é possível ler o documento quando é interpretado sem as folhas de estilo associadas.

É possível ler o documento sem folhas de estilo associadas.

Ponto 6.3 - Hiperligações: Verifique se os URI das hiperligações são recursos válidos e não, por exemplo, uma função de javascript; Scripts: Verifique que a página pode ser usada, mesmo quando se desactivam os 1 scripts. Desactivando o Javascript e o Java das opções do Mozilla Firefox as hiperligações continuam a funcionar.

Ponto 7.1 – Intermitência de ecrã: Verifique que não se provocam intermitências no ecrã através de scripts ou outros elementos de programação.

Há elementos que cintilam.

Ponto 11.4 – Páginas alternativas: Se a página não é acessível, verifique que se proporciona uma hiperligação para uma página alternativa acessível.

Não há uma hiperligação para uma página alternativa acessível. Esta página já o diz ser.

Ponto 14.1 – Linguagem: Verifique que se utiliza a linguagem mais clara e fácil adequada ao conteúdo do sítio Web e perceptível pelo utilizador alvo.

A linguagem é clara e fácil. Se não houvesse elementos que cintilam, o texto seria bem mais perceptível.

Prioridade 2

Erros

Ponto 3.2 – DTD: A página não contém uma declaração do tipo de documento; CSS: O código das folhas de estilo contém erros.

Ponto 3.3 – Elementos de apresentação: Utilizam-se 18 elementos HTML para controlar a apresentação; Propriedades de apresentação: Utilizam-se 119 atributos HTML para controlar a apresentação.

Ponto 3.4 – Unidades absolutas em HTML: Encontraram-se unidades absolutas nos atributos dos elementos que compõem as tabelas; Unidades absolutas na CSS: Detectaram-se unidades absolutas (in|cm|mm|pt|pc) ou tamanhos de fonte definidos em px nos valores das folhas de estilo.

Ponto 3.5 – Cabeçalhos (h1-h6): Não se usam cabeçalhos.

Ponto 6.4 – Manipuladores de evento: Utilizam-se eventos dependentes do dispositivo e não existem eventos redundantes.

Ponto 7.2 – Flashes: Utiliza-se o elemento <blink>, que provoca flashes no conteúdo da página.

Ponto 9.3 – Manipuladores de evento: Utilizam-se eventos dependentes do dispositivo.

Ponto 11.1 – Tecnologias do W3C: Falta a declaração do tipo de documento (DTD). Utilizam-se elementos que não correspondem às tecnologias do W3C.

Ponto 11.2 – Elementos obsoletos: Utilizam-se 14 elementos obsoletos em HTML 4.01; Atributos obsoletos: Utilizam-se 120 atributos obsoletos em HTML 4.01.

Pontos a Verificar

Ponto 2.2 – Contraste de cores:
Verifique que o contraste da cor entre fundo e primeiro plano (em textos e imagens) resulta suficiente.

Resulta.

Ponto 3.1 – Imagens: Se existe uma linguagem de programação apropriada verifique que não se utilizam imagens para transmitir essa mesma informação.

Muitos dos locais onde supostamente se deveriam ver imagens continuam a ser espaços em branco. Daí, há linguagem de programação adequada a transmitira esta mesma informação.

Ponto 3.6 – Listas: Não se utilizam listas. Certifique-se se há conteúdos da página que devam apresentar-se como uma lista de elementos.

Não existem conteúdos que devam apresentar-se como uma lista de elementos.

Ponto 3.7 – Citações: Na página não se utilizam elementos para identificar as citações curtas (<q> ou longas <blockquote>). Leia a página e certifique-se que não se fazem citações que devam ser marcados correctamente.

Não há citações.

Ponto 5.3 – Tabelas para maquetar: Verifique que o conteúdo das tabelas tem sentido quando se apresentam de forma linear.

As tabelas servem somente para distribuir os elementos visuais.

Ponto 6.5 – Scripts: Verifique que os conteúdos dinâmicos gerados pelos 1 scripts se encontram acessíveis.

Encontram-se acessíveis.

Ponto 7.3 – Movimentos na página: Verifique que não se provocam movimentos na página através de imagens, scripts ou outros elementos de programação.

Não há elementos de movimento.

Ponto 7.4 – Reiniciar página: Verifique se os elementos de programação se utilizam para reiniciar automaticamente a página.

Não há elementos desse género.

Ponto 7.5 – Redireccionamento automático: Verifique se os elementos de programação se utilizam para redireccionar automaticamente a página.

Não existem elementos que tenham essa função.

Ponto 10.1 – Atributo “target”: Há 1 elementos com o atributo “target”. Verifique se se dá conhecimento ao utilizador quando se abrem outras janelas; Elementos de programação: Verifique se os scripts e os elementos de programação em geral não geram novas janelas sem informar o utilizador.

Não há aviso da abertura de uma nova janela no elemento com o atributo “target”; não há elementos de programação que abram novas janelas.

Ponto 12.3 – Blocos de informação: Verifique que os blocos de informação se encontram divididos em grupos manipuláveis.

Não há divisões suficientes.

Ponto 13.1 – Hiperligações: Verifique que os objectivos de cada hiperligação se encontram claramente identificados.

Está tudo correcto.

Ponto 13.2 – Metadados: Verifique a utilização de elementos e propriedades que proporcionam metadados à página.

Está tudo correcto.

Ponto 13.3 – Mapa do sítio: Verifique visualmente se oferece um índice de conteúdos ou um mapa do sítio.

Não há nenhum desses elementos.

Ponto 13.4 – Navegação: Verifique visualmente que os mecanismos de navegação se utilizam de forma consistente.

Há poucos mecanismos de navegações, por isso este ponto não é importante.

Prioridade 3

Erros

Ponto 9.5 – Atalhos de teclado: Não se proporcionam atalhos de teclado.

Pontos a Verificar

Ponto 4.2 – Abreviaturas e acrónimos: Verifique que se define a expansão das abreviaturas e acrónimos utilizando o atributo “title”. Para além disso, deve comprovar se se indica a expansão quando aparecem pela primeira vez no documento.

Há a expansão da abreviatura DGAEP logo no inicio.

Ponto 5.5 – Resumos das tabelas: Há 5 tabelas, nenhuma com células de cabeçalhos. Verifique que não existem tabelas de dados que requerem o atributo “summary”.

Não há.

Ponto 9.4 – Ordem de tabulação: Nenhum elemento contém o atributo “tabindex”. Verifique se existe uma ordem lógica de tabulação através das hiperligações, controlos de formulário e objectos.

Há uma ordem lógica.

Ponto 10.3 – Tabelas: Verifique se se proporciona um texto alternativo linear para todas as tabelas que apresentam o texto em colunas paralelas.

O mesmo dito sobre as tabelas acima verifica-se aqui.

Ponto 11.3 – Preferências do utilizador: Verifique se se proporciona informação para que os utilizadores possam receber os documentos de acordo com as suas preferências.

Não há.

Ponto 13.5 – Barras de navegação: Verifique visualmente se os elementos principais para a navegação se apresentam como uma barra de navegação.

Não se apresentam como uma barra de navegação.

Ponto 13.6 – Hiperligações relacionadas: Verifique que se agrupam as hiperligações relacionadas, que se identificam os grupos e se proporcionam meios de saltar esses grupos.

Há poucas hiperligações, por isso este ponto não interessa.

Ponto 13.7 – Funções de busca: Quando se proporcionam funções de pesquisa, verifique se se disponibilizam diferentes tipos de pesquisa para diversos níveis de categorias e preferências.

Não há funções de busca.

Ponto 13.8 – Informação diferenciadora: Verifique que a informação diferenciadora se encontra colocada no início dos cabeçalhos, parágrafos, listas, etc.

Não há informação diferenciadora.

Ponto 13.9 – Colecções de documentos: Verifique se se proporciona informação sobre as colecções de documentos. (Há 1 elementos <link> com o atributo “rel” ou “rev”.)

Não há informação sobre as colecções de documentos.

Ponto 13.10Arte ASCII: Verifique que se proporciona um meio para saltar sobre um “arte ASCII” quando este ocupe várias linhas.

Não há um “arte ASCII”.

Ponto 14.2 – Complementos do texto: Verifique se se complementa o texto com apresentações gráficas ou sonoras.

Há pouco texto.

Ponto 14.3 – Apresentação: Verifique se o estilo de apresentação é consistente em todas as páginas.

É sim.

Conclusão

Desta forma, os pontos que não foram possíveis de verificar através da análise da Hera já foram verificados manualmente. No próximo “post”, haverá uma análise do site através do Manual de Boas Práticas da Administração Pública.

Permalink Deixe um comentário

Usabilidade – Testes com Utilizadores

Outubro 15, 2007 at 9:41 pm (Reviews)

De modo a testar a usabilidade do site Freemeteo, para complementar as anteriores análises, recorreu-se ao método de teste com utilizadores, em específico o “Field Observation“. O que este método tem de eficaz é o facto de deixar que os utilizadores sejam observados a usar o site como naturalmente o fariam e que, neste caso, executem certas tarefas pré-definidas, de forma a se perceber quais são os problemas do site. Desta forma, foram escolhidos dois utilizadores, um de 14 e outro de 15 anos. Têm os dois conhecimentos bastante razoáveis na língua inglesa, não apresentando dificuldades na leitura de textos simples. Ambos utilizam a internet muito frequentemente. No entanto, nunca tinham visitado o site freemeteo. Três metas foram estabelecidas para os dois utilizadores:

  1. Aceder à “Weather History” da cidade da Maia
  2. Aceder ao “Current Weather” da cidade de Kyoto no Japão
  3. Mudar as unidades de métricas para inglesas

As acções do utilizadores foram registadas da seguinte forma:

  • Número de cliques que cada utilizador deu para atingir o objectivo final
  • Tempo médio que o utilizador demora a atingir o objectivo
  • Quantidade de vezes que o utilizador erra

Aceder à “Weather History” da cidade da Maia

Há vários caminhos possíveis. Mas dois deles necessitam somente de três cliques, os outros precisam de mais, por isso foram excluídos na análise. Através da coluna Quick Pick, seleccionar Porto – Maia – Weather History. Ou através da coluna Select By Region, Porto – Maia – Weather History.

   
 

Utilizador 1

   

Passo 1

Passo 2

Passo 3

Cliques

3

1

1

Erros

0

0

0

Tempo médio

25 segundos

   
 

Utilizador 2

   

Passo 1

Passo 2

Passo 3

Cliques

2

1

1

Erros

0

0

0

Tempo médio

25 segundos

   
 

No início, houve alguma confusão em relação a que direcção tomar, e alguns caminhos errados foram tomados, mas os dois utilizadores rapidamente se aperceberam o que tinham que fazer para atingir a meta.

Aceder ao “Current Weather” da cidade de Kyoto no Japão

O caminho mais curto seria escolher Japan da coluna esquerda e depois Kyoto da barra que abaixo apareceria.

Utilizador 1

   

Passo 1

Passo 2

Cliques

1

1

Erros

0

0

Tempo médio

10 segundos

   
 

Utilizador 2

   

Passo 1

Passo 2

Cliques

1

1

Erros

0

0

Tempo médio

8 segundos

   
 

Mudar as unidades de métricas para inglesas

Esta meta consiste somente num passo. Mas é uma forma de testar a visibilidade da escolha que se encontra do lado direito.

Utilizador 1

    

Passo 1

Cliques

1

Erros

0

Tempo médio

5 segundos

   
 

Utilizador 2

   

Passo 1

Cliques

1

Erros

0

Tempo médio

7 segundos

   
 

Os utilizadores encontraram a informação bastante rápido.

Conclusão

O site Freemeteo é bastante fácil de usar. No entanto, há certos detalhes que confundem os utilizadores. Em primeiro lugar, quando a internet por algum motivo está lenta, é difícil ao utilizadores que pela primeira vez usam o site perceber certas interacções. Por exemplo, as setas à beira das regiões da coluna esquerda abrem um menu pop-up com várias cidades, mas quando a internet está mais lenta, nada parece acontecer, não há nada que demonstre o estado do sistema. Na primeira meta, o utilizador 1 teve esse problema, clicando noutros locais pois o menu não aparecia. Em segundo lugar, há variados caminhos que se podem tomar para atingir as metas. Percebe-se esta característica, pois o site é dedicado a informação meteorológica e pouco mais, dando oportunidade aos utilizadores de percorrerem o caminho que mais lhes agrada.

Permalink Deixe um comentário

Avaliação Heurística (Modificado em 19 de Outubro)

Setembro 30, 2007 at 9:38 pm (Reviews)

A usabilidade é uma grande questão no que toca à construção de qualquer sistema onde a interacção predomine, como um site. Por causa dessa grande importância, 10 heurísticas (princípios) utilizados para avalizar estes sistemas foram criadas por Nielsen e Molich. Estruturadas, posteriormente, de uma forma mais sistematizada, por Lavery, servem-nos agora para perceber quais os aspectos positivos e negativos em determinados sistemas, no que toca à usabilidade. Desta forma, proponho-me a analisar, outra vez, o site Freemeteo, mas da perspectiva das heurísticas de Nielsen.

1- Visibilidade do estado do sistema

São os utilizadores informados sobre o progresso do sistema com feedback apropriado em tempo razoável?

O site Freemeteo tem mudanças em termos de cores, na tipografia, on mouse over. No menu horizontal, as palavras passam de uma cor clara (branco) para uma cor escura (verde escuro) quando o utilizador passa o rato por cima. No menu vertical, as palavras ficam sublinhadas quando a mesma acção é empregue. No entanto, no conteúdo central “current weather“, ao escolher outros separadores, como “7-day Forecast, o mesmo efeito não se verifica. Além disso, quando se carrega em qualquer dos menus, não há nada que demonstre imediatamente que a nossa acção teve um efeito.

No menu vertical, no “select by region“, quando se clica numa das regiões, um círculo em movimento aparece em baixo enquanto o site carrega o outro menu. No entanto, quando se escolhe a segunda região, o único efeito que nos faz ver que realmente a página está a carregar é a ampulheta à beira do ponteiro do rato, o que nada tem a ver com o site em si.

Esta questão é importante porque a informação sobre o progresso do sistema em tempo razoável permite ao utilizador monitorizar o progresso da tarefa que quer realizar e, assim, reduz a ansiedade.

2 – Ajuste entre o sistema e o mundo real

O sistema usa conceitos e linguagens familiares aos utilizadores? São usadas convenções do mundo real? É a informação visualizada numa ordem natural e lógica?

Como Freemeteo é um site de informação meteorológica, o facto é que não há uma grande quantidade de texto maciço. No entanto, há muita informação, visto que a informação que se pode encontrar é, literalmente, de todo o mundo.

Em termos de linguagens, a única utilizada é a escrita. As imagens não são importantes para a navegação no site. A hierarquia da barra lateral é feita por importância/relevância de certas regiões dentro do contexto do país em que o utilizador se encontra. Um ponto negativo é o facto de só ter seis línguas como possível utilização, apesar da informação disponibilizada ser dirigida para todas as partes do mundo.

Um ponto positivo é que o site reconhece imediatamente o país de onde o utilizador está a pesquisar, e daí apresenta como página inicial, as informações meteorológicas correspondentes à capital do país em questão. No entanto, não há uma preservação das preferências locais do utilizador, pelo que este tem sempre que ir procurar a região que quer encontrar, mesmo que esta seja dentro do país onde se encontra.

Um bom ajuste minimiza um conhecimento extra para se usar o sistema, simplificando todo o mapeamento das tarefas. (Isto é conseguido através de um expressão das intuições dos utilizadores nos conceitos dos sistemas.)

3 – Controlo e liberdade do utilizador

Podem os utilizadores fazer o que querem quando querem?

O utilizador não tem problemas em encontrar a informação que pretende, os menus são de fácil aprendizagem e bastante intuitivos. Também são praticamente imediatos, no sentido de se ter logo um efeito a determinada acção. A página é leve, o que não obriga a downloads longos.

Quando um utilizador se engana na sua escolha ou quer voltar à anterior, a única opção é escolher novamente, não há nenhum “undo” ou “go back“.

Esta questão é importante simplesmente porque os utilizadores, por vezes, enganam-se.

4 – Consistência e Standarts

Têm os elementos de design, como objectos e acções, o mesmo significado ou efeito em diferentes situações?

Basicamente, os menus estáticos vão directamente para o que é esperado. Por outro lado, os menus com “pop-up” têm todos a mesma forma de funcionamento. E, por fim, a imagem do mundo com o nome do site, quando “clicado”, vai para a página inicial destinada ao país de onde o utilizador está a aceder à página.

A consistência minimiza o conhecimento necessário pelo utilizador para usar o sistema ao deixá-lo generalizar por experiências naquele sistema (ou noutros).

5 -Prevenção de erros

Podem os utilizadores cometer erros que um bom design pudesse prevenir?

Em princípio, o design do site em nada dificulta a navegação. Até porque o design em questão é bastante minimalista. Um menu horizontal, e vários verticais. No centro, alguns separadores que levam o utilizador onde é suposto levar. Não há causas para frustrações nesta área pelo menos.

Os erros são a fonte principal de frustração, ineficiência e ineficácia durante a utilização do sistema.

6 – Reconhecimento em vez de lembrança

Estão elementos de se design, como objectos, acções e opções, visíveis? É o utilizador forçado a lembrar-se de informação de uma parte do sistema para outra?

Como já referi, o site é bastante lógico e fácil de usar. Os menus estão sempre lá, iguais, independentemente do local onde nos encontrarmos dentro do próprio site. Isto permite que o utilizador consiga aceder à mesma informação estando ou não na página principal, o que leva a um menos nível de cliques, e, portanto, uma maior rapidez no acesso à informação.

Forçar os utilizadores lembrar-se de detalhes é uma grande fonte de erro. Reconhecimento minimiza o conhecimento necessário pelo utilizador para usar o sistema. Sumarizar comandos ou opções disponíveis permitem ao utilizador perceber o seu significado ou o seu papel.

7 – Flexibilidade e eficiência no uso

São os métodos de cada tarefa eficientes? Podem os utilizadores personalizar acções frequentes e usar atalhos?

Os métodos são eficientes, como já fui explicando durante esta análise heurística. No entanto, como também já referi, o site não oferece formas de memorizar o que é mais procurado pelo utilizador. Não há como personalizar estas acções nem como usar atalhos. Até o login no site não permite aceder imediatamente à informação que é pesquisada mais frequentemente. Serve principalmente para se receberem notificações diárias, por email, sobre as áreas escolhidas.

Métodos de tarefas ineficientes podem reduzir a ineficácia e causar frustração.

8 – Estética e design minimalista

Contêm os diálogos informação irrelevante ou raramente necessária?

Não. Freemeteo leva sempre ao utilizador aquilo pelo qual ele pesquisou. Claro que um utilizador normal não precisa de saber toda a informação que o site contém sobre uma determinada área. Assim, quando a escolha é feita, o site apresenta imediatamente a informação que a maioria das pessoas quer saber, isto é, apresenta os dados meteorológicos do dia da pesquisa. No entanto, disponibiliza o resto da informação sobre aquele local, bastando carregar num dos separadores do menu central, como “7-day Forecast“.

A organização tem o efeito de reduzir o tempo de procura por comandos ou recursos de usuários que faltam no monitor. Utilizadores não familiarizados com um sistema muitas vezes têm que encontrar uma acção que vá de encontro a uma necessidade particular – reduzir o número de acções disponíveis pode fazer a escolha mais fácil.

9 – Ajudar os utilizadores a reconhecer, diagnosticar e recuperar erros

São as mensagens de erro feitas em linguagem simples (sem códigos)? Descrevem precisamente o problema e sugerem uma solução?

A única mensagem de erro que consegui encontrar no site foi quando, propositadamente, me enganei no login. O que aconteceu é que abaixo do painel, apareceu o texto “Error. Please try again“. Não explica qual foi o erro, nem o porquê deste acontecer. Fica bem longe do que seria desejável.

Como já foi referido no ponto 5, os erros são a maior fonte de frustração, ineficiência e ineficácia durante a utilização do sistema.

10 – Ajuda e documentação

É fornecida informação de ajuda apropriada? É esta informação fácil de procurar e direccionada para as tarefas do utilizador?

Em termos de ajuda, o único link que encontro é o do “Forgot your password?“, que está colocado imediatamente abaixo do bloco de login. O mapa do site é relativo à área que previamente escolhemos. Isto é, se eu estou a visualizar a informação meteorológica da cidade da Maia, no Porto, quando acedo ao mapa do site, este vai estar de acordo com a cidade da Maia. O resto das informações, como os termos de uso, os contactos, etc., encontra-se no final na página, como é habitual. Como não encontrei grandes dificuldades na navegação do site, percebo o facto de não haver uma área específica de ajuda, nem de FAQ’s.

Idealmente um sistema não deveria necessitar de documentação. No entanto, pode ser necessária para fornecer ajuda a que os utilizadores precisam de aceder num curto espaço de tempo.

Conclusão

Freemeto é um site que tem como objectivo a utilidade imediata. Por tal, em termos de design, não há muito a dizer. Os menus não são pictóricos, são textuais, não há grandes metáforas com o mundo real, mas neste caso não é indispensável, pois os métodos de acesso aos conteúdos são facilmente reconhecidos. No entanto, para um invisual, por exemplo, seria complicado, penso eu, o acesso aos menus pop-up, mas estes não são a única forma de chegar a um certo conteúdo, pois há locais onde se pode pesquisar por nome. Em termos gerais, o site parece-me obedecer às 10 heurísticas de Nielson, tirando um ou outro aspecto. 

Permalink 1 Comentário

www.freemeteo.com – Acessibilidade, Usabilidade e Emotividade

Setembro 23, 2007 at 10:04 pm (Reviews)

O que torna um site num bom site não é somente um design “bonito”, nem um bom conteúdo. É preciso que qualquer página de Internet esteja preparada para o mundo exterior, para o utilizador comum e para aquele que não o é. Daí certas características terem um peso enorme sobre a forma como o mundo vê um site. Cor, eficácia, preparação para novas tecnologias, preparação para tecnologias antigas, utilidade, eficiência, etc. Nada pode ser negligenciado na construção de um site, pois o número de visitas de uma página na Internet está directamente relacionado com a relação entre todos os pormenores.

Assim, apresento uma análise bastante superficial da acessibilidade, da usabilidade e da emotividade do site Freemeteo.

Acessibilidade

Em termos de acessibilidade, Freemeteo tem falhas, mas também aspectos positivos. No entanto, algumas questões não são muito verificáveis por mim, já que não tenho acesso aos utensílios necessários para tal. No entanto, consegui verificar dois exemplos como utilizadora.

Mapa de Prtugal

Em primeiro lugar, o site não oferece alternativas equivalentes entre conteúdos visuais e auditivos. As imagens não têm uma “tradução” eficaz para texto. Por exemplo, a imagem do mapa de Portugal só foi denominada de “PT” no seu url. Para um utilizador que use um sintetizador de discurso esta legenda de pouco serve, pois o utilizador não vai conseguir compreender o que é a imagem.

No que se refere à cor, o site combina-a com texto, o que possibilita que pessoas com limitações visuais, como o daltonismo, não tenham problemas com o seu mapeamento.

Há várias regras sobre a acessibilidade na web sobre as quais não detenho o conhecimento no sentido de as testar, como referi anteriormente. No entanto, tenho que referir o AJAX (técnica de desenvolvimento web que combina, entre outros, javascript e xml), que em muito tem contribuido para melhorar interfaces e usabilidade em páginas da Internet e aplicações da web.

Aqui estão algumas delas:

  1. Usar markup’s (XML, HTML, etc.) e style sheets (CSS) e usá-los correctamente.
  2. Clarificar o uso natural da linguagem.
  3. Criar tabelas que se transformam graciosamente.
  4. Assegurar que páginas que contêm novas tecnologias se transformam graciosamente.
  5. Assegurar o controlo do utilizador sobre mudanças de conteúdos sensíveis ao passar do tempo.
  6. Assegurar acessibilidade directa a interfaces embedded.
  7. Design feito para independência de dispositivos.
  8. Usar soluções transitórias, temporárias.
  9. Usar tecnologias e directrizes W3C.
  10. Fornecer informação contextual e de orientação.
  11. Fornecer mecanismos de navegação claros.
  12. Assegurar que os documentos são claros e simples.

Mais informações em W3C.

Usabilidade

O site Freemeteo tem grande utilidade. Não esquecer a maioria das pessoas não usa sites meteorológicos com intenções muito complexas, simplesmente têm curiosidade de saber como vai estar o tempo (“Posso ir à praia amanhã? Vou precisar de levar o carro para o trabalho? Tenho que ir buscar os meus filhos à escola para não se molharem?”).

No entanto, uma porção da população tem objectivos mais determinantes. Alguns têm a ver com o trabalho, outros com passatempos e eventos, etc. Daí, o facto do site apresentar não só a temperatura e a pluviosidade, mas também a humidade, o vento, a visibilidade, a pressão… Surf e eventos ao ar livre são exemplos de acontecimentos que necessitam de uma previsão da condição temporal de forma detalhada.

Em termos de eficácia e eficiência, o site está bem estruturado. Não é difícil reparar imediatamente na barra lateral esquerda que dá a oportunidade de escolha em primeiro lugar do país e seguidamente de regiões mais pertinentes. E se a região que o utilizador pretende escolher não se encontrar entre estas sugestões, imediatamente abaixo há menus que, por hierarquia, o ajudam a encontrar o que quer.

É bastante fácil de entender e também bastante intuitivo. Há também a possibilidade de se procurar locais através das suas características geográficas e pelas coordenadas geográficas. Como todas as escolhas têm a mesma forma de interacção, é bastante fácil perceber como utilizá-las.

Emotividade

O que mais se realça no site em termos de emotividade são as cores. Azul e verde. Freemeteo é um site sobre meteorologia, portanto, a escolha das cores tem tudo a ver com o tempo e a terra. Azul para o céu. Verde para a terra. Além disso, são cores frias, o que, num site com uma função bastante prática é uma escolha que provavelmente foi feita para prolongar a estadia do visitante, já que as cores frias não cansam tanto.

Para além disso, as imagens (fotos) que se encontram no site são todas apelativas, demonstrativas de bom tempo e de paisagens bonitas e calmas, o que, em princípio, faz o utilizador gostar um pouco mais da sua estadia no site.


A análise acima descrita não é profunda, de forma alguma, pelo que não sou uma especialista. Com novos conhecimentos, novas aprendizagens, modificarei este artigo, para o tornar mais completo e correcto.

Permalink 2 Comentários

www.freemeteo.com

Setembro 17, 2007 at 11:39 am (Reviews)

world map

“Weather forecasts for the entire planet”
htto://www.freemeteo.com/

O site em questão dá informação meteorológica de uma grande vastidão de países, desde o Afeganistão até ao Zimbábue. Tem também uma grande especificidade de locais dentro desses mesmo países.
É um site ainda em estado ‘beta’, mas no entanto a informação detalhada e bastante precisa é um grande achado entre páginas de meteorologia. É de fácil acesso, bastante funcional, nada complicado e a página não é muito pesada.
O único problema que encontro é o facto de ainda não ter sido traduzido para português. No entanto, há possibilidade de escolher entre a língua inglesa, espanhola, alemã, italiana, grega e chinesa.

Permalink 1 Comentário