Como a navegabilidade do seu site ajuda a experiência do usuário

Atualizado: 11 de Nov de 2019



Imagine a cena: Faz tempo que você está querendo uma nova bolsa para o seu laptop. Finalmente consegue um tempinho para sentar e pesquisar os diferentes tipos de design e escolher a bolsa que mais lhe agrada. Depois de levar muita coisa em consideração, você encontrou a bolsa perfeita e resolve comprá-la. Mas aí - o horror dos horrores! - você não consegue encontrar o botão “Comprar”, o ícone do carrinho de compras desapareceu e a política de devolução não pode ser encontrada em nenhum lugar visível. Tudo parece complicado e você acaba desistindo e escolhendo uma de outra marca.


Esse é um exemplo clássico de como a navegabilidade do site pode melhorar ou arruinar a experiência do usuário e, em última instância, afetar o tráfego e as taxas de conversão e rejeição. Uma boa navegabilidade pode ajudar os usuários a encontrar o conteúdo que estão procurando e oferece-lhes uma experiência de usabilidade positiva que vai estimulá-los a voltar mais vezes. Ao criar um site, leve em conta que há muitos aspectos que contribuem para uma boa experiência de usuário - desde o apelo visual do seu site até o layout, a forma como você usa o texto e mais, mas a facilidade de navegação é um fator chave.


Veja a seguir 11 dicas para melhorar a navegabilidade do seu site, e transformar visitantes casuais em clientes satisfeitos que retornam:


  1. Planeje a navegação

  2. Priorize suas páginas

  3. Siga as convenções

  4. Considere criar um menu fixo

  5. Limite o número de itens no menu

  6. Crie menus mega dropdown se necessário

  7. Adicione uma barra de busca

  8. Destaque seu menu

  9. Adicione um link do logo à página inicial

  10. Indique em qual página o visitante se encontra

  11. Garanta que seja possível chegar a qualquer página de qualquer página



O que é usabilidade? Como a navegabilidade pode ajudá-la?


Usabilidade é definida como a facilidade com que as pessoas fazem uso de certa ferramenta para realizar determinada tarefa, de forma satisfatória e agradável. Esta ferramenta pode ser um objeto concreto, mas também um sistema, um software ou um site. No caso do web design, a usabilidade é medida em função da facilidade com que o visitante consegue cumprir seu objetivo ao acessar um site.


A usabilidade está composta dos seguintes elementos: navegabilidade, familiaridade, consistência, prevenção de erros, feedback e clareza visual, além de flexibilidade e eficiência. Neste artigo, explicamos o papel da navegabilidade dentro deste contexto. Preparamos um guia sobre como criar um site de forma que o visitante consiga navegar de maneira mais agradável, aumentando sua taxa de conversão, seja ela vendas, agendamentos, assinaturas ou qualquer objetivo que você tenha definido.


Tipos de navegação nos sites


Vamos começar pelo princípio. Apesar de cada site ser diferente em termos de conteúdo, design e estrutura, há alguns tipos padrão de menus de navegação que você conhece, e é capaz de reconhecer enquanto navega pela internet. Estas normas de usabilidade adotadas de forma generalizada, ainda que abertas à interpretação, ajudam os usuários a facilmente encontrarem o que buscam em um site:


Menu de navegação no cabeçalho do site: Esse é um menu clássico que aparece no topo de cada página do seu site, geralmente na horizontal, preenchendo uma faixa da tela, de lado a lado.


Barras laterais, à esquerda ou à direita do site: Essa é uma lista localizada na lateral da sua página. Pode ser pequena, ou até mesmo ocupar um lugar central, tornando-se parte integral do design, como no site Wix do designer gráfico Beeple.


Menu dividido: Esta tendência do web design relativamente nova quebra o padrão do menu adicionando links para cada página nos cantos ou laterais da tela.


Menu hambúrguer: Apesar deste tipo de menu ser frequentemente visto no web design para mobile, o ícone simples de três linhas agora também é visto nas versões desktop de muitos sites. O menu hambúrguer tem um ícone minimalista, que não interfere com o design do site e é especialmente útil quando o espaço principal é limitado (como nas telas dos dispositivos mobile, onde nasceu).


Rodapés: O rodapé do seu site é um excelente local para adicionar os links para suas redes sociais, e quaisquer outros links que os visitantes do site possam achar úteis. Também é possível repetir aqui o menu de navegação que está no topo da sua página.





01. Planeje a navegação


Algumas coisas ficam melhores quando feitas com espontaneidade. Mas quando se trata de criar um site, definitivamente é necessário pensar com antecedência, para ter ampla visão do que almeja. Antes de mergulhar a fundo, procure ter uma ideia clara de quais recursos e páginas seu site necessita e qual deve ser sua hierarquia. Vai precisar de uma página “Sobre”, um blog ou uma seção FAQ para as perguntas frequentes? Qual dessas páginas é mais importante ou tem mais valor para os visitantes do seu site em termos de usabilidade?


Para planejar seu menu de acordo com suas necessidades, crie um “sitemap”, que é uma lista de todas as principais páginas do seu site e todas as subcategorias dessas páginas. Deve ficar claro quais páginas são mais importantes, e quais têm menor importância. Seu sitemap vai formar a base do seu menu de navegação. Para criar um sitemap, você pode usar o método que for melhor para você: pode escrever à mão, pode ter a forma de um fluxograma ou um gráfico, ou também pode digitar em uma planilha.


Por exemplo, se você está criando um site para uma marca de cosméticos, as suas páginas principais podem ser sua página inicial, uma seção “Sobre” e uma loja virtual. No entanto, na seção da sua loja virtual, você pode fazer uma divisão por categorias, como cuidados com a pele, produtos para cabelo e produtos mais vendidos. Essa hierarquia deve ser refletida em seu sitemap.





02. Priorize suas páginas


Quando decidir a hierarquia das páginas do seu site, leve em consideração para onde você quer que os visitantes se direcionem e qual a melhor maneira de conduzi-los através do funil. Desta forma, a navegabilidade ajuda a converter visitantes em consumidores ou fãs. Além disso, pense qual é a informação que mais pode interessar aos seus visitantes. Isso chama-se “navegação principal” e deve ser facilmente acessível - o mais fácil possível. Todas as páginas que fazem parte da navegação principal devem constar do menu principal do seu site.


Mesmo dentro do seu menu principal você vai ter algumas páginas com alta e outras com baixa prioridade. Após definir a prioridade das suas páginas agora, transmita-a para o design do menu de navegação, de forma que as páginas mais cruciais se destaquem. Uma boa maneira para fazer isso, além de ser uma regra geral de navegabilidade, é colocar suas páginas de mais alta prioridade no início ou no final do menu, pois os itens que aparecem nesses locais do menu são os que atraem mais atenção.


Se o seu site tem muita informação, talvez você precise ajudar a usabilidade criando um menu adicional para as páginas secundárias. Essas páginas são menos importantes, mas ainda assim requerem clara navegabilidade. Este menu secundário deve atrair um pouco menos de atenção, usando caracteres menores e talvez uma cor menos contrastante.



03. Siga as convenções


Apesar da tentação de surpreender e partir para um tipo de design nunca antes visto, há alguns momentos em que é melhor se ater ao que as pessoas conhecem. Afinal, há um motivo para os hiperlinks geralmente serem de cor azul e sublinhados, ou por que o logo normalmente é colocado nos cantos no topo do site. Essas nuances familiares ou “convenções do design” existem porque funcionam - é simples assim.


Quando se trata da navegabilidade, o objetivo é que os usuários possam deslizar perfeitamente através do seu site da forma mais fácil possível. Mesmo se o conteúdo, os produtos ou o design são completamente novos para os visitantes, eles esperam encontrar o menu posicionado em um dos locais que são padrão - no canto superior ou no cabeçalho do site.


Claro que há vezes onde você pode fugir das normas da usabilidade. Tente fazer isso só se servir ao seu propósito ou à sua mensagem. Veja como a artista e ilustradora Rose Blake combina um menu padrão no topo do seu site Wix com um menu na forma de ilustrações nas quais é possível clicar para descobrir mais sobre os trabalhos dela.



04. Considere criar um menu fixo


Um menu fixo (também conhecido como "menu flutuante") é um menu que fica fixo mesmo se os visitantes rolam ao longo do seu site. Isso é útil para a navegabilidade em páginas de longa rolagem, para que os visitantes não tenham que rolar tudo de volta só para acessar o menu e chegar a outra página. No entanto, ainda há a opção de adicionar um botão “De Volta ao Topo” que vai ajudar os usuários a economizar tempo. Qualquer uma das soluções que você escolher dependem do design e layout do seu site, por isso leve em conta as diferentes opções quando for considerar qual a forma de navegação mais conveniente no seu caso.


Para criar um menu flutuante no Wix, basta clicar em “Adicionar” à esquerda do Editor, depois em “Menu” para escolher o estilo de menu que você quer, e então escolher “Fixar na Tela”.





05. Limite o número de itens no menu


Ninguém gosta de ser bombardeado com muita informação. Já basta tentar manter o foco enquanto navegamos pela internet com tanta coisa que surge e distrai. Para facilitar a usabilidade do seu site, restrinja o menu ao mínimo possível, tendo no máximo seis ou sete categorias. Dessa forma, os usuários vão conseguir processar melhor a informação e alcançar as páginas desejadas mais rapidamente.


Se o seu site tem muita informação, você pode dividi-la em seções, usando um menu dropdown. Isso significa que, ao passar o mouse por cima de um item, surge uma lista de subcategorias para os visitantes escolherem o que estão procurando. No entanto, tente evitar menus dropdown sempre que possível, pois os usuários esperam ir diretamente para a outra página quando clicam em um item do seu menu. Esse passo a mais pode ser sentido como um pequeno “tropeço” na experiência do usuário.



06. Crie menus com mega dropdown se necessário


Apesar de recomendarmos limitar os itens do menu, se seu site contém muito conteúdo, nem sempre isso é possível. Nesses casos, você pode criar um mega menu, que são grandes listas ou painéis que abrem a partir de um menu de navegação clássico, e oferecem uma vasta gama de opções.


Um exemplo clássico são os sites de eCommerce que vendem muitos produtos diferentes. Você não inclui todos os seus produtos em um menu, pois vai ficar muito bagunçado. Ao invés disso, você pode separar seus produtos por categorias, permitindo que o usuário tenha uma experiência de navegação mais organizada. Por exemplo, se você tem um site de uma academia de ginástica, seu menu principal pode incluir um item “Aulas” com um mega dropdown dividido em categorias como “Aeróbica”, “Alongamento” e “Aulas para Gestantes”. Sob cada uma dessas subcategorias estariam todas as aulas específicas.


Para evitar qualquer confusão ou sobrecarregar a informação, você pode usar ferramentas de design para criar uma hierarquia e evitar o caos. Experimente com estilos diferentes de tipografia para destacar as subcategorias - você pode usar negrito, um tamanho ligeiramente maior ou uma cor diferente do texto que fica abaixo. Você também pode adicionar um pouco de espaço a mais ao redor, para que os visitantes entendam essa separação.



07. Adicione uma barra de busca


Adicionar uma barra de busca é outra opção para a navegabilidade em sites com muito conteúdo. A barra de buscas pode fazer maravilhas para ajudar os visitantes a encontrar mais rapidamente aquilo que buscam. Lembre-se que seu site deve atender a um público com um tempo de atenção decrescente, e que espera que tudo funcione perfeitamente sem ter que esperar muito tempo. Uma barra de busca também pode beneficiar a usabilidade de seu site por parte daqueles visitantes que têm menos familiaridade com a internet, por ser um conceito que eles compreendem de imediato.


Em termos da localização, é bom posicionar a barra de busca mais ou menos alinhada ao menu. Ela deve ficar no cabeçalho do site e, como o menu, pode ficar fixa quando os visitantes rolam pelo seu site.



08. Destaque seu menu


Agora que você já sabe quais itens vão constar do seu menu, chegou o momento de decidir as palavras exatas e marcar claramente cada uma. É muito divertido ser criativo nesses pequenos pedaços de texto, mas as boas práticas de usabilidade e navegabilidade ditam que é necessário ter certeza de que seu usuário compreenderá rapidamente do que se trata. O menu não é o lugar para "viajar" com as palavras, nem para usar um vocabulário muito específico. Pelo contrário, o texto deve ser descritivo, direto ao ponto e, acima de tudo, bem claro.


Se você não está absolutamente certo sobre quais palavras vão funcionar melhor, pode experimentar duas versões diferentes e testá-las realizando testes A/B no seu site.



09. Adicione um link do logo à página inicial


Não adicionar ao seu logo um link que aponte de volta à página inicial é um erro comum do web design que pode facilmente ser evitado para melhorar a usabilidade de seu site. Seu menu não precisa incluir o termo “Página Inicial”. Ao invés disso, adicione o logo da sua empresa no topo de cada uma das páginas do seu site, e adicione um link para a página inicial. Esse comportamento já se tornou intuitivo para a maioria dos visitantes.


Frequentemente, os logos são colocados no lado esquerdo do cabeçalho, mas a localização exata varia. O mais importante é que seu logo esteja localizado no topo do seu site, relativamente próximo ao seu menu. Se você ainda não tem um logo, você pode usar um dos criadores de logo mais recomendados da internet.



10. Indique em qual página o visitante se encontra


As pessoas não gostam de sentirem-se perdidas, e isso também se aplica à navegabilidade de seu site. Você pode melhorar a experiência do usuário deixando bem claro para o visitante onde ele se encontra a todo momento. Há diversos métodos para fazer isso.


Você pode incluir um grande título, que dificilmente passará despercebido, adicionar as “migalhas de pão” (aquela lista textual que contém todas as páginas que o visitante visitou de forma a poder saber onde está no momento), ou simplesmente destacar no menu a página onde se encontra. Esta última opção é sutil e não causa nenhuma bagunça na página como as “migalhas de pão” poderiam potencialmente fazer.


Você pode indicar a página no menu dando uma cor diferente a esse item, deixando o texto em negrito, sublinhando o texto ou fazendo qualquer outra opção criativa que você possa imaginar que não atraia muita atenção.



11. Garanta que se possa chegar de qualquer página a qualquer página


A última dica é uma regra de ouro da navegabilidade. Os visitantes devem conseguir navegar para qualquer página que desejam, partindo de qualquer página onde se encontrem. Lembre-se que nem todos vão necessariamente chegar no seu site aterrissando na página inicial. Isso significa que em qualquer outra página que cheguem no seu site, devem poder se conectar com o restante do site.


A solução mais fácil é garantir que todas as páginas sejam acessíveis a partir do menu. E se todas as páginas incluírem um menu, a questão está resolvida. Para facilitar as coisas mais ainda, e deixar tudo mais intuitivo, mantenha a consistência no design de todas as páginas, colocando tudo exatamente no mesmo local para evitar confusão.


Pronto para aperfeiçoar a navegação do seu site? Comece já!

pt03.png