Mapa de calor web: ve exactamente qué hacen tus usuarios en cada página

Índice

Las analíticas tradicionales te dicen cuánta gente visita tu web, de dónde viene y cuánto tiempo se queda. Lo que no te dicen es qué hacen exactamente dentro de cada página. Si llegan a ver la propuesta de valor. Si el botón de contacto recibe clics o es invisible para ellos. Si el formulario lo empiezan a rellenar y lo abandonan a mitad.

Los mapas de calor responden a esas preguntas. Y la diferencia entre tener esa información y no tenerla puede explicar por qué una web tiene visitas pero no contactos.

¿Qué es un mapa de calor web?

Un mapa de calor (heatmap) es una representación visual del comportamiento de los usuarios en una página web. Usa una escala de colores — del azul frío al rojo caliente — para mostrar qué zonas de la página concentran más atención, más clics o más interacción.

En lugar de trabajar con números abstractos en tablas, ves literalmente en qué parte de tu página se concentra la actividad real de tus visitantes. Es la herramienta que convierte el comportamiento de usuario en algo visual y accionable.

Tipos de mapas de calor y qué revela cada uno

No todos los mapas de calor miden lo mismo. Hay cuatro tipos principales, y cada uno responde a preguntas distintas.

Mapa de clics

Muestra dónde hace clic la gente en la página. Es el más directo y el que más sorpresas genera.

Las revelaciones más frecuentes: elementos que parecen botones pero no lo son, en los que los usuarios hacen clic esperando que pase algo que no pasa. Imágenes o textos que el usuario percibe como clicables y generan frustración al no serlo. Y al revés: botones importantes que nadie pulsa porque están mal posicionados, tienen poco contraste o el copy no genera suficiente incentivo.

Cada clic frustrado en un elemento no interactivo es una oportunidad perdida. Convertir ese elemento en un enlace relevante puede cambiar el recorrido completo del usuario.

Mapa de movimiento del ratón (hover)

Registra el movimiento del cursor por la pantalla. Hay una correlación demostrada entre donde mueve el ratón un usuario y donde está mirando. Es útil para entender qué captura la atención visual antes de que haya ningún clic, qué partes del contenido se leen de verdad y cuáles se saltan.

En móvil este tipo no existe — no hay ratón — pero se sustituye por el análisis de zonas táctiles.

Mapa de scroll

Indica hasta qué punto de la página llegan los usuarios antes de irse. Es uno de los más reveladores y más accionables.

El hallazgo más frecuente: el 60-70% de los visitantes abandona antes de llegar a la mitad de la página. Si tu propuesta de valor, tu formulario de contacto o tus testimonios están en la mitad inferior, prácticamente nadie los ve. Subir ese contenido a un scroll más alto es a veces suficiente para doblar la tasa de conversión sin cambiar nada más.

Grabaciones de sesión

Técnicamente no son un mapa de calor, pero van de la mano en todas las herramientas del sector. Son vídeos del recorrido real de cada usuario: ves exactamente cómo navega, dónde se para, dónde hace clic, dónde escribe y en qué momento exacto abandona.

Es la herramienta más directa para entender el comportamiento del usuario porque no es una agregación estadística: es ver a una persona real interactuar con tu web en tiempo real.

¿Qué puede descubrirte un mapa de calor que no sabías?

Los hallazgos más frecuentes que acaban cambiando decisiones de diseño reales:

El visitante no llega a ver los servicios. El mapa de scroll revela que el 65% abandona antes de llegar a la sección de servicios o precios. La solución no es necesariamente hacer la página más corta: puede ser subir el contenido crítico más arriba o añadir un gancho más potente en la primera sección.

Se hace clic en elementos que no son enlaces. El logo de un cliente, una imagen del equipo, un título de sección. El usuario lo percibe como interactivo y hace clic. Cada uno de esos clics sin destino es una señal de que el usuario quería más información sobre ese elemento. La solución es convertirlo en un enlace a la página correcta.

El CTA principal está ignorado. El botón que en teoría es el más importante tiene menos clics que un enlace secundario del menú. Las razones pueden ser varias: está demasiado abajo, el contraste visual no es suficiente, el copy no genera suficiente incentivo o compite con demasiados otros elementos. El mapa de clics te dice el qué; las grabaciones de sesión te ayudan a entender el por qué.

El formulario tiene un punto de abandono específico. Las grabaciones de sesión muestran que la gente empieza a rellenar el formulario pero lo abandona en el campo de «empresa» o «presupuesto estimado» o «teléfono». La solución inmediata: hacer ese campo opcional o eliminarlo.

Los usuarios buscan algo que no encuentran. Si muchos usuarios hacen clic en el menú de navegación en un punto específico de la página, puede ser señal de que no encontraron lo que buscaban en el contenido que estaban leyendo. Es información sobre qué contenido falta o está mal estructurado.

Herramientas para crear mapas de calor en tu web

Microsoft Clarity (gratuita y sin límites)

La opción más accesible del mercado. Completamente gratuita, sin límite de sesiones grabadas, con mapas de clics, scroll y grabaciones incluidas. Se integra en WordPress de forma sencilla mediante un fragmento de código en el <head> o con un plugin dedicado.

Es la herramienta que recomendamos como punto de partida para cualquier pyme porque no tiene coste y ofrece suficiente información para tomar decisiones de optimización significativas.

Además incluye funciones de filtrado útiles: puedes ver sesiones segmentadas por dispositivo (móvil vs escritorio), por fuente de tráfico, por página de entrada o por comportamiento específico (usuarios que llegaron al checkout, usuarios que visitaron la página de precios).

Hotjar

La referencia del sector durante años. Versión gratuita muy limitada (solo 35 sesiones diarias), planes de pago desde 39€/mes. Más completo que Clarity en algunas funciones avanzadas: encuestas integradas, feedback de usuario, funnel de conversión visual.

Para la mayoría de pymes, Clarity es suficiente. Para empresas con tráfico alto que quieren funcionalidades de investigación de usuario más avanzadas, Hotjar justifica el precio.

Lucky Orange

Similar a Hotjar en funcionalidades, con mejor relación calidad-precio. Desde 19$/mes con planes más accesibles para volúmenes medianos de tráfico.

Cómo instalar Microsoft Clarity en WordPress

El proceso completo lleva menos de 10 minutos:

  1. Crea una cuenta en clarity.microsoft.com con tu cuenta de Microsoft o Google
  2. Añade tu sitio web al panel introduciendo la URL
  3. Copia el fragmento de código JavaScript generado
  4. En WordPress, instala el plugin WPCode (Insert Headers and Footers) si no lo tienes
  5. Pega el código de Clarity en la sección «Header» de WPCode y guarda
  6. Verifica en el panel de Clarity que el código está detectado (puede tardar unos minutos)

Con 200-300 sesiones grabadas ya tienes material suficiente para identificar los problemas más evidentes de comportamiento de usuario.

¿Cuántas sesiones necesitas antes de sacar conclusiones?

La respuesta depende de lo que estés buscando y del volumen de tráfico de tu web.

Para detectar problemas evidentes de usabilidad — el botón que nadie ve, el scroll que se detiene antes de tiempo — 50-100 sesiones son suficientes. Los problemas graves se repiten de forma consistente y se identifican rápido.

Para validar hipótesis de optimización más específicas — si cambiar el copy del CTA aumenta la tasa de clic — necesitas más datos y más tiempo para que los cambios de comportamiento sean estadísticamente significativos.

La trampa más frecuente es ver demasiadas grabaciones sin un objetivo concreto. Antes de abrir ninguna sesión, define qué pregunta específica quieres responder. ¿Por qué la gente no convierte en la página de servicios? ¿Dónde exactamente abandona el formulario de contacto? ¿Los usuarios de móvil tienen una experiencia distinta a los de escritorio?

Con esa pregunta en mente, filtra las sesiones relevantes y analiza con foco. Sin foco, las grabaciones son entretenidas pero raramente accionables.

El proceso de optimización con mapas de calor

Los datos solos no mejoran nada. El ciclo que convierte información en resultados:

Observa sin prejuicios. Antes de ver los datos, escribe lo que crees que está pasando en la página. Luego compara con lo que revelan los mapas. La diferencia entre tu expectativa y la realidad es donde están las oportunidades.

Identifica el problema específico. No «la página no convierte bien» sino «el 70% abandona antes de ver el formulario» o «nadie hace clic en el CTA principal aunque está en la primera sección».

Formula una hipótesis accionable. «Si movemos el formulario por encima de los testimonios, más usuarios lo verán y aumentarán los envíos.»

Implementa un cambio a la vez. Si cambias diez elementos simultáneamente, no puedes saber qué funcionó.

Mide el resultado. Dos semanas más de datos para comparar el antes y el después.

Este proceso es la base del CRO (Conversion Rate Optimization). Para complementar el análisis con el contexto de negocio más amplio, los KPIs de marketing digital dan la perspectiva de qué impacto tienen esas mejoras en los resultados reales. Y para entender si el tráfico que llega tiene la intención correcta, Google Search Console es el punto de partida.

En Continue analizamos el comportamiento de usuario como parte del proceso de diseño y optimización de webs. No intuición: datos, hipótesis y cambios medibles.

El mapa de calor en móvil: una lectura completamente distinta

El comportamiento del usuario en móvil es radicalmente diferente al de escritorio. El pulgar alcanza unas zonas fácilmente y otras no. El scroll vertical es más rápido y menos deliberado. La atención es más fragmentada.

Microsoft Clarity genera automáticamente mapas de calor separados por tipo de dispositivo. La diferencia entre el mapa de móvil y el de escritorio suele ser reveladora:

El botón de contacto que en escritorio recibe muchos clics puede estar completamente fuera del alcance cómodo del pulgar en móvil. El menú de navegación que en escritorio se usa poco puede ser el elemento más clicado en móvil porque el usuario no sabe cómo navegar en esa pantalla.

El análisis por dispositivo no es opcional si más del 50% del tráfico llega desde móvil — que en la mayoría de webs empresariales ya es el caso. Un mapa de calor global que mezcla escritorio y móvil puede enmascarar problemas graves en la experiencia móvil que están costando conversiones cada día.

Cuándo hacer un análisis de mapa de calor

No es una tarea que se hace una vez y se archiva. Hay momentos específicos donde el análisis tiene especial valor:

Antes de rediseñar una página. El mapa de calor de la versión actual muestra qué está funcionando y qué no, evitando que el rediseño elimine por error elementos que sí generan valor.

Después de publicar cambios importantes. Si has modificado el CTA, reorganizado la estructura o cambiado el texto principal, los datos post-cambio confirman si la modificación tuvo el efecto esperado.

Cuando la tasa de conversión cae sin razón aparente. Las grabaciones de sesión pueden revelar un bug técnico o un elemento que se ha desplazado y está bloqueando el formulario.

Al lanzar una landing page nueva. Con los primeros 100-200 visitantes ya puedes identificar si la estructura está generando el comportamiento esperado o si hay fricciones que corregir antes de escalar el tráfico.

¿Sigues esperando que algo cambie, o estás listo para continuar?

Solicitar consultoría gratuita →

Comparte este Post: