Pular para o conteúdo

CRO e mapa de calor

Mapa de calor de site: o que é, como ler e por onde começar

O mapa de calor mostra em cores o que os visitantes fazem em cada página. Entenda os tipos, aprenda a interpretar as manchas e escolha a primeira ferramenta para instalar.

· Designer de landing pages e fundadora da Fysi Lab Digital

· Atualizado em · 11 min de leitura

Capa do post: Mapa de calor de site: o que é, como ler e por onde começar
Neste artigo
  1. O que é mapa de calor e quais são os tipos?
  2. O que o mapa de calor revela sobre a sua página?
  3. Como interpretar um mapa de calor na prática?
  4. Em que situação o mapa de calor é a escolha certa?
  5. Quais ferramentas de mapa de calor usar?
  6. Perguntas frequentes
  7. Otimização de conversão guiada pelo que os visitantes fazem

Mapa de calor é um relatório visual que pinta, sobre a imagem da página, as áreas com mais e com menos atividade dos visitantes: onde eles clicam, até onde rolam e onde passam mais tempo. As cores quentes, como o vermelho, marcam os pontos de maior atividade. Com ele, você vê o que chama atenção no site e o que passa despercebido.

O que é mapa de calor e quais são os tipos?

Mapa de calor (heat map, em inglês) é a visualização que reúne o comportamento de muitos visitantes em uma única imagem da página. As áreas mais usadas ficam vermelhas. As menos usadas aparecem em tons frios ou ficam sem cor. O nome muda conforme o dado registrado: mapa de cliques, mapa de rolagem, mapa de movimento do mouse.

Os primeiros mapas a se popularizar seguiam o cursor. A lógica é simples: durante a leitura, muita gente leva o mouse para perto das palavras, como quem acompanha a linha com o dedo. O cursor também para em cima de um botão enquanto a pessoa decide se clica. O rastro dele serve, então, de pista sobre o que atrai o olhar, as opções que o visitante está avaliando e os trechos que causam confusão.

Hoje os mapas mais usados registram outros sinais. No Microsoft Clarity, gratuito e bom ponto de partida, existem cinco tipos:

  • Cliques: onde as pessoas clicam ou tocam.
  • Rolagem: até que altura da página elas descem.
  • Área: o total de cliques dentro de um bloco que você seleciona.
  • Atenção: quanto tempo elas passam em cada parte da página.
  • Conversão: quais cliques levam a compras, no caso de lojas virtuais.

O movimento do cursor, nessa ferramenta, aparece nas gravações de sessão. A informação é da documentação do Clarity (consultada em 9 de outubro de 2026). Para ir além da definição, veja o guia sobre relatórios de heat map voltados à usabilidade.

O que o mapa de calor revela sobre a sua página?

O mapa de calor mostra o que recebe atenção e, com a mesma clareza, o que fica de fora. As áreas frias costumam ensinar tanto quanto as quentes.

Pense em uma página de vendas em que as manchas quentes cobrem o texto e contornam uma imagem grande no meio da tela. Imagem existe para atrair o olhar. Quando ninguém olha para ela, há dois motivos prováveis:

  • a imagem é pouco atraente ou tem pouca relação com o assunto da página;
  • falta legenda. Quem olha uma foto tende a ler a linha logo abaixo dela, e esse espaço ficou vazio.

Em uma página pensada para conversão, cada imagem cumpre três tarefas:

  • atrair a atenção para o trecho certo;
  • carregar uma legenda que funcione como chamada para ação;
  • reforçar a ideia principal que o visitante precisa guardar.

Para o dono do negócio, essa leitura ajuda a ajustar a oferta às preferências do público. Para quem escreve e desenha a página, indica o que merece mais destaque visual. Nos dois casos, o mapa é uma das etapas de um trabalho maior, o de aumentar as vendas pelo site.

Como interpretar um mapa de calor na prática?

Comece por uma pergunta: a atividade está concentrada na mensagem principal e no botão de ação? Se estiver, a página conduz bem. Um mapa coberto por uma névoa de rastros espalhados indica visitante perdido, que ainda procura o que fazer ali. Nesse cenário, a taxa de conversão cai. Os cinco cuidados abaixo ajudam na leitura.

Use pistas visuais que apontam para o botão

Imagens distraem com facilidade, e isso pode trabalhar a seu favor. O exemplo clássico é a foto de uma pessoa cujo olhar aponta para o botão de ação (CTA, de call to action): quem vê a foto acompanha o olhar e chega ao botão. O erro comum vai na direção contrária. Imagens e elementos de design apontam para todos os lados, e o visitante fica sobrecarregado antes de completar qualquer tarefa. Veja também como escrever e posicionar o botão de ação.

Descubra as palavras que o público considera importantes

Antes de refazer a página inteira, observe onde o calor se concentra. Quais palavras e frases o público trata como centrais? Elas podem ser diferentes das que você planejou. Quando combinam com a sua mensagem, dê a elas mais destaque. Quando apontam para outro assunto, revise o texto: é provável que o visitante esteja entendendo outra coisa.

Leia a rolagem para decidir o que sobe

Rolagem intensa até o fim da página indica busca por uma informação que o visitante ainda não encontrou. A saída é abrir espaço na primeira dobra, a parte visível antes de rolar: retire dali um elemento que recebe pouca atenção e coloque a informação procurada.

O caminho inverso também funciona. Pouca atividade no topo e muita em torno de uma imagem lá embaixo é sinal para subir essa imagem.

Compare os visitantes por origem

Algumas ferramentas separam os cliques conforme a origem da visita. Com isso você descobre quais imagens, botões e palavras funcionam com o público que mais compra. No Microsoft Clarity, os filtros do grupo Tráfego (fonte, meio, campanha e canal) se aplicam também aos mapas de calor. Um bom primeiro teste é comparar o mapa de cliques de quem chegou pela busca orgânica com o de quem chegou por um anúncio. Depois, leve o que funciona para posições de mais destaque na página.

Observe o entorno das manchas quentes

O cursor raramente fica em cima da palavra lida. Como o dedo na página de um livro, ele para ao lado ou logo abaixo. Quando uma mancha quente cobrir um grupo de palavras, olhe em volta: o trecho que chama atenção pode ser o vizinho.

Todo mapa de calor pede interpretação, inclusive os das melhores ferramentas. Ele aponta a direção e sugere o que fazer, e a decisão continua com você. A confirmação vem do teste: mude um elemento, compare os números e mantenha o que melhorou. Veja como rodar um teste A/B. A boa notícia é que trocar uma imagem ou um bloco de texto costuma ser rápido nos editores de arrastar e soltar, que dispensam programa de edição de imagem.

Em que situação o mapa de calor é a escolha certa?

O mapa de calor funciona melhor em páginas que já recebem um bom volume de visitas. Com pouco tráfego, a amostra pode não representar o comportamento que o site terá quando os acessos crescerem.

Para sites com poucas visitas, existem ferramentas que estimam a atenção por algoritmo, antes de qualquer visitante chegar, como Feng-GUI e EyeQuant. Elas servem para avaliar o layout e as imagens da página.

Quando passar para a gravação de sessão?

Passe para a gravação de sessão quando precisar ver exatamente o que cada pessoa fez durante a visita. O mapa de calor resume muitos visitantes em uma imagem. A gravação mostra um por vez: o caminho pelo site, o preenchimento do formulário, o momento em que o carrinho ficou para trás.

Duas ferramentas da lista mais abaixo gravam sessões: o Microsoft Clarity, sem custo, e a Contentsquare (que hoje reúne o Hotjar), com plano gratuito e planos pagos.

No Clarity, escolha o que assistir primeiro. Na tela Gravações, abra os Filtros. Dentro de Ações do usuário, selecione cliques contínuos (rage clicks) ou cliques inativos (dead clicks). Em Caminho, informe o endereço da página que você quer estudar. A lista passa a trazer as sessões em que alguém travou.

Tela de filtros do Microsoft Clarity com o grupo Ações do usuário aberto, mostrando as opções cliques contínuos, cliques inativos, rolagem excessiva e retornos rápidos
Grupo Ações do usuário nos filtros da demonstração pública do Microsoft Clarity. Em português, a interface chama o rage click de cliques contínuos e o dead click de cliques inativos (tela capturada em outubro de 2026).

Se o seu formulário recebe muitos preenchimentos pela metade, as gravações costumam mostrar o campo em que as pessoas desistem. O assunto continua no guia sobre como reduzir o abandono de formulário.

Quais ferramentas de mapa de calor usar?

Cinco ferramentas cobrem a maior parte das necessidades, da opção gratuita para começar às mais específicas. A lista foi revista em outubro de 2026, porque algumas ferramentas mudaram de dono ou deixaram de aceitar contas novas.

FerramentaCustoDestaque
Microsoft ClarityGratuitoCinco tipos de mapa, gravação de sessão e integração com o GA4
Contentsquare (reúne o Hotjar)Plano gratuito com limites e planos pagosPesquisas de feedback na própria página
MouseflowPlano gratuito de 500 sessões por mêsAcompanha o visitante de uma página para outra
SessionCam (Glassbox)Plataforma para empresas maioresGravação de sessão e análise de formulários
Crazy EggPago, com teste grátisColore os cliques conforme a origem do visitante

Microsoft Clarity

É a primeira opção para quem está começando. Segundo o FAQ oficial, o Microsoft Clarity é gratuito para sempre e não limita o tráfego. Entrega mapas de cliques, rolagem, área, atenção e conversão, além de gravações de sessão e integração com o GA4.

A instalação começa com a criação de um projeto em clarity.microsoft.com. Em seguida, abra Settings e Setup. Existe integração pronta para WordPress, Shopify, Wix e outras plataformas. Outra forma é colar o código no <head> do site ou usar o Google Tag Manager. Os dados começam a aparecer logo depois da instalação, segundo a documentação oficial (consultada em 9 de outubro de 2026).

Contentsquare, que reúne o Hotjar

É a opção mais completa da lista. O Hotjar pertence à Contentsquare desde 2021 e deixou de aceitar contas novas: quem começa hoje faz o cadastro na página do Hotjar dentro da Contentsquare. A história dessa mudança está no post sobre o que usar no lugar do Hotjar.

O diferencial são as pesquisas de feedback dentro da página. Quando o comportamento dos visitantes parecer inexplicável, você pergunta o motivo a eles. Esse recurso fica fora do Clarity.

Existe plano gratuito com mapas de calor, gravações, funis e pesquisas, dentro de limites mensais de sessões e de respostas. A análise de jornada faz parte dos planos pagos (página de preços consultada em 9 de outubro de 2026).

Mouseflow

O Mouseflow registra cliques, toques, movimento e rolagem, permite escolher o período analisado e funciona com layouts para celular. Ele também segue o visitante de uma página para outra. Assim você enxerga o caminho de quem converteu e o ponto em que os demais saíram. O plano gratuito cobre 500 sessões por mês, segundo a página de preços (consultada em 9 de outubro de 2026).

SessionCam, da Glassbox

A SessionCam grava sessões de visitantes, o que ajuda a investigar problemas de conversão. Funciona como acompanhar a tela de quem navega, com os dados em formato anônimo. Também oferece mapas de calor, análise de formulários e caminhos de conversão. Hoje pertence à Glassbox, plataforma voltada a empresas maiores.

Crazy Egg

O Crazy Egg reúne mapa de calor, mapa de rolagem e rastreamento de cliques. O recurso mais conhecido pinta cada clique com uma cor conforme a origem do visitante (site de referência ou termo de pesquisa), o que facilita a segmentação. É uma ferramenta paga, com teste grátis, segundo a página de preços (consultada em 9 de outubro de 2026).

Perguntas frequentes

Mapa de calor funciona em site com poucas visitas?

Funciona, com cautela na leitura. Com pouco tráfego, o mapa pode não representar o comportamento que o site terá quando os acessos crescerem. Nesse caso, ferramentas que estimam a atenção por algoritmo, como Feng-GUI e EyeQuant, ajudam a avaliar o layout e as imagens, e as gravações de sessão mostram o que cada visitante fez.

Existe ferramenta de mapa de calor gratuita?

Sim. O Microsoft Clarity é gratuito e não limita o tráfego, segundo o FAQ oficial. Ele inclui mapas de cliques, rolagem, área, atenção e conversão, além de gravações de sessão. A Contentsquare e o Mouseflow também têm planos gratuitos, com limites mensais de uso (páginas de preços consultadas em 9 de outubro de 2026).

Qual é a diferença entre mapa de calor e gravação de sessão?

O mapa de calor soma o comportamento de muitos visitantes em uma imagem da página e mostra onde a atividade se concentra. A gravação de sessão reproduz a visita de uma pessoa, do começo ao fim. O mapa indica em que ponto está o problema. A gravação ajuda a entender o motivo, como um campo de formulário que trava.

O que significa uma área vermelha no mapa de calor?

Vermelho marca as áreas de maior atividade: mais cliques, mais tempo de atenção ou mais passagem do cursor, conforme o tipo de mapa. O ideal é que essas áreas coincidam com a mensagem principal e com o botão de ação. Calor espalhado pela página inteira costuma indicar um visitante confuso.

Otimização de conversão guiada pelo que os visitantes fazem

A Fysi Lab Digital faz otimização de conversão com mapa de calor, gravação de sessão, hipóteses e teste A/B, em sites, landing pages e lojas virtuais. O atendimento é online, para todo o Brasil. Conheça os projetos entregues no portfólio.

Continue lendo

Ver todos os posts

Quero contratar

O que você precisa?