Definición:
Un mapa de calor o heatmap es una visualización que representa valores mediante colores sobre una matriz, una imagen o una interfaz. En una página web, suele agregar interacciones de varias sesiones para mostrar dónde se producen clics o toques, hasta dónde se desplazan los usuarios o qué zonas registran mayor actividad.
Los colores expresan una escala definida por la herramienta: una zona «caliente» normalmente contiene un valor más alto que una zona «fría». El mapa no explica por sí solo la intención del usuario ni demuestra que un elemento haya causado una conversión. Para interpretarlo es necesario conocer la métrica, el periodo, la muestra y el segmento representados.
Índice de contenidos
Cómo funciona un mapa de calor
La herramienta registra eventos o mediciones y los agrupa por posición, elemento o sección. Después normaliza los valores y aplica una escala cromática sobre una captura o una representación de la página. Un mapa puede basarse en coordenadas absolutas, en elementos del documento o en zonas definidas por la plataforma.
La leyenda es imprescindible porque el color no tiene un significado universal. En un mapa de clics puede representar el número o la proporción de interacciones; en uno de desplazamiento, el porcentaje de sesiones que alcanzó cada altura; y en una matriz de datos, la magnitud de cualquier variable. Algunas herramientas utilizan colores cálidos para valores altos y fríos para valores bajos, pero pueden emplear otras paletas.
En sitios adaptables, una misma página cambia según el dispositivo y el tamaño de la pantalla. Por eso los datos de escritorio, tableta y móvil deben separarse o alinearse con la versión correcta de la interfaz. Los menús desplegables, ventanas emergentes, contenido dinámico y cambios de diseño también pueden alterar la correspondencia entre las interacciones registradas y la captura utilizada.
Tipos de mapas de calor en una web
Cada tipo responde a una pregunta distinta y no todos miden atención visual:
- Mapa de clics o clickmap: Agrupa los clics del ratón y, en dispositivos táctiles, las pulsaciones. Permite detectar elementos muy utilizados, controles ignorados o zonas no interactivas que los usuarios intentan activar.
- Mapa de desplazamiento o scrollmap: Muestra qué proporción de sesiones alcanza cada tramo vertical. Ayuda a comprobar la exposición potencial de un contenido, pero llegar a una zona no significa haberla leído.
- Mapa de movimiento: Representa el recorrido del cursor en escritorio. Puede aportar indicios sobre la exploración de una página, aunque el puntero no reproduce de forma exacta la mirada.
- Mapa de atención o permanencia: Estima cuánto tiempo permanece visible una zona o combina señales de actividad. Su definición depende de la herramienta y no equivale necesariamente a concentración cognitiva.
- Mapa por elementos o áreas: Asocia interacciones a botones, enlaces, imágenes o bloques concretos. Resulta más resistente a diferencias de resolución que un mapa basado únicamente en coordenadas.
Los mapas también se utilizan fuera de la analítica web para representar correlaciones, valores geográficos, actividad deportiva o resultados científicos. En esos casos, las filas, columnas o áreas y su escala deben definirse expresamente.
Diferencia entre mapa de calor y eyetracking
Un mapa de calor describe una forma de visualización, mientras que el eyetracking describe una técnica de medición de la mirada. Un estudio de seguimiento ocular puede generar un mapa con fijaciones o recorridos visuales, pero la mayoría de los heatmaps web se construye con clics, toques, desplazamiento o movimiento del cursor.
No debe presentarse un mapa de cursor como si mostrara los puntos exactos que miraron los usuarios. Tampoco conviene aplicar como regla universal un patrón visual observado en un estudio concreto. El dispositivo, la tarea, el diseño, el contenido y las características de la muestra pueden cambiar el comportamiento.
El eyetracking suele requerir participantes y equipos o cámaras preparados para el estudio. Los mapas basados en eventos web agregan sesiones reales instrumentadas mediante un script. Ambos enfoques pueden complementarse, pero tienen fuentes de datos, sesgos y niveles de precisión diferentes.
Para qué sirve y cómo se interpreta
En analítica web, UX y CRO, un mapa de calor puede ayudar a localizar preguntas que después deben investigarse. Entre sus usos habituales se encuentran:
- Comprobar si los controles principales reciben interacciones.
- Detectar clics sobre textos o imágenes que parecen enlaces, pero no lo son.
- Observar qué proporción de usuarios alcanza una llamada a la acción o una sección situada tras varios tramos de scroll.
- Comparar patrones entre móvil y escritorio, fuentes de tráfico o tipos de página.
- Priorizar revisiones de navegación, formularios, jerarquía visual y contenido.
La lectura debe partir de una pregunta concreta y de un segmento coherente. Una zona con muchos clics no es necesariamente positiva y una zona fría no es necesariamente un problema: el resultado depende de la función del elemento. Un enlace secundario puede distraer, mientras que un texto informativo puede cumplir su objetivo sin recibir ninguna interacción.
Conviene contrastar los patrones con métricas cuantitativas, grabaciones de sesiones cuando sean apropiadas, investigación cualitativa y el contexto de la página. El mapa permite formular una hipótesis; una prueba A/B u otro método de evaluación puede comprobar si el cambio propuesto mejora el resultado. El artículo sobre mapas de calor en analítica web desarrolla su aplicación práctica.
Limitaciones y buenas prácticas
Los mapas agregados pueden ocultar comportamientos opuestos entre segmentos. Además, una muestra pequeña, un periodo atípico, cambios de plantilla o errores de instrumentación pueden producir una imagen engañosa. Antes de decidir, hay que revisar el volumen de datos, las fechas, los filtros, el dispositivo y la versión de la página.
El color debe acompañarse de una leyenda, valores o patrones comprensibles. Las paletas arcoíris pueden crear límites visuales que no existen en los datos y dificultar la lectura a algunas personas. Cuando la visualización se comparte, no debería depender exclusivamente del color para comunicar información importante.
La captura de interacciones también requiere controles de privacidad y seguridad. La configuración debe excluir o enmascarar campos, datos personales y contenido sensible, además de respetar la base jurídica, el consentimiento y las reglas aplicables al sitio. Una herramienta no debe registrar indiscriminadamente todo lo que una persona introduce en una página.
Plataformas como Microsoft Clarity, Contentsquare, Crazy Egg, Mouseflow o VWO ofrecen funciones relacionadas, pero sus definiciones, muestreo y tipos de mapa cambian. La elección debe basarse en la pregunta de análisis, la compatibilidad técnica, la segmentación, los controles de privacidad y la capacidad de validar los hallazgos, no solo en la apariencia de la visualización.