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.
Karine Sackt · Designer de landing pages e fundadora da Fysi Lab Digital
· Atualizado em · 11 min de leitura

Neste artigo
- O que é mapa de calor e quais são os tipos?
- O que o mapa de calor revela sobre a sua página?
- Como interpretar um mapa de calor na prática?
- Em que situação o mapa de calor é a escolha certa?
- Quais ferramentas de mapa de calor usar?
- Perguntas frequentes
- 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.

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.
| Ferramenta | Custo | Destaque |
|---|---|---|
| Microsoft Clarity | Gratuito | Cinco 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 pagos | Pesquisas de feedback na própria página |
| Mouseflow | Plano gratuito de 500 sessões por mês | Acompanha o visitante de uma página para outra |
| SessionCam (Glassbox) | Plataforma para empresas maiores | Gravação de sessão e análise de formulários |
| Crazy Egg | Pago, com teste grátis | Colore 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.















