Erros de Usabilidade

7 Erros de Usabilidade que diminuem Conversões

Neste momento, em seu site, podem existir 7 erros comuns de usabilidade que podem estar atrapalhando e diminuindo suas conversões e você nem imagina!

Felizmente, já existem uma série de pesquisas de UX (experiência do usuário) e de eye-tracking, e você está prestes a obter acesso a esses estudos cheios de critérios técnicos, de maneira resumida e objetiva, o que lhe permite incorporar seus entendimentos em seu site para aumentar (ou equalizar) suas conversões.

Você vai ver como os aspectos que pareciam insignificantes podem determinar enormes melhorias de performance.

Vamos começar citando os problemas mais comums:

 

1 – Não dar ênfase nos Títulos de destaque

Tendo formação como Designer Gráfico, posso assumir conscientemente que muitos designers são culpados por esse problema. Muitos designers acham que dar ênfase nos títulos em destaque é uma prática muito alienada apenas para vendas e não acreditam que isso trará grandes retornos.

De acordo com os dados do estudo Eyetrack III , os títulos em destaque são as coisas mais vistas nas páginas, mais até do que animações em flash!

Aqui estão algumas estatísticas interessantes sobre o poder dos títulos:

  • Títulos chamam a atenção das pessoas quase imediatamente e conseguem superar as imagens com uma grande margem
  • Pessoas prestam atenção apenas nas primeiras palavras dos títulos antes de tomarem a decisão de sair ou ficar em seu site
  • Seu título tem aproximadamente ~ 1 segundo para capturar a atenção do leitor, antes de ser ignorada.

Por isso é importante: Você está matando suas vendas ou conversões se as principais páginas do seu site não são compostas por grandes títulos em destaque dizendo aos seus clientes exatamente o que eles estão prestes a ver em sua página.

Isto é a grande verdade, começando em primeiro lugar com o seu website. Veja um exemplo do site do Spotify.

Exemplo de título bem aplicado do Spotify.
Exemplo de título bem aplicado do Spotify.

Mas não termina aí! Você precisa criar títulos claros e concisos em todas as páginas que contenham informações importantes.

Um exemplo disso é sua página de “planos ou recursos”, que é um dos primeiros destinos para clientes interessados. O exemplo abaixo, do site do Scup, ilustra bem esta aplicação:

Página de Planos e Preços do Scup.
Página de Planos e Preços do Scup.

Por último, mas não menos importante, as páginas explicativas (fora da página inicial) também precisam conter títulos poderosos para poder transmitir sua mensagem e objetivo com clareza. Isso pode incluir páginas de depoimentos de clientes ou de benefícios de utilizar seu serviço ou produto, oferecendo aos clientes uma razão para ficar e entender mais. Veja abaixo mais um exemplo do Scup:

Página de Benefícios Scup.
Página de Benefícios Scup.

Os potenciais clientes devem ser imediatamente impactados com o objetivo principal da página, por exemplo na área de checkout do carrinho, pois você tem pouquíssimo tempo antes deles perderem o interesse.

 

2 – Ter um site com Carregamento Lento

Você provavelmente já ouviu isso antes – um site lento não é bom para as vendas porque as pessoas são impacientes.

Mas você sabe o quão grave esse problema realmente é?

Grande parte da discussão por aí sobre a velocidade do site é superficial, vamos abordar aqui uma pesquisa que mostra a verdade chocante sobre como a velocidade do site é realmente importante.

De acordo com esta análise realizada pela equipe do Bing, da Microsoft, a velocidade da página é um enorme fator em uma série de estatísticas importantes:

[quote_center]Apenas 2 segundos de lentidão no carregamento da página, reduzem a satisfação do usuário em 3,8%, diminuem a receita por usuário em 4,3% e conseguem reduzir os cliques em 4,4%.[/quote_center]

Os usuários são realmente impacientes, e sua punição por um site lento não será vista em forma de reclamações em sua caixa de emails, mas sim em perda de vendas e possíveis conversões de pessoas que decidiram que o que você estava vendendo ou oferecendo não valia a pena esperar.

grafico-site-lento-trendwave
Análise pela equipe Microsoft.

Se você também levar em consideração que o Google classifica as páginas com base em sua velocidade , o que nos resta é um aviso muito claro que você precisa ter um site rápido se você deseja que seu negócio cresça.

Se você é proprietário de um site, webmaster ou um autor de web, aqui estão algumas ferramentas gratuitas que você pode usar para avaliar a velocidade de seu site:

  • Page Speed​​, um open source Firefox / Firebug add-on que avalia o desempenho de páginas web e dá sugestões de melhoria.
  • YSlow, uma ferramenta gratuita da Yahoo! que sugere formas de melhorar a velocidade do site.
  • WebPagetest mostra uma vista da cachoeira do desempenho de carga das suas páginas, mais uma lista de verificação de otimização.
  • Em Ferramentas do Google para webmasters, Labs> Desempenho do Site mostra a velocidade do seu site vivida pelos usuários ao redor do mundo, como no quadro abaixo.

 

3 – Tipografia ilegível e pouco respiro

Este pode parecer luxo de designer, mas definitivamente não é. Uma escolha de tipografia tem enorme importância em disponibilizar uma experiência fluida de navegação de seus usuários, e se sua tipografia não está definida corretamente, você poderá perder clientes.

De acordo com este estudo sobre a legibilidade, a tipografia é uma das maiores influências na compreensão da leitura, quando se trata de texto na web.

O estudo revela como pequenas margens e espaços conseguem ajudar as pessoas a ler mais rápido, mas isso reduz muito a sua compreensão do texto na página:

Estudo sobre efeito das margens em seu site.
Estudo sobre efeito das margens em seu site.
[quote_center]Se eles não gostam da forma de ler seu conteúdo, eles não vão te avisar, eles apenas não acessarão mais seu site.[/quote_center]

Veja abaixo algumas dicas de como melhorar a tipografia de seu site:

margem-erros-usabilidade-trendwave1

Melhore as margens: Aumente as margens em relação ao texto e a página, as alturas das linhas nos textos adicionando espaços em branco, tanto entre linhas quanto em torno deles.

 

margem-erros-usabilidade-trendwave-2

Melhore o contraste: enquanto o preenchimento com cores pode parecer bom, na verdade é uma grande distração para os seus clientes. Adicionar muitas cores ao mesmo tempo desviam a atenção e dificultam o entendimento.  As cores mais fáceis de ler? Bom, texto preto à moda antiga sobre um fundo branco. Pode não ser original, mas obtém resultados.

 

4 – Design fora dos padrões de leitura

A maneira como lemos dita a maneira como navegamos em um website, porque na maioria das vezes, os sites vão conter algum conteúdo escrito.

O resultado deste estudo de eyetracking revela a nossa tendência para navegar em um formato parecido com a letra F:

eye-tracking-trendwave
Estudo de Eye Tracking.

Esses estudos têm sido utilizados como referência por vários sites e designers focados em trazer bons resultados na usabilidade do site. Nós, ocidentais, temos como padrão a leitura da esquerda para a direita, portanto temos a tendência de uma leitura baseada em uma navegação linear.

O diagrama de Gutemberg nos mostra o comportamento do usuário ocidental conhecido como “gravidade de leitura”. Ele sugere que o processo de escaneamento dos blocos de conteúdo acontece da esquerda para a direito e de cima para baixo, formando um Z. Veja o diagrama abaixo:

diagrama-gutenberg-trendwave
Diagrama de Gutenberg

 

Dessa forma, conseguimos identificar quais são as áreas mais significativas da página, facilitando a organização da hierarquia das informações ao construir seu site. Veja o diagrama aplicado na página inicial do Facebook:

Exemplo de diagrama aplicado no site do Facebook.
Exemplo de diagrama aplicado no site do Facebook.

 

De acordo com um estudo separado, muitos usuários da Internet dedicam a maior parte de sua atenção no lado esquerdo de uma página web – tanto que 69% do tempo:

Estudo revela tempo de visualização nas informações contidas no lado esquerdo do site.
Estudo revela tempo de visualização nas informações contidas no lado esquerdo do site.

Se o seu site tem uma interface que os usuários precisam interagir com regularidade, este é um estudo importante para se ter em mente quando você for fazer testes A/B para encontrar o melhor engajamento com os elementos de seu site.

 

 5 – Menus de Navegação Confusos

Os menus de navegação são um dos principais fatores de engajamento dos usuários em seu site, portanto eles tem que ser fáceis de achar, de usar e proporcionar uma experiência fluida, contínua! Veja um exemplo de menu do site Wallmart:

Exemplo de menu de navegação do Wallmart.com.br
Exemplo de menu de navegação do Wallmart.com.br

Algumas empresas, no entanto, simplesmente não conseguem acertar navegaçãoElas aplicam os menus em lugares aleatórios, os tornam genéricos, difíceis de achar ou incluem muitas opções.

De acordo com este teste envolvendo o design de sites, mais de 70% dos usuários recorreram a clicar em um link ao invés de usar o campo de pesquisa.

Isso coincide com outro estudo que mostra que os usuários apenas usam o campo de pesquisa quando eles realmente não conseguem encontrar o que estão procurando, o que significa que você não pode confiar plenamente no campo de pesquisa como uma muleta.

Certifique-se de que os menus de navegação de seu site estão em uma área onde as pessoas possam encontra-los facilmente, utilize títulos auto explicativos, e que contenham links suficientes para navegar em todas as partes importantes de seu site, mas não exagere na quantidade. Ah, e não se esqueça de deixar o campo de pesquisa bem evidente!

Exemplo de menu enxuto e objetivo.
Exemplo de menu enxuto e objetivo.

 

6- Não otimizar a quantidade de cliques

Os usuários estão cada vez mais acostumados a navegar em sites, procurar e comparar produtos, assinar newsletters, fazer pesquisas e entre outras interações, mas mesmo assim, a quantidade de clicks que eles precisam dar para atingir seu objetivo influencia drasticamente. Por exemplo : Quantidade de clicks entre o botão de “comprar” a a página de confirmação de pagamento.

Se os usuários tiverem que clicar em diversos links e botões para completar uma tarefa, e se esse caminho for longo demais e sem dados ou “pistas para apoiá-los na navegação, como títulos das páginas ou uma linha do tempo, a chance de desistirem no meio do caminho é enorme.

[quote_center]O foco não deve estar apenas em diminuir cliques para um número específico, mas sim em analisar toda a arquitetura de informação de seu site, e assim averiguar qual é facilidade de utilização. Mantenha simples![/quote_center]

 

Exemplo de SmartCheckout da Vtex.
Exemplo de SmartCheckout da Vtex.

 

Dica: mantenha sempre formulários de cadastro apenas com informações essenciais, ofereça login automático com redes sociais, elimine páginas e botões inúteis, e utilize breadcrumbs!

Lembre-se: você tem pouco tempo para conseguir gerar uma conversão, então foque em seu objetivo e elimine informações desnecessárias. A Vtex já utiliza um checkout com 3 clicks, saiba mais aqui.

 

7 – Não dar respiro em longas páginas de destino

Em um estudo de caso muito interessante, Neil Patel nos mostra que longas landing pages (páginas de destino) definitivamente podem ser uma coisa boa, concluindo que:

  • Os usuários tendem a ser mais persuasivos
  • O comprimento da página traz leads mais qualificados, pois a maioria deles tomou um tempo para ler seu conteúdo até o final.

O problema é, como muitos sabem e estudos comprovam, que quanto maior a página, maior o Bouncing Rate, ou seja, menos pessoas ficam e lêem seu conteúdo até o final.

Dê uma olhada nos dados do presente estudo :

Velocidade de leitura do usuário por minuto.
Velocidade de leitura do usuário por minuto.

Isso cria um dilema: Se as páginas de destino mais longos pode ser úteis e trazer leads mais qualificados, mas as pessoas tendem a odiar a leitura de conteúdo que parecem uma “parede de texto”, o que podemos fazer?

A resposta é se concentrar em segmentar seu conteúdo, utilizando tópicos contrastantes com títulos objetivos e auto explicativos, e aplicar um maior espaçamento entre eles, com isso a leitura fica mais leve, e assim a chance dos usuários rolarem até o fim de sua página é maior. Além disso, a utilização de tópicos facilita a leitura e agiliza o processo para quem não tem muito tempo.

Dê uma olhada neste exemplo abaixo:

quebra-linha-usabilidade-trendwave

Mais tópicos e quebras de linha:  Dessa forma, mais conteúdo se torna menos intimidante e muito mais fáceis de ler, fazendo com que suas longas landing pages sejam realmente efetivas.

 

Agora que você já sabe quais são os 7 erros mais comuns de usabilidade, corra para seu site e comece sua análise! As mínimas alterações podem fazer toda a diferença!