UNIVERSIDADE FEDERAL DO PARANÁ - UFPR ESPECIALIZAÇÃO EM INFORMÁTICA

METODOLOGIA PARA AVALIAÇÃO DE SITES

SIMONE RODRIGUES CERVANTES

Monografia Final de Especialização em Informática.

Turma 2007

Curitiba – 2009

Simone Rodrigues Cervantes

METODOLOGIA PARA AVALIAÇÃO DE SITES

Monografia apresentada ao Programa de Pós-Graduação lato sensu da Universidade Federal do Paraná como requisito parcial para a obtenção do título de Especialista em Informática. Turma 2007.

Curitiba – 2009

Parecer de Aprovação Monografia de Especialização em Informática

Ênfase em Desenvolvimento de Sistemas para Web

Programa de Pós-Graduação em Informática/UFPR

Declaramos que a aluna SIMONE RODRIGUES CERVANTES entregou a versão final da

sua Monografia de Especialização em Informática da Universidade Federal do Paraná, com

Ênfase em Desenvolvimento de Sistemas para Web, intitulada Metodologia para Avaliação

de Sites

Curitiba, 17 de agosto 2009

LAURA SANCHEZ GARCIA

Professor Classe Associada

Universidade Federal do Paraná

Setor de Ciências Exatas

Departamento de Informática

Caixa Postal 19081

CEP 81531-990 - Curitiba-PR

ANDREY RICARDO PIMENTEL

Professor Classe Adjunto

Universidade Federal do Paraná

Setor de Ciências Exatas

Departamento de Informática

Caixa Postal 19081

CEP 81531-990 - Curitiba-PR

AGRADECIMENTOS

Estudar usabilidade foi muito bom para essa fase de minha vida, além de ter

meus conhecimentos ampliados, possibilitou-me avaliar com maior detalhe os sites

que desenvolvi e aplicar neles os novos conhecimentos adquiridos.

Agradeço à professora e orientadora Laura Sanchez Garcia, pelo apoio e

encorajamento contínuo na pesquisa, aos demais professores pelos conhecimentos

transmitidos.

Agradeço a todos que colaboraram comigo para realização deste trabalho,

minha família e meus amigos que me apoiaram a fazer essa especialização.

SUMÁRIO

AGRADECIMENTOS ........................................................................................ 4

1. INTRODUÇÃO ..................................................................................................... 1

1.1 PROBLEMA ............................................................................................. 1

1.2 OBJETIVO ............................................................................................... 3

1.3 JUSTIFICATIVA ....................................................................................... 5

1.4 PASSOS METODOLÓGICOS ................................................................. 6

2. REVISÃO DE LITERATURA ............................................................................... 7

3. AVALIAÇÃO DOS SITES .................................................................................. 11

3.1 Rol Sul Rolamentos ............................................................................... 11

3.1.1 Objetivo ................................................................................................. 11

3.1.2 Princípios (diretrizes) que o site cumpre. ............................................... 11

3.1.3 Problemas (diretrizes desconsideradas) que o site não cumpre. .......... 15

3.2 Empório Pancy ...................................................................................... 18

3.2.1 Objetivo ................................................................................................. 18

3.2.2 Princípios (diretrizes) que o site cumpre. ............................................... 18

3.2.3 Princípios (diretrizes desconsideradas) que o site não cumpre. ............ 22

4. AMBIENTES PROPOSTOS .............................................................................. 24

4.1 Rol Sul Rolamentos ............................................................................... 25

4.1.1 Pesquisa ................................................................................................ 25

4.1.2 Notícias .................................................................................................. 26

4.1.3 Comunicando problemas técnicos ......................................................... 27

4.2 Empório Pancy ...................................................................................... 29

4.2.1 Slogan ................................................................................................... 29

4.2.2 Revelando o conteúdo através de exemplos ......................................... 30

4.2.3 Pesquisa ................................................................................................ 31

4.2.4 Comunicando Problemas Técnicos e Emergências .............................. 32

5. CONCLUSÕES E TRABALHOS FUTUROS ..................................................... 33

REFERÊNCIAS ......................................................................................................... 34

LISTA DE FIGURAS

(Figura 01) Campo Pesquisa para facilitar a busca de produtos 25

(Figura 02) Inclusão de Notícias para os usuários se manterem informados 26

(Figura 03) Informando Problemas Técnicos 27

(Figura 04) Foi adicionado Datas para referenciar cada notícia 28

(Figura 05) Inclusão de Slogan da Empresa 29

(Figura 06) Apresentação de Produtos em destaque na home 30

(Figura 07) Campo Pesquisa para facilitar a busca de produtos 31

(Figura 08) Comunicando Problemas Técnicos ....32

1. INTRODUÇÃO

1.1 PROBLEMA

Geralmente nos confundimos com a diferença na estrutura de sites que foram

projetados por pessoas diferentes. Cada um tende a criar o seu "padrão" e utilizá-lo

sempre, o que complica bastante as pessoas que ainda vão trabalhar naquela

estrutura (web designers e programadores).

Criar sites que utilizam todos os recursos disponíveis não garante a qualidade

do produto final. É importante que a criação do site seja bem planejada para

oferecer o maior conteúdo possível, de forma agradável e interativa, levando o

usuário a se identificar com o espaço.

Segundo MARTIM (1992), estar perdido em um site, como em qualquer outro

sistema de hipertexto, é a situação na qual o usuário não compreende a sua

organização, não encontra o que procura ou até se a informação desejada está

disponível. É uma situação bastante comum de se observar, até entre os fluentes na

linguagem da web.

Os usuários inexperientes se sentem oprimidos por homepages que não os

ajudam a entender claramente suas opções. Quando não conseguem entender um

website, os usuários podem ficar confusos ou envergonhados, e dificilmente eles

voltarão novamente. Eles simplesmente abandonarão o site e procurarão outros em

que se sintam mais bem acolhidos. Os usuários mais experientes costumam não

esquecer da primeira experiência. Se suas necessidades atuais não forem

atendidas, eles lembrarão dessa ocorrência.

2

À medida que o usuário adquire um maior conhecimento da estrutura do site

diminui o sentimento de estar perdido e aumenta a satisfação com o sistema.

Cada site possui menus e outros elementos de interface diferentes dos demais.

Com essa falta de padronização os usuários não conseguem aproveitar em um novo

site o aprendizado da navegação em sites anteriores. A cada novo site o usuário

precisa aprender como navegar nele.

O conhecimento e a experiência acumulada de projetistas de interface têm

constituído na identificação e no registro de diretrizes ergonômicas. Estas

orientações constituem uma base sólida a partir da qual é possível construir sites

com qualidade mínima assegurada. Portanto, as diretrizes para o projeto de sites

com usabilidade apoiam o projetista na atividade de design, e facilitam a tarefa do

usuário por meio da garantia de produtos que atendem as suas necessidades.

3

1.2 OBJETIVO

O presente trabalho tem por objetivo revisar dois sites de acordo com as

diretrizes de Jakob Nielsen, ou seja, descrever os objetivos do site, os princípios

(diretrizes) que ele cumpre e os problemas (diretrizes desconsideradas), conforme

descreve NIELSEN (2002)

Na internet a concorrência está muito disputada e qualquer dificuldade ou

barreira encontrada pelo cliente/usuário pode ser o suficiente para se perder o

cliente para a concorrência. Por isso, a preocupação fundamental é agregar os

conceitos de usabilidade com o planejamento da interface, garantindo que o usuário

final atinja seus objetivos de forma intuitiva. Ao projetar um site é necessário se

preocupar com sua usabilidade. Mais usabilidade é sinônimo de maior flexibilidade e

de maior interação. Usar padrões e ser consistente ao criar seus elementos, criar

bons pontos de referência para que seus usuários não se percam em seu ambiente

virtual.

A interface é uma das partes mais importantes de um website, pois concentra a relação visitante-sistema. É o que apresenta informações e estímulos e recebe respostas, colocando a manipulação nas mãos do usuário. Por isso, muito mais que um visual bonitinho, deve ser o elemento de transição entre o mundo real e o digital. O ideal é que ela seja transparente, invisível, natural, sintética, intuitiva, prática (RADFAHRE, 1998. p. 106).

Diante do exposto, percebe-se que o design de interfaces pode se tornar algo

complexo. Uma estratégia que funciona bem para um site pode estar totalmente

errada para outro. Um site somente será bem-sucedido se ele der suporte adequado

às intenções, ao comportamento e aos objetivos do seu usuário real. Esta é a idéia

do design centrado no usuário.

4

O trabalho será desenvolvido com a intenção de reunir informações úteis sobre

usabilidade e sua aplicação em websites.

5

1.3 JUSTIFICATIVA

O desafio está em estruturar uma homepage que permita acesso a todos os

recursos importantes, sem se perder na página com todos eles, o que espanta, na

maioria das vezes, os novos usuários. Acomodação e clareza são fundamentais,

assim como perceber os objetivos dos usuários.

O resultado é a garantia da usabilidade do site, envolvendo a navegação, a

informação e a estrutura lógica do ambiente. Se o usuário se sentir satisfeito

retornará ao website e até divulgará seu endereço para outras pessoas.

6

1.4 PASSOS METODOLÓGICOS

Para atingir o objetivo deste trabalho será realizada uma pesquisa bibliográfica

sobre usabilidade na internet, através dos seguintes passos:

Revisão de literatura onde está sendo desenvolvido este estudo, através da

análise do livro Homepage: USABILIDADE - 50 Websites Desconstruídos de Jakob

Nielsen (2002).

O conhecimento técnico é indispensável para execução dessa fase, pois será

usada aplicação de todas as informações adquiridas para o desenvolvimento do

projeto.

Necessária a utilização de internet, onde serão feitas pesquisas sobre a

aplicação de usabilidade com base nos princípios de design e critérios de

usabilidade.

Avaliação de dois sites que desenvolvi (Rol Sul Rolamentos e Empório Pancy),

pelas diretrizes do autor selecionado, analisando todas as diretrizes e mostrando os

princípios (diretrizes) que o site cumpre e princípios que o site não cumpre (diretrizes

desconsideradas).

Através dessa avaliação é possível verificar quais itens os sites deixam a

desejar, e através desses itens foram propostos novos ambientes levando em conta

somente as diretrizes que tiveram seu maior número desconsideradas.

7

2. REVISÃO DE LITERATURA

A revisão de literatura consistiu de uma revisão prévia de alguns autores

seguida da escolha pelo Jakob Nielsen, devido ao fato de este autor ser uma

referência na área de Interação Humano – Computador na visão da Engenharia de

Usabilidade.

Na avaliação dos sites, foram aplicadas as diretrizes e identificadas àquelas que

não tinham sido contempladas em cima dos projetos originais. Relatamos tudo na

forma abstrata e na forma detalhada.

No redesign (elaboração de novas telas), buscou-se revisar os produtos originais

de forma a eliminar os problemas detectados no passo imediatamente de avaliação.

Existem diversas metodologias de avaliação de sites que podem ser utilizadas

como base. O livro e-Usabilidade de Simone Bacellar Leal Ferreira e Ricardo

Rodrigues Nunes Hoa Loranger, Usabilidade na Web de Jakob Nielsen e Hoa

Loranger.

Dentre os trabalhos disponíveis, foi selecionada a metodologia desenvolvida

pelo “pai da usabilidade na web” (NIELSEN, 2002).

Os princípios a seguir, da autoria de Nielsen (2002), representam uma base

sólida a partir da qual é possível construir uma homepage que funcione.

Objetivo do site: na homepage é necessário informar onde o usuário se

encontra, o que a empresa faz, o que os usuários podem fazer em seu site. Se o site

perder a direção aqui, será difícil para o usuário se achar nele. É necessário exibir a

8

logo da empresa em tamanho razoável e em um local de destaque, incluir um slogan

simples, que vá direto ao ponto.

Como transmitir informações sobre sua empresa: as pessoas gostam de

saber com quem estão negociando, e os detalhes sobre a empresa dão credibilidade

ao site. É preciso agrupar informações da empresa, como Sobre Nós, Sala de

Imprensa, Empregos, entre outras informações, em uma única área reservada.

Incluir um Fale Conosco para estimular o usuário a entrar em contato direto com a

empresa. Não exibir informações internas da empresa ao website público, quando

for assim utilizar a intranet para informações destinadas aos funcionários.

Criação do Conteúdo: é um dos aspectos mais importantes em todo o web

design. A maioria dos usuários decide em continuar navegando na página quando

bate os olhos no conteúdo. O ideal é transmitir o máximo de informações com o

mínimo de palavras, evitando assim conteúdos redundantes. Evitar usar espaços e

pontuação para dar ênfase em palavras ou frases.

Revelando o conteúdo por meio de exemplos: os exemplos ajudam a

transmitir imediatamente o que o site faz, para que os usuários saibam se estão

navegando no site de sua preferência. Os exemplos ajudam os usuários a navegar

com êxito, pois mostram o que existe por trás de nomes de categorias abstratas.

Links: é necessário seguir as diretrizes de design para os links dos sites,

principalmente para que o usuário obtenha êxito na sua operação.

Navegação: a navegação tem que ser facilitada em todo lugar do site, pois é

através dela que os usuários vão encontrar o que estão procurando e o essencial é

que isso não gere muito trabalho.

9

Pesquisa: a pesquisa é um elemento muito importante em um site e é

necessário que os usuários a localizem facilmente.

Ferramentas e atalhos para tarefas: são métodos excelentes para agilizar

recursos de seu site e atender mais rapidamente as necessidades dos usuários.

Gráficos e animação: os gráficos e animações devem ser utilizados para

apresentar um conteúdo real e não somente para decorar o site. Não usar a

animação para o único propósito de chamar a atenção para um item no site.

Raramente, a animação tem um local na página porque distrai a atenção voltada

para outros elementos.

Design Gráfico: ele não deve ser utilizado como ponto de partida, mas sim

ajudar a conceder uma noção de prioridade ao design da interação, chamando a

atenção do usuário para elementos mais importante da página.

Componentes da interface com usuário: usar somente quando forem

necessários para uma tarefa, como os menus suspensos, lista de seleção e caixas

de texto.

Títulos de janela: os títulos devem ser simples e objetivos. Eles desempenham

um importante papel na marcação e localização de sites com mecanismos de busca

e pesquisa. Para serem pesquisáveis, os títulos de janela devem transmitir o máximo

de informações possível com o mínimo de palavras.

URLs: é necessário manter os nomes das URLs mais simples, fáceis e

memorizáveis possível. Os usuários devem se lembrar facilmente das URLs como

do domínio da Empresa.

10

Notícias e comunicados à imprensa: é necessário criar títulos e sinopses

eficientes, eles devem fornecer informações aos usuários, em vez de convencê-los a

clicar no link.

Janelas pop-up e páginas intermediárias: o interessante é que o usuário

acesse o conteúdo do site principal imediatamente sem se preocupar com pop-up e

telas intermediárias.

Publicidade: os usuários aprenderam a ignorar os anúncios publicitários em

websites. Para posicionar anúncios fora da área de banner (faixa) padrão, no início

da página, rotule-os como publicidade, para que os usuários não os confundam com

o conteúdo de seu site.

Comunicando problemas técnicos e tratando de emergências: é importante

manter os usuários informados caso o site enfrente algum problema ou emergência.

Créditos: evite informar créditos inúteis no site, pois os usuários vão em busca

de conteúdo.

Recarregamento e atualização de página: atualizar as páginas somente

quando solicitadas pelo usuário e manter a transição o mais suave possível.

Obtendo dados do cliente: muitos sites na web solicitam dados pessoais do

usuário como e-mail, telefone, endereço. Mas muitas pessoas têm restrições quanto

a liberar suas informações pessoais, porque elas já sabem que isso resultará em um

e-mail comercial e caixas de entrada superlotas.

Datas e horas: os usuários precisam saber se as informações do site são

atuais. É interessante lembrar-se de formatá-las de modo que todos os usuários

possam convertê-las para a hora local.

11

3. AVALIAÇÃO DOS SITES

3.1 Rol Sul Rolamentos

3.1.1 Objetivo

O objetivo do site Rol Sul Rolamentos é aumentar a interação com seus clientes

através de um site dinâmico, e estar sempre pronto para atender as necessidades

de seus clientes, por isso disponibiliza os produtos e a descrição de cada e também

vários catálogos para downloads.

3.1.2 Princípios (diretrizes) que o site cumpre.

A logomarca da empresa é exibida no topo da página dando destaque e com um

tamanho razoável.

Grande parte do site é destinada a área do conteúdo, onde serão listadas todas

as informações importantes e de alta prioridade.

A homepage oficial do site é designada através de botões ou links chamando

“Home”, que são direcionados somente para essa página principal.

Não é utilizada a palavra “website” para se referir a qualquer outro aspecto da

empresa.

A página Home possui um layout diferente das outras páginas existentes no site,

possuindo um espaço para imagem e banner em flash na lateral direita. Isso facilita

12

o usuário a reconhecer os pontos iniciais quando voltarem de uma página interna

para a home.

As informações sobre a empresa estão em uma única área. Mostrando os

objetivos, compromissos, endereço e distribuidor da empresa. Facilitando a busca

de informações em um local destacado. Para entrar em contato e enviar mensagem

a empresa, basta ir no link “Contato”.

Não são fornecidas informações internas da empresa no site para acesso aos

usuários. Essas informações são destinadas somente aos funcionários e

permanecem em uma área interna.

Os links e o conteúdo são claros e diretos, evitando assim informações

redundantes. Por isso, não são utilizadas frases eruditas nem dialeto de marketing

que fazem com que as pessoas tenham um trabalho enorme para descobrir o que

está sendo dito.

São empregadas letras maiúsculas e padrões de estilo com consistência, pois o

conteúdo é gerenciado por uma única fonte que seguiu os padrões adequados. Mas

não são utilizadas todas as letras em maiúsculas, pois elas não são tão fáceis de

serem lidas quanto aquelas maiúsculas/minúsculas.

Não são utilizados títulos que desperdiçam um espaço sem sentido no site, mas

sim são destacados de forma que o usuário compreenda que aquela informação

está destacado (geralmente com tamanho de fontes maiores e melhores disposição

na página).

São evitados os pontos de exclamação, pois não pertence à grafia profissional.

Foram evitados espaços e pontuação para da ênfase a uma palavra ou frase. A

pontuação incomum reduz a legibilidade.

13

Para cada produto existe um link que vai diretamente as informações referentes

a ele, evitando assim que o usuário se perca ou tenha que ficar procurando várias

vezes aquilo que deseja.

Os links são de fácil acesso e estão em uma área destacada no site, facilitando

assim a sua visualização. Não são usadas instruções como “Clique Aqui” e “Mais..”

(em final de uma lista de itens), mas sim textos significativos para informar aos

usuários o conteúdo daquela página.

A área de navegação principal está em um local bastante destacado e os itens

são agrupados entre si dentro dessa área, facilitando assim sua visualização. Os

links são bem objetivos e não foram criadas muitas áreas de navegação para cada

item, tornando-os bem objetivos. Também não foram incluídas ferramentas que não

estejam relacionadas com as tarefas que os usuários costumam fazer e procuram no

site. Não existe ferramentas que produzem funções do navegador, como definir uma

página como página inicial ou marcar como favorito.

As fotos e imagens utilizadas são todas editadas, tratadas e cortadas

adequadamente para se manter uma melhor visualização pelo usuário. Não foi

usada animação em elementos como logotipo, slogan ou titulo principal. Os textos

são todos formatos com estilos de fonte, tamanho e cores tornando assim mais

agradável sua leitura. Foi evitada a rolagem horizontal na resolução 800x600, pois

causa problemas na usabilidade (usuários não conseguem visualizar a barra de

rolagem e perderem o conteúdo que rola para fora da tela). Os elementos mais

importantes da página estão visíveis na primeira tela, sem utilizar a barra de

rolagem.

14

O logotipo da empresa foi disponibilizado pelo cliente e está bem visualizado na

página. Para uma melhor visualização, não foram utilizados menus suspensos, pois

não são tão eficientes quanto aqueles que estão totalmente visíveis.

Os títulos das janelas foram todos definidos com o nome da empresa “Rol Sul

Rolamentos”. Isso beneficia nas listas de marcadores e resultados da pesquisa.

Foram limitados a poucas palavras, pois os títulos mais longos são menos

perceptíveis, principalmente em lista de marcadores. Muitos sites utilizam o nome de

domínio como “.com” ou a palavra “homepage” no titulo, e isso são informações

desnecessárias e que o usuário possui tem conhecimento.

O endereço para acessar o site é bem direto e retrata o nome da Empresa,

“http://www.rolsulrolamentos.com.br”, facilitando o usuário a acessá-lo quando

quiser. Cada país possui um domínio adequado para ele, no Brasil é utilizado o “.br”.

Para evitar confusão para os usuários, não foram criadas páginas de abertura nem

janelas pop-up, pois muitos usuários confundem essas janelas como anúncios. O

site não exibe mensagem de boas-vindas aos usuários.

Não foram desperdiçados espaços com créditos relacionados ao mecanismo de

pesquisa, empresa de design, empresa do navegador favorito ou com a tecnologia

utilizada porque geralmente os usuários não se interessam por essas informações.

A página inicial nunca é atualizada automaticamente para acionar atualizações.

Isso é feito somente quando o usuário solicita a atualização (ou seja, quando ele

clica no F5 ou digita novamente o link do site).

Não foram disponibilizados recursos para os usuários personalizar a aparência

básica da interface. O mais interessante é focar nos recursos com uma estrutura

eficiente, legível para que os usuários tenham um retorno daquilo que procurava.

15

3.1.3 Problemas (diretrizes desconsideradas) que o site não cumpre.

Algumas diretrizes foram desconsideradas, pois não foram implementadas ou

utilizadas no site em questão. As diretrizes são:

Utilizar slogan da empresa para enfatizar o que a empresa faz de importante.

Usar “Sala de Imprensa” ou “Sala de Notícias” para obter cobertura da imprensa

para a empresa.

Ao fornecer mecanismo de resposta automática, especificar o objetivo do link e

se será lido pelo atendimento ao cliente ou webmaster. Incluir um link “Política

Privada” para detalhar informações de qualquer cliente incluso no site. Explicar

como o site gera dinheiro, se a informação não estiver bem clara.

Utilizar categorias de rótulos com idioma centrado no cliente, de acordo com a

importância dessas categorias para o cliente. Usar exemplos para informar o

conteúdo daquela informação, em vez de apenas descrevê-lo.

Fornecer uma lista das últimas atualizações e dados apresentados

recentemente no site. Incluir links coloridos para indicar os estados de links visitados

e não-visitados. Foi indicado corretamente o que e para qual página o link irá, pode

ser feito isso utilizando ícones. Não incluir um link ativo que volte para home na

homepage.

Disponibilizar para os usuários uma caixa de entrada na homepage para fazer

consultas e pesquisas, ao invés de oferecer apenas um link para essa página. Essas

caixas devem ser grandes o suficiente para que os usuários consigam digitar aquilo

que deseja. Não dar nome a área de pesquisa com um título, mas sim usar um

botão “Pesquisa ou Busca” à direita da caixa. Se existir pesquisa avançada no site

mostrar a caixa apenas quando os resultados da pesquisa forem apresentados. A

16

pesquisa deve ser feita no site inteiro, e não fornecer um link “Pesquisar na Web”,

pois essa opção torna a pesquisa bem mais complexa com possíveis erros.

Possibilitar aos usuários acesso direto às tarefas de alta prioridade na

homepage. Geralmente esse tipo de recurso só é possível nos sites que conhecem

o usuário.

Utilizar gráficos para apresentar conteúdos existentes e reais e não somente

decorativos. Nomear fotos ou gráficos se os significados não estiverem claros.

Permitir que os usuários decidam se desejam ver uma introdução animada antes da

página inicial. Os títulos devem ser relacionados aos textos referentes a ele e não à

história completa.

Utilizar layout que ajuste o tamanho da homepage a várias resoluções de tela.

Incluir descrição resumida do site no título da janela. Para facilitar a procura pelo site

na internet, é necessário registrar os nomes de domínio com grafias alternativas,

abreviações ou erros comuns de digitação do nome do site. E se houver essas

grafias selecionar uma delas como a autorizada e direcionar os usuários para essa

versão a partir de todas as demais.

Se ocorrer algum problema no site, informar claramente na home, e dar uma

estimativa de tempo necessário para corrigir esse problema. Preparar um design

alternativo caso ocorra alguma situação de emergência.

Não solicitar aos usuários seus endereços de e-mail para que recebam um

boletim não-especificado ou outro item de conteúdo ou freqüência desconhecida.

Listar tópicos de discussão se existir suporte para comunidades de usuários com

bate-papo.

17

Não fornecer livro de visitantes, pois faz com que o site pareça um amador e não

dão qualquer benefício aos usuários.

Exibir datas e horários somente para informações relacionadas ao tempo. E

mostrar aos usuários a data da última atualização gerada pelo conteúdo, e não a

hora atual do computador. Utilizar abreviações como p.m ou P.M. Exibir o nome do

mês inteiro ou abreviações, mas não número.

18

3.2 Empório Pancy

3.2.1 Objetivo

Objetivo do site Empório Pancy é aumentar a interação com seus clientes

através de um site dinâmico. Além de informações institucionais, apresenta todos os

produtos e foto da padaria. Os seus clientes podem se informar sobre o seu negócio,

funcionamento, produtos ou serviços fora do horário de expediente ou durante o fim

de semana. É necessário que a empresa transmita as informações de maneira clara

e direta.

3.2.2 Princípios (diretrizes) que o site cumpre.

A logomarca da empresa é exibida no topo da página dando destaque e com um

tamanho razoável.

As tarefas principais e de alta prioridade estão em um local de destaque, ou

seja, na parte do conteúdo.

Não foi utilizada a palavra “website” para referenciar outras partes do site, pois

isso indica um “outro site” ao invés de alguma pagina dentro dele.

As informações sobre a empresa estão agrupadas todas no link “Padaria”, onde

é possível encontrar um descritivo, endereço, e-mail e foto da padaria.

É apresentada uma interface unificada para o cliente. Os itens são claros e

obvio. Se ele quer ver os produtos que a padaria oferece, basta ir no link “Produtos”.

Assim também funciona com os demais itens do site.

19

Para obter todas as informações de contato da empresa existe o link “Fale

Conosco”. É informado o e-mail, telefone, endereço e também é possível enviar uma

mensagem para a padaria através do formulário (essa mensagem pode ser uma

sugestão, crítica, elogio, informação, etc).

Não foi fornecida nenhuma informação interna da empresa. Foi evitado conteúdo

redundante no site para não congestionar as páginas, as informações e os links

estão bem claros, por isso, na parte de produtos foram criadas categorias para

diferenciá-los, e todas elas possuem suas categorias (doces, salgados, pães e

bolos). Não foram usados termos difíceis, nem dialeto de marketing, pois dão

trabalho para o usuário descobrir o significado.

Foram empregados letras maiúsculas/minúsculas e outros estilos com

consistência. Foram evitados espaços e pontuação para da ênfase a uma palavra ou

frase. A pontuação incomum reduz a legibilidade.

Não são utilizados títulos que desperdiçam um espaço sem sentido no site, mas

sim são destacadas de forma que o usuário compreenda que aquela informação

está destacada (geralmente com tamanho de fontes maiores e melhores disposição

na página). Os links estão destacados com outro estilo de fonte e um tamanho

razoável para ser identificado facilmente, eles indicam exatamente o que acontecerá

caso o usuário clique nele.

Não foram utilizados links com o nome de “Clique Aqui”, “Links” e “Mais..” no

final de uma lista para indicar um link. Foram utilizados os significativos nos nomes

para informar aos usuários o que obterão quando clicarem.

A área de navegação principal está em um local bastante destacado e os itens

são agrupados entre si dentro dessa área, facilitando assim sua visualização. Não

20

foram disponibilizadas várias áreas de navegação para o mesmo tipo de link. Não

existe um link ativo para voltar para a “home” (página principal) na homepage.

Não foram inventados termos diferentes de navegação para as categorias. Elas

são diferenciáveis entre si.

Não foram incluídas tarefas que não estejam relacionadas com a padaria ou

tarefas que os usuários costumam fazer no site. Nem ferramentas que produzem

funções do navegador, como definir uma página como Página Inicial.

As fotos disponíveis no site foram todas editadas conforme seu tamanho e

disponibilidade na página. Não foram utilizados imagens de plano de fundo com o

texto sobreposto.

Não foram utilizadas animações para chamar a atenção para um único item, pois

distrai a atenção de outros elementos importantes no site. E nem animação em

logotipo, slogan ou títulos principais.

Foi utilizado um padrão de estilo de fontes, formatação de texto (tamanho, cores,

etc) em todas as páginas para padronizar e não deixar o texto com design pesado.

Os elementos mais críticos da página estão acima (visivelmente na primeira tela

de conteúdo, sem precisar rolar).

Os menus suspensos dificultam a navegação eficiente dos usuários, por isso

não foi utilizada no site. Os menus estão todos no topo e localizado um ao lado do

outro, facilitam sua visualização.

O título de janela foi especificado como “Padaria em Curitiba -Empório Pancy”,

para facilitar o desempenho na marcação e localização de sites em mecanismo de

pesquisa. Os títulos devem ser limitados a não mais que sete ou palavras. Não foi

21

incluída a palavra “homepage” e o nome de domínio no título, pois não faz parte do

nome da empresa.

Cada país tem seu domínio específico, e como a Padaria só tem clientes e

usuários no Brasil, foi registrado apenas um domínio “.com.br”.

Os usuários são conduzidos diretamente a página inicial (homepage) quando

digitam o endereço “http://www.emporiopancy.com.br”, sem tela de abertura e sem

mensagem de boas-vindas. Não existem opções para os usuários escolherem as

respectivas localizações geográficas, pois a versão do site existe somente em

Português.

O site é bem específico e voltado para os clientes e usuários interessados em

produtos e informações sobre a padaria. Não foram desperdiçados espaço com

créditos relacionados à outros assuntos.

Não é feito nenhum tipo de recarregamento e atualização da página

automaticamente, pois isso aborrece muitos usuários e acaba atrapalhando outros

que utilizam conexões lentas.

Não existe recurso para que o usuário modifique ou personalize a aparência da

interface.

Não existe um “Livro de Visitantes”, pois esse termo faz com que o site pareça

amador. O que o site disponibiliza é um formulário de cadastro, especificando que o

usuário pode se cadastrar para receber informativos de novidades e promoções.

22

3.2.3 Princípios (diretrizes desconsideradas) que o site não cumpre.

Algumas diretrizes foram desconsideradas, pois não foram implementadas ou

utilizadas no site em questão. As diretrizes são:

Utilizar slogan da empresa para enfatizar o que a empresa faz de importante e

designar uma página do site como a homepage oficial e estruturá-la de modo

diferente de todas as outras páginas.

Disponibilizar um link “Sala de Imprensa” ou “Sala de Notícias” para obter

cobertura da imprensa para a empresa, e “Política Privada” para detalhar

informações de qualquer cliente incluso no site. Fornecer mecanismo resposta

automática, e especificar o objetivo do link e se será lido pelo atendimento ao cliente

ou webmaster.

Em uma frase não separar palavras que precisam ficar juntas para serem

entendidas. Existem vários fatores que pode prejudicar a lógica desse conteúdo e

até o sentido da frase, como: versão do navegador, tamanho do monitor, resolução

da tela e outros itens. Deve-se evitar os pontos de exclamação, pois não pertence à

grafia profissional.

Revelar o conteúdo do site através de exemplos na homepage, como uma

listagem de notícias ou produtos que são vendidos na padaria. Disponibilizar para

cada item um link que vai para a página de detalhes desse produto e outro link que

vai para a listagem de todos os produtos (especificar claramente para onde cada um

vai).

Disponibilizar acesso ao conteúdo anterior e os atualizados recentemente no

site. Indicar links com sublinhado e cor azul, e permitir os links visitados e não-

23

visitados com cores diferentes para não confundir os usuários, a cor dos links já

visitados deve ser uma versão mais clara da cor das ligações ainda não visitadas.

Disponibilizar para os usuários uma caixa na homepage para fazer a busca de

um produto específico. Não se deve rotular a área de pesquisa com um título, e sim

usar um botão "Busca" ou "Pesquisa". Não oferecer recurso para pesquisar na web,

pois não é na web que a busca será feita e sim e somente no seu site. A caixa de

texto deve ter tamanho suficiente para o usuário conseguir digitar 30 caracteres. A

pesquisa deve ser feita no site inteiro.

Usar os textos com muito contraste e cor de plano de fundo, para que as fontes

fiquem mais legíveis. Evitar a rolagem horizontal na resolução 800x600, pois o

conteúdo se perde e rola para fora da tela dificultando a visualização e desempenho

dentro das páginas. Utilizar layout fluido para permite o ajuste do site para várias

resoluções. Destina-se a páginas que devem ser vistas por inteiro, ocupando toda a

área útil da janela do navegador, sem reduções de escala.

Registrar vários domínios com grafias diferentes (abreviações ou erros comuns

do nome do site), e direcionar todas sempre para o domínio correto.

Evitar janelas pop-up, pois muitos usuários ignoram achando que são anúncios

e propagandas.

Se houver algum problema técnico é necessário informar aos usuários quanto

tempo levará para o site voltar ao ar. O certo é criar uma página alternativa caso

ocorra alguma emergência.

Não colocar links para se cadastrarem no site sem explicar as vantagens e

benefícios para o cliente.

24

4. AMBIENTES PROPOSTOS

Feita a revisão nos sites e levando em conta somente as diretrizes que tiveram

seu número maior desconsideradas, foram propostos novos ambientes (telas) para

melhoria e melhor entendimento dos usuários.

25

4.1 Rol Sul Rolamentos

4.1.1 Pesquisa

Inclusão do campo de pesquisa, que é um elemento muito importante no site,

pois facilita a busca pelos produtos.

(figura 01) Campo Pesquisa para facilitar a busca de produtos

26

4.1.2 Notícias

As notícias e atualizações nos sites fazem com que os usuários entrem em

busca de novos conhecimentos e informações.

(figura 02) Inclusão de Notícias para os usuários se manterem informados

27

4.1.3 Comunicando problemas técnicos

Foi necessário criar uma página em caso de emergência ou algum problema

enfrentado pelo site. É importante manter os usuários com informações relevantes e

necessárias.

(figura 03) Informando Problemas Técnicos

28

Datas

As datas são importantes somente para informações relacionadas ao tempo,

como as noticias.

(figura 04) Foi adicionado Datas para referenciar cada notícia

29

4.2 Empório Pancy

4.2.1 Slogan

Incluir um slogan que cause impacto sobre as pessoas, resumindo o que a

empresa ou o site faz.

(figura 05) Inclusão de Slogan da Empresa

30

4.2.2 Revelando o conteúdo através de exemplos

Foi proposta uma tela destacando e disponibilizando alguns produtos em

destaque. Ao passar o mouse em cima da foto e do nome do produto é possível

visualizar que existe um link, levando para a página de detalhes do produto

escolhido.

(figura 06) Apresentação de Produtos em destaque na home

31

4.2.3 Pesquisa

É importante disponibilizar aos usuários a opção de pesquisar o produto que ele

deseja no site. Facilitando na busca e navegação.

(figura 07) Campo Pesquisa para facilitar a busca de produtos

32

4.2.4 Comunicando Problemas Técnicos e Emergências

Às vezes a empresa ou o site enfrenta problemas técnicos e é importante

informar aos usuários o motivo do site não estar funcionando corretamente.

(figura 08) Comunicando Problemas Técnicos

33

5. CONCLUSÕES E TRABALHOS FUTUROS

Após a realização da pesquisa bibliográfica, seguindo as referências de Nielsen

(2002), conclui-se que dois sites apresentaram poucos problemas de usabilidade,

embora os sites Empório Pancy e Rol Sul Rolamentos podem ser considerados

como sites adequados, e cumpriram seu objetivo, pois esclareceu o que é

usabilidade, qual é a sua importância e como pode ser aplicada à web. Os

resultados das análises realizadas possibilitaram identificar problemas e sugerir

novas medidas de melhoria nos sites no que diz respeito à usabilidade e seu uso na

visão de clientes.

O site de uma empresa é sua representação na web, que atinge cada vez mais

pessoas com cobertura mundial. Pequenos problemas que prejudiquem a

experiência do usuário podem se transformar em um grande problema para a

empresa, influenciando suas vendas e sua imagem. As empresas têm pouco tempo

para prender a atenção de seus usuários e mostrar que vale a pena navegar em seu

site. Se ele se sentir satisfeito, sua visita pode valer vendas, credibilidade e

fidelidade de seus clientes ou resultar em descontentamento, insatisfação e irritação

de um usuário que poderia ter se tornado um cliente lucrativo.

Pode-se dizer que a aplicação das diretrizes de usabilidade proporciona a

interação humano-computador e facilita a utilização do site e do seu funcionamento.

Como trabalho futuro será implementada todas as regras de usabilidade logo no

início do desenvolvimento.

34

REFERÊNCIAS

NIELSEN, Jakob; TAHIR, Marie. Homepage: USABILIDADE - 50 Websites

Desconstruídos. Campus, 2002. 315p.

NIELSEN, J.; LORANGER, H. Usabilidade na Web - Projetando Websites com

Qualidade. Campus, 2007. 432p.

FERREIRA, Simone Bacellar Leal; NUNES, Ricardo Rodrigues. e-Usabilidade. Rio de

Janeiro: LTC. 192p.

LYNCH, Patrick; HORTON, Sarah. Web style Guide: Basic Design Principles for

Creating Web Sites. 1999. 164p. (on-line), http://www.webstyleguide.com/index.html/

KRUG, Steve. Não me faça pensar. São Paulo. Market Books, 2001.

RADFAHRE, L. Design web design. São Paulo: Market Press, 1998.

GOOGLE. http://www.google.com.br/ Acesso: Dezembro/2008

USABILIDOIDO. http://usabilidoido.com.br/ Acesso: Março/2009

CRIAR WEB. http://www.criarweb.com/usabilidade/ Acesso: Fevereiro/2009

USABILIDADE BR. http://www.usabilidadebr.com.br/home.asp/ Acesso: Fevereiro/2009

SOBRE SITES. http://www.sobresites.com/usabilidade/ Acesso: Janeiro/2009