2. 113 diretrizes de usabilidade Homepage Usabilidade 50 websites desconstruídos Jakob Nielsen e MarieTahir
3. 113 diretrizes de usabilidade Nos primeiros anos de projetos comerciais da Web travou-se uma luta contra o excesso de design. Especialistas como Nielsen são contra modismos (design hostis) dificultam a experiência do usuário. Ainda existe um esforço por tornar a Web um ambiente útil: - Atenda aos objetivos dos usuários - Máxime o retorno sobre os investimentos das empresas
4. 113 diretrizes de usabilidade A homepage é a página mais importante em qualquer website
5. 113 diretrizes de usabilidade A homepage é a página mais importante em qualquer website Porque representa a empresa para o mundo Porque é a porta de entrada para o site Porque existe um alto investimento nesta pequena tela
6. 113 diretrizes de usabilidade É a página mais visualizada do que qualquer outra página do site. É a primeira e talvez última oportunidade de atrair o cliente. Nem sempre os usuários entram num site pela homepage. Pode-se entrar por um link direto para uma página do site mas este tipo de acesso não oferece ao usuário uma visão geral. A homepage contextualiza o universo do site e oferece a estrutura (visão geral).
7. 113 diretrizes de usabilidade Função da Homepage • Transmitir o que a empresa significa, a importância do site em relação à concorrência e ao mundo físico, e os produtos ou serviços oferecidos. Apesar de aparentemente simples, várias equipes de design se esforçam e falham na criação de um design de uma homepage. Quem projeta precisa ter clareza do objetivo da homepage. Existem muitas analogias no mundo concreto para o papel das homepages na experiência dos usuários.
8. 113 diretrizes de usabilidade Capa de revista 1º objetivo é ser escolhida entre outras revistas. Com um website é diferente porque o usuário já está olhando para a homepage (não precisa se distinguir entre outros). 2º Definir conteúdo, estilo e outros itens contidos na revista. Área de aprendizado para o web design.
9. 113 diretrizes de usabilidade Sua face para o mundo A primeira impressão é a que fica e na Web só se tem uma oportunidade de dar uma primeira impressão. O webdesign é também funcional (design de interação). A primeira experiência do usuário ao entrar no site é fundamental. O site deve cumprir suas promessas.
10. 113 diretrizes de usabilidade Trabalho de arte O exame de uma obra de arte incorpora em 2 etapas: superficial e aprofundada. Erro das equipes de design: pensar apenas no nível superficial. O designer deve se dedicar ao design de interação.
11. 113 diretrizes de usabilidade Saguão de um prédio Não é um destino em si mesmo. Passagem. Um website é similar no sentido que é um porta de entrada que canaliza o tráfego para direções distintas. Toda homepage precisa de sinalização eficiente. Dar prioridade aos destinos dos usuários.
12. 113 diretrizes de usabilidade Recepcionistas da empresa Similar à idéia do saguão no sentido de uma pessoa que redireciona os visitantes para seus destinos.
13. 113 diretrizes de usabilidade Sumário de livro Uma hierarquia que, através da convenção da numeração de paginação, leva o leitor diretamente à sua opção. O sumário dá a noção da estrutura geral. Analogia do link de hipertexto.
14. 113 diretrizes de usabilidade Primeira página de um jornal Apresenta uma visão geral resumida e priorizada das notícias mais importantes. Diferentemente de um website o formato do jornal é consagrado e a navegação é simples. Os websites precisam representar muito mais serviços na homepage porque o estilo é menos fixado do que um jornal, ou seja, não sabemos o que esperar de um website.
15. 113 diretrizes de usabilidade A homepage tem diversos objetivos e os usuários também. Os usuários acessam um site com objetivos diferentes. O site deve ser projetado para usuários inexperientes e experientes. Ambos ficaram desapontados se não conseguirem achar o que buscam e muito provavelmente abandonarão definitivamente o site.
16. 113 diretrizes de usabilidade O desafio está em estruturar uma homepage que permita acesso a todos os recursos importantes, sem abarrotar a página com todos eles. Acomodação e clareza são fundamentais. As 113 diretrizes são uma espécie de checklist (lista de verificação). As diretrizes não são suficientes e é necessário conhecer seu usuário (levantamento de campo e testes de usabilidade). www.useit.com www.nngroup.com
17. 113 diretrizes de usabilidade Informando o objetivo do site • Onde o usuário se encontra • O que a empresa faz • O que os usuário podem fazer em seu site
18. 113 diretrizes de usabilidade Informando o objetivo do site 1 – Exibir o nome da empresa e/ou logotipo, em um tamanho razoável e em um local de destaque. 2 – Incluir um slogan resumindo explicitamente o que o site ou a empresa faz. 3 – Enfatizar o que o site faz de importante sob a perspectiva dos usuários, assim como a diferença entre seu site e os dos principais concorrentes. 4 – Enfatizar as tarefas de mais alta prioridade, para que os usuários tenham um ponto de partida definindo na homepage.
19. 113 diretrizes de usabilidade Informando o objetivo do site 5 – Designar explicitamente uma página do site como a homepage oficial. 6 – No website da empresa principal não usar a palavra “website” para se referir a qualquer outro aspecto, exceto à totalidade da presença da empresa na web. 7 – Estruturar a homepage de modo diferente de todas as outras páginas existentes do site.
20. 113 diretrizes de usabilidade Grupo1 http://www. dobrasdaleitura . com/index . html Grupo2 http://www. itaucultural .org. br / Grupo3 http://olhares.aeiou.pt/ Grupo 4 http://www.file.org.br/
21. 113 diretrizes de usabilidade Transmitindo informações sobre sua empresa Os websites devem fornecer um método objetivo para procurar informações sobre a empresa. Os detalhes sobre a empresa dão credibilidade ao site. O usuário gosta de saber com quem está negociando. As pessoas (usuários) precisam saber como a empresa está estruturada e quem a administra.
22. 113 diretrizes de usabilidade Transmitindo informações sobre sua empresa 8 – Agrupar informações da empresa , como Sobre Nós, Relações com Investidores, Sala de Imprensa, Empregos e outras informações sobre a empresa, em uma única área reservada. 9 – Incluir um link da homepage para uma seção “Sobre Nós ”, que oferece aos usuários uma visão geral sobre a empresa e links para todos os detalhes relevantes sobre seus produtos, serviços, valores da empresa, proposta de negócios, equipe de gerenciamento e outros pormenores.
26. 113 diretrizes de usabilidade Transmitindo informações sobre sua empresa 10 – Para obter cobertura da imprensa para sua empresa, incluir um link “Sala de Imprensa” em sua homepage. A assessoria de imprensa é responsável pela comunicação corporativa. • Informação para jornalistas. • Relação de notícias sobre a empresa (positivas)
27. 113 diretrizes de usabilidade www.vivario.org.br www.oi.com.br www.adobe.com.br
28. 113 diretrizes de usabilidade Transmitindo informações sobre sua empresa 11- Apresentar uma face unificada ao cliente , em que o website seja um dos pontos de toque em vez de uma entidade em si. Mostrar que apesar das distinções internas a empresa é consistente e indivisível. Pode mostrar certa distinção entre as empresas internas, mas deve manter a identidade. - Corporações como aglomerados de empresas. Ex: Ed. Record - Empresas com atividades diferentes. Ex: Organizações Globo - Ações sociais ou culturais das empresas. Ex. CCBB, Itaú Cultural, Fundação Bradesco - Multinacionais
33. 113 diretrizes de usabilidade Transmitindo informações sobre sua empresa 12- Incluir um link “Fale Conosco” na homepage, que acessa uma página com todas as informações de contato da empresa. 13 – Ao fornecer um mecanismo de “feedback” (resposta), especificar o objetivo do link e será lido pelo atendimento ao cliente ou pelo Webmaster, e outras informações pertinentes.
35. 113 diretrizes de usabilidade Transmitindo informações sobre sua empresa 14 – Não incluir informações internas da empresa (destinada aos funcionários e que devem permanecer na intranet) no Website público. 15 – Se o site reunir informações sobre qualquer cliente, é recomendável incluir um link “Política Privada” na homepage. 16 – Explicar como o Website gera dinheiro se essa informação não estiver muito clara.
36. 113 diretrizes de usabilidade Modelo de negócio. Venda, publicidade, assinatura.
37. 113 diretrizes de usabilidade Criação de conteúdo A varredura do usuário online é muito rápida. Em função disto, o conteúdo deve ser projetado de modo a transmitir o máximo de informação com o mínimo de texto. Esta é um diretriz geral para web e mais importante ainda para a homepage a qual deve manter o interesse do usuário. Homepage: Relação espaço x quant. de informação
38. 113 diretrizes de usabilidade Criação de conteúdo Papel de editor (selecionar e revisar o conteúdo). Conteúdo específico para uso na Web (não usar o mesmo material de outras publicações). Manter a consistência de todo o site. Equipe de design deve utilizar usuários reais neste processo tanto ao reunir as exigências iniciais, quanto ao revisar o design à medida que o site evolui.
39. 113 diretrizes de usabilidade 2000 2007 Reprodução Reprodução Maio de 2004 Janeiro de 2003
40. 113 diretrizes de usabilidade Criação de conteúdo 17 – Usar seções e categorias de rótulo, com idioma centrado no cliente, de acordo com a importância dessas seções e categorias para o cliente e não para a empresa. 18 – Evitar conteúdo redundante. 19 – Não utilizar frases eruditas nem dialeto de marketing que fazem com que as pessoas tenham um trabalhão para descobrir o que está sendo dito.
43. 113 diretrizes de usabilidade Criação de conteúdo 20 – Empregar letras maiúsculas e outros padrões de estilo com consistência. 21 – Não rotular uma área nitidamente definida da página se o conteúdo for suficientemente auto-explicativo. 22 – Evitar as categorias e as listas de marcadores de um único item. 23 –Utilizar espaços não-separáveis entre as palavras nas frases, que precisam permanecer juntas para serem vistas e entendidas.
44. 113 diretrizes de usabilidade Criação de conteúdo 24 – Usar somente o discurso imperativo, como em “Insira uma Cidade ou CEP” nas tarefas obrigatórias, ou qualificar a declaração adequadamente. 25 – Explicar o significado de abreviações, iniciais maiúsculas, acrônimos e segui-los imediatamente com as abreviações nas primeiras ocorrências.
47. 113 diretrizes de usabilidade Criação de conteúdo 26 – Evitar pontos de exclamação. 27 – Empregar raramente todas as letras maiúsculas e nunca como um estilo de formatação. 28 – Evitar usar inadequadamente espaços e pontuação para dar ênfase.
48. 113 diretrizes de usabilidade Revelando o conteúdo por meio de exemplos • Apresentar o conteúdo de seu site ajuda ao usuário identificar exatamente o que o site faz. • Os exemplos podem revelar a abrangência dos produtos ou do conteúdo do site. • Os detalhes são mais interessantes do que os aspectos gerais. • Os exemplos ajudam os usuários a navegar com êxito. Mostram o que existe por trás de nome se categorias abstratas.
50. 113 diretrizes de usabilidade Revelando o conteúdo por meio de exemplos 29 – Usar exemplos para revelar o conteúdo. 30 – Para cada exemplo, disponibilizar um link para acesso diretamente a página detalhada desse exemplo, em vez de saltar para uma página de categoria geral a que o item pertence.
52. 113 diretrizes de usabilidade Revelando o conteúdo por meio de exemplos 31 – Inserir um link para uma categoria mais abrangente, ao lado do exemplo específico. 32 – Indicar claramente quais links conduzem a informações de acompanhamento sobre cada exemplo e quais links direcionam para informações gerais sobre a categoria como um todo.
54. 113 diretrizes de usabilidade Arquivos e acesso ao conteúdo anterior Incluir arquivos para o conteúdo recente. Serve tanto para usuários freqüentes quanto para novos usuários. 33 – Facilitar o acesso aos itens apresentados recentemente na homepage, como nas últimas duas semanas ou no mês anterior, fornecendo uma lista das últimas apresentações e inserindo itens recentes em arquivos permanentes.