Descubra o que seus visitantes estão fazendo em seu site com mapas de calor

O ser humano é curioso por natureza. A curiosidade, em muitos aspectos, é uma das características que mais nos fez evoluir. Informação é poder, e ter informações sobre os outros é muito útil em muitos campos diferentes, incluindo o desenvolvimento de páginas da web.

Sem entrar no lado sombrio do mundo da privacidade, há muitas maneiras de gerenciar uma página da Web e usar a curiosidade de maneira ética para melhorar seu desempenho e fazer com que seus visitantes aproveitem suas páginas mais do que antes.

Heatmaps são uma técnica destinada a descobrir o que os visitantes fazem em uma página da web e ver como eles interagem com ela. Ou seja, os heatmaps permitem analisar o comportamento dos visitantes de forma agregada e anônima. Ao analisar o movimento do cursor na página da web, os mapas de calor são uma representação visual que mostra os pontos de acesso da sua página pintados com cores mais quentes.

Além disso, os mapas de calor nos permitem obter ideias de melhoria para aplicar em nosso site. Nós apenas temos que estudar os dados que vemos no mapa de calor para tirar conclusões sobre o que está acontecendo, o que os visitantes estão fazendo, o que está acontecendo de errado na web e como podemos resolvê-lo.

Como criar um mapa de calor no WordPress

Hoje em dia, criar um mapa de calor é extremamente simples. No WordPress só temos que usar um plugin que nos permite criar mapas de calor. De fato, os mapas de calor são um dos recursos mais exigidos por nossos usuários do Nelio A/B Testing.

Estamos criando mapas de calor há muito tempo para continuar pesquisando possíveis melhorias em nosso site. Como exemplo, mostrarei aqui o último mapa de calor que criamos na página principal do Nelio.

A primeira coisa é criar um novo mapa de calor. Para isso, selecionamos o novo teste no Nelio A/B Testing e escolhemos a página que nos interessa, como você pode ver na captura de tela a seguir:

Em seguida, basta iniciar o teste para que o plugin rastreie seus visitantes e agregue as informações automaticamente. A partir deste momento, um novo mapa de calor será gerado de forma incremental e poderemos ver os resultados graficamente.

Resultados do mapa de calor

Depois de rastrearmos um número representativo de visitantes, podemos observar em detalhes o resultado do mapa de calor. Tenha em mente que existem diferentes visões desses dados extraídos de nossos visitantes.

O tipo de visualização mais comum é o próprio mapa de calor, que mostra uma série de pontos de cores quentes mostrados na parte superior da página analisada. Esses pontos quentes são colocados sobre os elementos que receberam mais interação.

Por outro lado, temos o mapa de rolagem, que mostra com cores mais quentes até onde os visitantes desceram na página, rolando para baixo antes de sair.

Por fim, a última representação que geralmente podemos encontrar consiste em ver os cliques que foram feitos na página como uma nuvem de pontos ou confetes.

Na galeria anterior você tem o mapa de calor completo, mapa de rolagem e cofetti que nosso plugin criou ao analisar a página principal do nosso site. A seguir, vamos dar uma olhada em alguns detalhes das informações que podemos extrair de todas essas três representações.

Detalhes do mapa de calor

O mapa de calor mostra que grande parte da atividade de quem visita nossa página inicial ocorre na primeira parte da página. Encontramos muita interação nos botões que nos levam às páginas específicas de cada um dos nossos plugins, o que é algo que queremos que aconteça:

Mas também descobrimos que muitas pessoas clicam no sinal de seta na primeira dobra que indica que elas devem rolar para baixo. Infelizmente, esta seta é apenas um indicador e não é um elemento clicável. Então com certeza confunde nosso público, que ainda clica nele.

Como solução, poderíamos optar por transformar a seta em um botão que rola a página automaticamente. Ao fazer isso, alinhamos as expectativas do usuário com a realidade.

Por outro lado, é curioso ver como o rodapé também recebe muita atenção. Isso é importante, pois sugere que alguns usuários não encontram o que estão procurando até o final da página. Em particular, a área mais quente é o link de contato. Portanto, uma boa ideia de teste seria mover esse link para uma área mais proeminente da página, apenas para garantir que ninguém saia sem encontrar o que precisa.

Detalhes do mapa de rolagem

O mapa de rolagem mostra que a maioria de nossos visitantes não vê nada além de meia página. Com essas informações, a principal conclusão que podemos tirar é que o conteúdo daquele ponto será perdido e, portanto, não deveria ser relevante.

Para tornar nosso conteúdo mais atrativo para nosso público e assim evitar que ele saia, uma possibilidade é mostrar seções mais visuais e dinâmicas. O conteúdo estático não se destaca o suficiente e perdemos a atenção de nossos visitantes. Por esse motivo, propor mudanças nessas seções pode ser uma boa possibilidade para testar em um futuro teste A/B.

Detalhes do confete

Quanto ao confete, ele nos mostra uma nuvem de pontos com todos os cliques que recebemos durante o teste. Em comparação com um mapa de calor normal, os confetes incluem mais informações sobre cada clique individual.

Vemos como a maioria dos visitantes que clicam levou entre 5 e 10 segundos para fazê-lo. Conhecer esses dados é muito interessante, pois temos uma medida bastante aproximada do tempo que temos para chamar a atenção deles.

Quanto mais complexa a página e mais difícil de entender, mais visitantes perderemos. Essas informações podem nos ajudar a propor uma versão muito mais simples e radical da página. Por exemplo, poderíamos exibir menos informações e ir direto ao ponto. Esse é outro teste A/B possível que poderíamos tentar em seguida.

Além disso, podemos ver que há visitantes que clicam em elementos que não são clicáveis. Uma seção particularmente relevante aqui é a lista de logotipos de empresas que usam nossos produtos ou os depoimentos de nossos clientes:

Nessas seções, não temos elementos clicáveis, mas mesmo assim eles recebem cliques. Novamente, isso pode ser confuso e, portanto, é importante garantir que o comportamento do nosso site corresponda às expectativas de nossos visitantes. Para evitar isso, podemos decidir modificar o design dessas seções para deixar mais claro que você não precisa clicar nelas. Ou até mesmo deletar as seções, levando em consideração as informações no mapa de rolagem, onde já vimos que estávamos perdendo pessoas nessa parte da web.

O importante sobre os mapas de calor é obter ideias para melhorias analisando como nossos visitantes estão interagindo com nosso site. Dessa forma podemos corrigir comportamentos falhos e propor possíveis melhorias em nossa página que podemos testar com testes A/B posteriormente.

Deixe-me lembrá-lo de que a versão gratuita do Nelio A/B Testing permite que você crie mapas de calor em suas páginas do WordPress da maneira mais simples que expliquei aqui. Vá em frente e experimente. E depois nos conte sua experiência e quais informações você pode extrair através dessa representação visual do comportamento de seus visitantes.

Imagem em destaque por Almos Bechtold no Unsplash.