O documento discute a importância de rótulos claros e descritivos para guiar os usuários em sites. Em três pontos essenciais: 1) Rótulos devem usar a linguagem do usuário em vez de jargões. 2) Rótulos devem ser mutuamente exclusivos e focados no tópico. 3) Consistência na sintaxe, apresentação e uso de rótulos cria uma experiência de navegação mais fluida.

1. Rotulando
AI – aula 06 (KALBACH, 2009, cap. 5)
a Navegação
1

2. Rótulos são:
• Conteúdo;
• Funcionalidade;
• Estrutura;
• As palavras que contam a história do site;
• Palavras-gatilho: estimulam o usuário a clicar nos links… Ou não.
2

3. O problema
do vocabulário
• As chances de duas pessoas
nomearem a mesma coisa
da mesma forma são baixas:
os termos para o mesmo ponto
de acesso “casam”, para
diferentes usuários, no máximo
entre 10% e 20% das vezes
(FURNAS, 1987);
• ABORDAGEM: iniciar com
os termos familiares AOS
USUÁRIOS (design centrado
no usuário);
• MÉTODOS: ordenação de
cartões, listagem livre.
3

4. Pistas p/interpretar
os rótulos
• O contexto dos outros rótulos
e textos na página;
• A experiência prévia
do visitante na navegação
de sites semelhantes.
4

5. O que os usuários precisam compreender?
• A linguagem do link;
• O tratamento visual dos links;
• O posicionamento dos links na página;
• Os usuários criam uma imagem mental sobre o conteúdo
e sobre como ele é apresentado.
5

6. “Bons” rótulos
• Falar a língua do usuário;
• Rótulos descritivos;
• Rótulos mutuamente
exclusivos;
• Rótulos focados;
• Rótulos consistentes;
• Tamanho dos rótulos.
6

7. Falar a língua do usuário
• Rótulos ambíguos = usuário tenta “adivinhar” a intenção do AI.
Nomenclatura sem clareza = caminho errado (se perdem ou desistem).
Bons rótulos inspiram CONFIANÇA na navegação e evitam frustrações;
• EVITAR JARGÕES DA COMPANHIA: o usuário não entende expressões
particulares de grupos muito específicos. Exceção: intranets, B2B;
• EVITAR RÓTULOS “COOL”: sem gírias de nicho nem “legalzices”;
• EVITAR ABREVIAÇÕES. Lembre-se: o usuário precisa de explicações.
A sua experiência deve ser conduzida e não posta em dúvida;
• USAR O TOM DE VOZ APROPRIADO: formal onde precisa ser formal,
coloquial onde precisa ser coloquial;
7

8. Tipos de rótulos
• RÓTULOS DESCRITIVOS. Evitar o uso de expressões genéricas,
tais como “informação”, “detalhes”, “miscelânea” ou “outros”:
a categorização e a rotulação andam juntas: um grupo pode afetar
o significado de uma categoria e vice-versa;
• RÓTULOS MUTUAMENTE EXCLUSIVOS: quanto mais clara a distinção
entre categorias, melhor. As opções do menu não podem se sobrepor –
precisam ser bem diferentes umas das outras;
• RÓTULOS FOCADOS: atribuir somente o tópico mais específico abaixo
da categoria mais adequada, sem repeti-lo em uma categoria parecida;
8

9. Rótulos consistentes
• GRANULARIDADE = detalhe ou amplitude relativa de um determinado tópico.
As opções de navegação em um mesmo nível de estrutura do site devem refletir
aproximadamente a mesma amplitude de conteúdo;
• SINTAXE = utilizar uma forma gramatical similar para a mesma estrutura
de títulos em uma seção ou de links em um menu específico. P. ex.: todos
são verbos, todos são substantivos, todos no gerúndio, todos no imperativo;
• APRESENTAÇÃO = consistência na fonte, no tamanho, no estilo e na cor
proporcionam um senso de UNIDADE ao CONJUNTO SEMELHANTE.
EVENTUAIS quebras na consistência podem adicionar um contraste necessário;
• USO: usar os mesmos rótulos em lugares e posições ≠s pra dizer a mesma
coisa.
9

10. Tamanho dos rótulos
• BRITTAN, PERFETTI e SPOOL (2004): os links que proporcionaram
aos pesquisados a melhor experiência de navegação (menos erros,
mais tempo dentro do site, maior interesse em desbravar
conteúdo diferenciado) continham de 7 a 12 palavras!
• Opção descritiva que elimina ambiguidades
e ajuda a prever o que virá pela frente;
• Como equacionar em um pequeno espaço horizontal?
Será que um link com uma ou duas palavras não é eficiente?
DE-PEN-DE: o que importa é ser CLARO e ESPECÍFICO.
10

11. Sistemas
de Rotulagem
• Títulos do navegador;
• URLs;
• Títulos de página;
• Esquema flexível;
• Esquemas redundantes;
• Tratando a redundância.
11

12. Títulos do navegador
• FAVORITOS: título é o rótulo
padrão (poucos usuários
editam o nome dos favoritos);
• NAVEGAÇÃO EM ABAS: ≠s
palavras diferenciam as abas;
• IMPRESSÃO: organizam as
páginas impressas por título;
• LINKS P/RESULTADOS
DE BUSCAS: o título orienta
o interesse do usuário
nos resultados das buscas.
12

13. URLs
• INICIAÇÃO: digitam, decoram
ou adivinham. Nome óbvio,
suas variações e marketing;
• ORIENTAÇÃO: localização
(nome do dono ou da
empresa), posição hierárquica
no site, categoria;
• DESTINO: mouse sobre o link
mostra a URL de destino
(pistas sobre o conteúdo);
• MANIPULAÇÃO DE URLs.
13

14. URLs
• INICIAÇÃO: digitam, decoram
ou adivinham. Nome óbvio,
suas variações e marketing;
• ORIENTAÇÃO: localização
(nome do dono ou da
empresa), posição hierárquica
no site, categoria;
• DESTINO: mouse sobre o link
mostra a URL de destino
(pistas sobre o conteúdo);
• MANIPULAÇÃO DE URLs.
14

15. Esquemas
redundantes
• URL + seção + subseção
+ migalhas de pão + título;
• Peso, posição, fonte,
corpo, cor, contraste, fundo:
como trabalhar essas
diferenciações para tornar
o site explicativo e fácil
de navegar, evitando
que as redundâncias
sejam desnecessárias
ou mal posicionadas.
15

16. Rótulos persuasivos
• EISENBERG, Bryan e Jeff, 2006
• Dois níveis de persuasão
(macro e micro):
• MACRO: tentar fazer com que
as pessoas realizem uma ação;
• MICRO: ao nível dos links;
• Sentença persuasiva
que oferece benefícios
aos visitantes.
16

17. Internacionalização
dos rótulos
• ESPAÇO: rótulos em ≠s
idiomas podem ocupar
tamanhos maiores e ter mais
palavras sob o mesmo design.
PREVER ESPAÇO EXTRA;
• TRADUÇÃO: traduções literais
às vezes não encontram uma
palavra correspondente.
CONTEXTO, CULTURA,
MANTER O SENTIDO
ORIGINAL.
17

18. EXERCÍCIO DE ROTULAGEM
• EM AULA (hoje);
• Grupos de 2 ou 3 alunos (nem mais, nem menos);
• 1) Cada grupo escolhe um tema para o seu site. Ex.: ESPORTE;
• 2) A turma inteira cita termos p/rotular as seções do site;
• 3) O grupo anota no quadro, escolhe os 10 menos ambíguos e mais
diretamente relacionados ao seu tema e esboça uma árvore de navegação;
• 4) Assim sucessivamente, para cada tema de cada um dos grupos.
18