Fundamentos de webdesign,

tecnologia e ubiquidade

15 de abril de 2015

Não exagere nas opções

Renato Cruz – Senac2

Fonte: KRUG, Steve. Don't Make Me Think, Revisited: A Common Sense Approach to Web Usability. San Francisco: New

Riders, 2013.

Opções mais simples

Renato Cruz – Senac3

Fonte: KRUG, Steve. Don't Make Me Think, Revisited: A Common Sense Approach to Web Usability. San Francisco: New

Riders, 2013.

Tipos de usuários

Renato Cruz – Senac4

Algumas pessoas (usuários “dominados pelas

pesquisas”) quase sempre procuram as caixas

de busca assim que entram em um site.

Outras pessoas (usuários “dominados por

links”) quase sempre navegarão primeiro,

pesquisando apenas quando não tiverem mais

prováveis links para clicar ou quando já

estiverem suficientemente frustradas com o

site.

Fonte: KRUG, Steve. Não me faça pensar: uma abordagem de bom senso da usabilidade na web. Rio de Janeiro: Alta

Books, 2008.

Como funciona a navegação

Renato Cruz – Senac5

Fonte: KRUG, Steve. Don't Make Me Think, Revisited: A Common Sense Approach to Web Usability. San Francisco: New

Riders, 2013.

Convenções

Renato Cruz – Senac6

Fonte: KRUG, Steve. Don't Make Me Think, Revisited: A Common Sense Approach to Web Usability. San Francisco: New

Riders, 2013.

Nomes de páginas

Renato Cruz – Senac7

Todas as páginas precisam de um nome. Da mesma forma que

cada esquina deve ter uma placa, cada página deve ter um nome.

O nome precisa estar no lugar certo. Na hierarquia visual da

página, o nome deve englobar todo o conteúdo único desta página.

O nome precisa ter destaque. A combinação de posição, tamanho,

cor e tipo de letra deve dizer “Este é o cabeçalho da página inteira”.

O nome precisa ser equivalente ao clicado. Se eu clicar num link

ou botão que diga “Purê de batatas”, o site me levará a uma página

chamada “Purê de batatas”.

Fonte: KRUG, Steve. Não me faça pensar: uma abordagem de bom senso da usabilidade na web. Rio de Janeiro: Alta Books, 2008.

Você está aqui

Renato Cruz – Senac8

Fonte: KRUG, Steve. Don't Make Me Think, Revisited: A Common Sense Approach to Web Usability. San Francisco: New

Riders, 2013.

Migalhas de pão

Renato Cruz – Senac9

Abas

Renato Cruz – Senac10

São autoevidentes. Ninguém olha para elas e diz: “O que será que

elas fazem?”

São difíceis de não serem vistas. Não é tão incomum o usuário

deixar de perceber uma barra de botões no topo da página. As barras

dificilmente são confundidas com outra coisa que não seja

navegação.

São agradáveis. Se feitas de forma correta, podem adicionar um

acabamento e servir a um propósito útil.

Sugerem um espaço físico. Criam a ilusão de que a aba ativa se

move fisicamente para a frente.

Fonte: KRUG, Steve. Não me faça pensar: uma abordagem de bom senso da usabilidade na web. Rio de Janeiro: Alta Books, 2008.

Teste do porta-malas

Renato Cruz – Senac11

Que site é este? (Identificação do site)

Em qual página estou? (Nome da página)

Quais são as principais seções desta página? (Seções)

Quais são as minhas opções neste nível? (Navegação

local)

Onde eu estou no esquema das coisas? (Indicadores

“Você está aqui”)

Como eu posso fazer uma pesquisa?

Fonte: KRUG, Steve. Não me faça pensar: uma abordagem de bom senso da usabilidade na web. Rio de Janeiro:

Alta Books, 2008.

Homepage (I)

Renato Cruz – Senac12

Identificação e missão do site. De cara, a página

inicial tem de dizer o que é o site e para que ele

serve.

Hierarquia do site. Tem de dar uma indicação

visual do que o site tem para oferecer e como está

organizado.

Pesquisa. A maioria dos sites precisa ter uma

caixa de busca em destaque na página inicial.

Atrações. Como a capa de uma revista, precisar

oferecer dicas do “bom conteúdo” dentro dele.

Fonte: KRUG, Steve. Não me faça pensar: uma abordagem de bom senso da usabilidade na web. Rio

de Janeiro: Alta Books, 2008.

Homepage (II)

Renato Cruz – Senac13

Conteúdo oportuno. A página inicial precisa de algum

conteúdo que seja atualizado frequentemente.

Negócios. Precisa dar espaço para qualquer propaganda,

promoção cruzada ou negócios entre marcas.

Atalhos. As páginas mais procuradas podem merecer

links próprios na primeira página.

Registro. Se o site usar registro, precisa de links para

novos usuários se registrarem e para os antigos

assinarem.

Fonte: KRUG, Steve. Não me faça pensar: uma abordagem de bom senso da usabilidade na web. Rio de Janeiro:

Alta Books, 2008.

Respostas mais importantes

Renato Cruz – Senac14

O que é isto?

O que eu posso fazer aqui?

O que eles têm aqui?

Por que eu deveria estar aqui – e não em outro

lugar?

Fonte: KRUG, Steve. Não me faça pensar: uma abordagem de bom senso da usabilidade na web. Rio de Janeiro:

Alta Books, 2008.

O site da universidade

Renato Cruz – Senac15

Fonte: https://xkcd.com/773/