Não é nenhum segredo que, para construir um site bem-sucedido ou uma comunidade na web, você tem que projetar sua interface com os usuários em mente. Claro que você não pode esquecer dos aspectos da otimização para os sites de busca, mas vamos nos concentrar nos visitantes, uma vez que são estes que usam o seu site e interagem com ele.
Você provavelmente visita toneladas de locais diariamente, e muitos destes locais está visitando pela primeira vez. Sendo um web-designer eu acho que passo mais tempo em um novo site que os visitantes “não-webdesigners”. Pos vou levar um tempo para analisar o layout de página, o fluxo, a tipografia e muitas vezes navegar nas páginas internas / posts.
Devo dizer que, pelo menos metade dos sites que visito oferecem ao usuário uma experiência ruim. Então, vamos ver o que podemos fazer para melhorar a experiência do usuário em nossos sites. Essas dicas são muito simples, mas às vezes nos esquecemos delas.
Tenho certeza de que aconteceu com você antes.Você encontra-se em um novo site, navega um pouco e depois decidi que gostaria de voltar para a página inicial e tentar clicar no logo … não acontece nada. A partir daà o usuário tem 3 opções:
Por que não tornar mais fácil e permitir que o seu logo seja um link para a página inicial? Na maioria dos casos o usuário vai demorar cerca de 30 segundos para fazer. E todos nós, que esperamos que clicar no logo nos levará de volta à página inicial iremos desfrutar de uma experiência melhor.
Há muitas coisas a considerar ao projetar uma barra de navegação, desde a posição na página até o estilo do próprio menu. O lugar mais comum para uma barra de navegação seria provavelmente em torno do topo da página, acima do conteúdo e, logo abaixo do logotipo. Isso é muito comum e existe uma boa razão para ser assim: funciona!. Estamos acostumados com a sua colocação ali.
Claro que isso não significa que você não pode ser criativo e fazer todos os tipos de coisas loucas. O importante é que se permita ao usuário navegar.
Mas por favor não siga o caminho dos sites em Flash que tentam ser diferentes com sua navegação e acabam arruinando completamente a experiência do usuário.
Uma coisa que muitas pessoas esquecem é de destacar a página atual no menu. Se um usuário está na página “Quem Somos”, por exemplo, o link ‘Quem somos’ no menu provavelmente deve ser estilizado de forma diferente para indicar ao usuário em qual página ele está.
Espanta-me ver que muitos sites não têm uma barra de pesquisa. Acho que este é um problema drástico e que apenas proporciná-la ao usuário irá melhorar dramaticamente a experiência do usuário. Se seu site não tem uma barra de pesquisa, por favor, adicione um, os usuários agradecerão!
Há outras maneiras de tornar seu site fácil de pesquisar. Por exemplo, você pode adicionar uma lista de categorias ou até mesmo uma nuvem de tag. Se você desenvolver um blog isto será bastante fácil de fazer, pois a maioria dos softwares de blogs (WordPress, por exemplo) usa as categorias e tags para categorizar o conteúdo.
Acho que todos nós temos uma idéia de como são os links em uma página web. Eles são geralmente uma cor diferente do corpo do texto e são, por vezes, sublinhados. Estilizar links corretamente é um grande passo para a criação de uma experiência do usuário mais fluÃda.
Vamos ver como você poderia estilizar os links. Aqui está um exemplo básico que usa a propriedade border-bottom para dar ênfase ao passar o mouse e também ao estado ativo:
a { text-decoration: none; color:#FFF0F0; }
a:hover { text-decoration: none; color:#6666FF; border-bottom: 1px solid #6666FF; }
a:visited { text-decoration: none; color:#6E2C00; }
a:active { text-decoration: none; color: #3D3D98; border-bottom: 2px solid #3D3D98; }
Eu gosto quando eu visito um site e vejo uma mensagem de boas vindas personalizada com meu nome. Gosto de visitar o Submarino.com.br porque cada vez que eu visito vejo uma mensagem que diz “Olá Renan Soloaga”. Faz-me sentir bem. Claro, se o objetivo do seu site não é levar as pessoas a se registrar, uma mensagem de boas vindas é um pouco inútil, mas é um imperativo para uma loja online.
Mensagens de feedback e ajuda contextual também pode melhorar a experiência do usuário. Quantas vezes você preencheu um formulário de inscrição, clicou em enviar, e teve que aguarda a página carregar para descobrir que você não introduzir algumas informações corretamente. Tenho certeza que você também fica puto com isto.
Isto pode ser evitado pela adição de algumas caixas de aviso simples, dicas de ferramentas ou apontadores para os campos do formulário. Orientar o usuário durante todo o processo irá contribuir para uma melhor experiência. Basicamente, não esperar o usuário apertar o botão para informar, a idéia é dar um feedback imediato, mostrar preocupação.