Heatmaps e gravações: onde a página perde o visitante

Heatmap mostra onde as pessoas clicam, até onde rolam e por onde o mouse passa. Gravações de sessão mostram o resto: a hesitação, o clique repetido no mesmo botão que não responde, o formulário abandonado no terceiro campo. Juntas, essas duas ferramentas respondem a pergunta que o Google Analytics sozinho não responde: por que o visitante entrou na página e foi embora sem converter.

Este artigo explica o que cada tipo de heatmap revela, como usar gravações de sessão sem afogar em horas de vídeo, quais são os quatro sintomas clássicos de página que perde visitante e como transformar cada achado em hipótese de teste. E o que mascarar antes de gravar qualquer coisa, porque LGPD não é detalhe.

O que um heatmap mostra e o que ele não mostra

Um heatmap é um mapa de calor sobreposto à sua página. Zonas quentes indicam concentração de interação, zonas frias indicam ausência dela. É agregado: ele soma o comportamento de centenas ou milhares de visitas em uma única imagem. Essa é a força e a limitação da ferramenta ao mesmo tempo.

A força: padrões aparecem em segundos. Você olha e vê que ninguém chega na sua prova social, que metade dos cliques vai para um elemento que não é clicável, que o botão principal está frio. Nenhum relatório de analytics entrega isso com essa clareza visual.

A limitação: heatmap mostra o quê, nunca o porquê. Ele diz que 70% dos visitantes param de rolar antes do preço, não diz se pararam porque acharam o que queriam ou porque se perderam. Para o porquê, você precisa das gravações. Por isso as duas andam juntas, e tratar heatmap como diagnóstico completo é o erro número um de quem começa.

Heatmap também não é pesquisa de opinião, teste A/B nem substituto do rastreamento de eventos: é a camada de observação que alimenta as outras. Se você ainda está montando essa base, o nosso guia sobre o que é CRO coloca cada peça no lugar certo.

Heatmap de clique: onde a atenção vira ação

O mapa de cliques registra cada toque ou clique na página. É o mais direto dos três tipos e o que gera achados mais rápidos. Você está procurando duas coisas: cliques onde não deveria haver e ausência de cliques onde deveria haver.

Cliques em elementos não clicáveis são ouro de diagnóstico: imagens que parecem abrir galeria, títulos que parecem links, ícones que parecem botões. Cada clique desses é um visitante que tentou avançar e bateu na parede. A correção costuma ser barata: torne o elemento clicável ou tire dele a aparência de clicável.

O inverso também importa. Se o seu botão principal está frio no mapa de cliques, o problema raramente é o botão em si. Ou ele está abaixo do ponto onde as pessoas param de rolar, ou a página não construiu motivo suficiente para o clique até ali, ou existe outro elemento roubando a atenção. O mapa de cliques aponta o sintoma, e a seção de scroll logo abaixo costuma explicar a causa.

Um detalhe que muita gente ignora: analise mobile e desktop separados, sempre. A média dos dois é um número que não descreve ninguém.

Heatmap de scroll: a dobra onde a página morre

O mapa de scroll mostra o percentual de visitantes que chegou a cada profundidade da página. Ele começa em 100% no topo e vai caindo. O que você procura é o degrau: o ponto onde a curva despenca em vez de descer suavemente.

Queda suave é natural, ninguém espera 100% de leitura até o rodapé. Queda abrupta é sintoma. Quase sempre o degrau coincide com um elemento visual que sinaliza fim de conteúdo: uma faixa de cor que fecha a seção, um bloco de logos, um espaço em branco grande demais, uma imagem de largura total. O visitante entende que acabou e vai embora, mesmo com metade da página ainda por vir.

A pergunta prática: o seu argumento mais forte e o seu botão principal estão acima ou abaixo do degrau? Se a sua melhor prova social vive numa região que só 20% dos visitantes alcançam, você está argumentando para uma sala quase vazia. Reordenar seções com base no mapa de scroll é uma das otimizações de melhor custo-benefício que existem, porque não exige redesenhar nada, só mudar a ordem.

Em landing pages o mapa de scroll é ainda mais decisivo, porque cada seção existe para empurrar o visitante ao próximo passo, e uma dobra morta quebra a corrente inteira. É esse tipo de leitura que usamos ao estruturar landing pages por aqui.

Heatmap de movimento: pista, não prova

O mapa de movimento rastreia por onde o cursor passa, partindo da correlação parcial entre movimento do mouse e atenção do olhar. Parte dos usuários lê com o mouse parado, outra parte estaciona o cursor num canto. E em mobile, onde não há cursor, esse mapa simplesmente não existe.

Use-o como pista secundária: se o movimento sugere algo, confirme no mapa de cliques, no de scroll ou nas gravações. Ordem de prioridade honesta para quem tem pouco tempo: scroll primeiro, cliques em segundo, movimento por último. Os dois primeiros carregam quase todo o valor de diagnóstico.

Testar isso sozinho é possível, mas leva tempo e alguns erros caros até acertar a ordem. É aí que a Agência D'avila entra: já construímos essas páginas dezenas de vezes e sabemos qual mudança costuma pesar mais.

Gravações de sessão: o filme por trás do mapa

Gravação de sessão é o replay anônimo da visita: você assiste o cursor se mover, a página rolar, os campos serem preenchidos. É a ferramenta que transforma o "o quê" do heatmap no "porquê" que você precisa para agir.

O erro clássico é assistir gravações aleatórias. Dez sessões escolhidas ao acaso são dez visitas medianas que não ensinam nada, e você desiste da ferramenta na primeira semana. Gravação se usa com filtro, nunca a esmo.

Filtre por comportamento de fricção. As boas ferramentas marcam sessões com rage click, com erro de JavaScript, com abandono de formulário, com saída rápida de página que costuma reter. Comece por essas. Vinte sessões filtradas por "abandonou o formulário" ensinam mais que duzentas aleatórias.

Depois, filtre por segmento que importa para o negócio: visitantes de campanha paga, visitantes mobile, quem chegou na página de obrigado e quem quase chegou. Se você roda tráfego pago, assistir a sessão de quem veio do anúncio e não converteu é a auditoria mais barata que existe do seu funil.

Os quatro sintomas clássicos de página que perde visitante

Depois de analisar comportamento em dezenas de páginas, os mesmos quatro padrões aparecem com uma frequência quase constrangedora. Aprenda a reconhecê-los e você diagnostica a maioria dos problemas de conversão sem precisar de mais nada.

Rage click: o visitante brigando com a página

Rage click é a sequência de cliques rápidos e repetidos no mesmo ponto. É frustração pura registrada em dados. As causas mais comuns: elemento que parece clicável e não é, botão que não dá feedback visual ao ser clicado, script lento que faz o visitante achar que o clique não funcionou, e pop-up ou banner cobrindo o alvo real.

Todo rage click merece investigação, porque ele nunca é neutro. O visitante que briga com a página três vezes na mesma sessão dificilmente preenche seu formulário depois. Filtre as gravações por rage click, assista cinco ou dez, e o padrão salta aos olhos.

Falso botão: o elemento que engana

Falso botão é qualquer elemento com aparência de interativo que não faz nada: card com sombra e borda de botão, texto sublinhado que não é link, seta que não avança, imagem de banner que não abre nada. No mapa de cliques ele aparece como uma zona quente sem destino.

A correção tem dois caminhos e os dois são válidos. Ou você dá função ao elemento, apontando para onde o visitante espera ir. Ou você remove os sinais visuais de interatividade: tira a sombra, o sublinhado, o cursor de mãozinha. O que não pode é deixar a promessa visual sem entrega.

Formulário que trava: o vazamento mais caro

Formulário é onde a intenção já existe e a página consegue, mesmo assim, perder a venda. Nas gravações, o padrão é visível: o visitante preenche dois ou três campos, para em um específico, tenta, apaga, tenta de novo e fecha a aba. Os vilões de sempre: máscara de telefone que rejeita formato válido, validação que só acusa erro no envio final, campo obrigatório sem indicação, mensagem de erro genérica que não diz o que corrigir, e seleção de data que não funciona no celular.

Ferramentas de análise de formulário mostram taxa de abandono por campo. Se um campo concentra as desistências, ele é seu suspeito número um. Muitas vezes a solução é simplesmente remover o campo: cada informação a mais que você pede tem um custo, e boa parte delas você não usa para nada.

Dobra onde o scroll morre: o argumento que ninguém lê

É o degrau do mapa de scroll descrito acima, e merece lugar na lista porque é o sintoma mais comum de todos. A página tem bom conteúdo, boa oferta, boa prova social. Só que tudo isso mora abaixo do ponto onde 70% dos visitantes já foram embora. O diagnóstico leva dois minutos no mapa de scroll, e a correção é reordenação, não redesign.

Se a sua página recebe visitas e não gera contatos, esses quatro sintomas são o primeiro lugar onde procurar. Temos um roteiro completo dessa investigação em site que não gera contatos: o diagnóstico.

Como transformar achado em hipótese de teste

Achado sem hipótese vira opinião com print. O valor do diagnóstico por comportamento está em alimentar decisões testáveis, e para isso cada achado precisa ser traduzido em uma frase com estrutura fixa: como observamos X, acreditamos que mudar Y vai melhorar Z, e vamos medir por W.

Exemplo real de estrutura. Achado: mapa de scroll mostra queda de 60% para 25% na altura do bloco de logos. Hipótese: como a maioria abandona no bloco de logos, acreditamos que ele sinaliza fim de página; mover os depoimentos para cima do bloco deve aumentar o alcance da prova social e a taxa de cliques no botão principal. Métrica: cliques no CTA e conversões do formulário.

Repare no que a estrutura obriga: evidência observada, mecanismo suposto, mudança específica, métrica de sucesso. Sem os quatro, você não tem hipótese, tem palpite. E palpite testado continua sendo palpite, só que mais caro.

Nem todo achado precisa virar teste A/B. Bug é bug: formulário que rejeita telefone válido se corrige direto, sem teste, porque não existe versão em que o defeito ganha. Reserve o teste A/B para mudanças onde há dúvida legítima sobre o efeito: reordenar seções, trocar abordagem de título, mudar o formato do formulário. Sobre o que priorizar quando há vários candidatos, escrevemos um guia inteiro: teste A/B: o que testar primeiro.

Uma regra prática de priorização: cruze severidade com alcance. Problema que afeta todo mundo em página de alto tráfego vem antes de problema que afeta pouca gente em página secundária. Parece óbvio escrito assim, mas a tentação de começar pelo achado mais interessante em vez do mais impactante é real.

Quanto dado é suficiente antes de concluir qualquer coisa

Heatmap com 80 visitas é um teste de Rorschach: você enxerga nele o que já acreditava antes. Antes de concluir, garanta volume mínimo. Como referência de trabalho, algumas centenas de sessões por versão de página e por dispositivo já revelam os padrões grandes; para decisões mais finas, busque mais.

Três cuidados que separam leitura séria de leitura enviesada. Primeiro, separe dispositivos: mobile e desktop são páginas diferentes na prática e a média dos dois não descreve nenhum. Segundo, separe fontes de tráfego quando possível: quem vem de anúncio se comporta diferente de quem vem de busca orgânica. Terceiro, congele o layout durante a coleta: se a página mudou no meio do período, o heatmap virou uma sobreposição de duas realidades.

E resista à conclusão na primeira sessão dramática. Uma gravação de visitante perdido é uma anedota. Dez gravações com o mesmo padrão de comportamento são um achado. A disciplina de esperar o padrão se repetir é o que impede o time de sair corrigindo ruído.

Privacidade e LGPD: o que resolver antes de gravar a primeira sessão

Gravação de sessão captura o que o visitante digita e onde navega. Isso coloca a ferramenta diretamente no território da LGPD, e tratar isso depois de instalar é a ordem errada. O básico se resolve em uma tarde, mas precisa ser resolvido antes.

Primeiro, mascaramento de dados. Toda ferramenta séria permite mascarar campos de formulário, e as boas já mascaram inputs por padrão. Nome, e-mail, telefone, documento, endereço e qualquer campo de pagamento devem aparecer na gravação como asteriscos ou blocos. Configure a supressão no nível do site, não página a página, e teste assistindo a uma sessão sua antes de liberar.

Segundo, transparência. Sua política de privacidade precisa declarar que ferramentas de análise de comportamento são usadas, com qual finalidade e por qual base legal. Na maioria dos casos de analytics de comportamento com dados mascarados, o legítimo interesse é a base defensável, mas isso exige que a coleta seja mesmo minimizada. Se o seu site usa banner de consentimento para scripts de marketing, a ferramenta de gravação deve respeitar a mesma escolha do visitante.

Terceiro, retenção e acesso. Defina por quanto tempo as gravações ficam armazenadas e quem da equipe pode assisti-las. Gravação de sessão é ferramenta de diagnóstico, não arquivo permanente: períodos curtos, de semanas a poucos meses, cobrem o uso real e reduzem sua exposição.

O resumo honesto: nada disso impede o uso da ferramenta. Impede o uso descuidado. Anonimização de IP ativada, inputs mascarados, política atualizada e retenção curta formam um padrão que protege o visitante e protege você.

Diagnóstico por comportamento é metade do nosso CRO

Aqui vai a parte que explica por que este artigo existe. Na D'avila Agency, otimização de conversão não começa com opinião sobre cor de botão. Começa com observação: heatmaps e gravações nas páginas que recebem tráfego, análise de formulário nos pontos de captura, e o rastreamento de eventos amarrando comportamento a resultado de negócio.

É esse diagnóstico que alimenta o CRO das páginas que construímos e otimizamos. Quando montamos uma landing page, o mapa de scroll das versões anteriores define a ordem das seções. Quando um formulário converte abaixo do esperado, as gravações filtradas por abandono dizem qual campo está travando. E quando o comportamento precisa virar dado de mídia, o nosso trabalho de rastreamento de clientes fecha o circuito entre o que a pessoa fez na página e o que a campanha aprende com isso.

Se a sua página recebe visitas e converte menos do que deveria, esse é exatamente o tipo de investigação que fazemos antes de propor qualquer mudança. Dá para começar com uma conversa objetiva sobre o seu cenário: é só chamar pelo nosso contato. Você sai com clareza sobre onde a página está perdendo gente, mesmo que decida corrigir por conta própria.