Heatmap
Un heatmap (mapa de calor) es una herramienta de visualización de datos que usa gradientes de color para representar el comportamiento del usuario en una página web, mostrando dónde hacen clic los visitantes, hasta dónde se desplazan, por dónde mueven el cursor y qué elementos atraen más o menos la atención
Updated on June 25, 2026
En el e-commerce, los heatmaps son una de las herramientas de investigación cualitativa más accesibles y accionables disponibles. Traducen la pregunta abstracta de "qué están haciendo los usuarios en esta página" en una respuesta visual que cualquiera (desarrollador, diseñador o marketer) puede interpretar y aprovechar sin necesidad de experiencia estadística.
Tipos de heatmaps
Los mapas de clics muestran dónde hacen clic los usuarios en una página: cada toque y cada clic se registra y se agrega a través de miles de sesiones en una superposición codificada por colores. Los mapas de clics revelan qué elementos reciben interacción, cuáles se ignoran y, algo crítico, cuáles elementos no clicables están recibiendo clics, lo que indica que los usuarios esperan una interactividad que no existe. Que una imagen de producto reciba clics repetidos sin que ocurra ninguna acción te dice que los usuarios esperan una función de zoom o un lightbox que no está ahí.
Los mapas de desplazamiento muestran hasta qué punto de la página se desplazan los usuarios antes de irse. El gradiente de color va de cálido en la parte superior a frío hacia la inferior, revelando el punto en el que la mayoría de los visitantes deja de desplazarse y, por tanto, el contenido por debajo del cual la mayoría de los visitantes nunca llega a ver. Un mapa de desplazamiento que muestra que el 80% de los visitantes se va antes de llegar al botón de añadir al carrito en una página de producto es un hallazgo crítico para la conversión que las grabaciones de sesión y la analítica por sí solas no revelarían con tanta claridad.
Los mapas de movimiento (o mapas de hover) rastrean el movimiento del cursor por la página en dispositivos de escritorio. La investigación sugiere que la posición del cursor está vagamente correlacionada con la mirada: allí donde el cursor se detiene tiende a aproximarse a dónde está enfocada la atención. Los mapas de movimiento revelan qué secciones de una página captan la atención y cuáles se pasan por alto, ofreciendo un sustituto del comportamiento de lectura que no requiere hardware de seguimiento ocular.
Los mapas de rage clicks son una variante especializada que resalta las zonas donde los usuarios hacen clic repetidamente en sucesión rápida, una señal conductual de frustración. Un rage click suele ocurrir cuando un usuario espera que un elemento responda y no lo hace: un botón que parece interactivo pero no lo es, un enlace que no funciona, un formulario que no se envía. Los datos de rage clicks identifican fallos de UX que generan frustración en el usuario antes de que esa frustración se manifieste como abandono.
Los mapas de atención combinan datos de clic, movimiento y desplazamiento en una única vista compuesta que estima la distribución general de la atención a lo largo de una página, ofreciendo una imagen holística de dónde se concentra la interacción y dónde está ausente.
¿Qué revelan los heatmaps en el e-commerce?
Efectividad de la zona above-the-fold. Los mapas de desplazamiento revelan cuántos visitantes interactúan con el contenido por debajo del viewport inicial. Si un elemento de conversión crítico (el botón de añadir al carrito, la propuesta de valor principal, la señal de confianza clave) queda por debajo del umbral de desplazamiento para la mayoría de los visitantes, el diseño de la página necesita reestructurarse para mostrar esos elementos antes.
Rendimiento de la navegación y los CTA. Los mapas de clics muestran si los CTA principales reciben los clics que el diseño pretendía y si elementos secundarios o inesperados reciben clics que sugieren una intención de usuario distinta a la que la página fue diseñada para atender.
Interacción con las imágenes de producto. En las páginas de producto, los mapas de clics y de movimiento revelan qué imágenes atraen más la atención, si los usuarios intentan hacer zoom o interactuar con las imágenes de formas que la implementación actual no admite, y si la estructura de la galería de imágenes coincide con cómo los usuarios quieren consumir la información visual del producto.
Identificación de fricción en formularios. En las páginas de checkout y registro, los mapas de clics combinados con las grabaciones de sesión revelan dónde dudan los usuarios, qué campos del formulario generan interacciones repetidas que sugieren confusión y dónde abandonan los usuarios antes de completar el formulario.
Visibilidad de las señales de confianza. Los mapas de movimiento y de desplazamiento revelan si los sellos de seguridad, la información de la política de devoluciones y las reseñas de clientes están siendo vistos realmente por los usuarios o si están ubicados tan abajo en la página o tan lejos del punto de decisión de compra que no aportan ningún beneficio práctico de conversión.
Diferencias de comportamiento entre móvil y escritorio. Los heatmaps separados para el tráfico móvil y de escritorio revelan de forma consistente patrones de interacción muy distintos: el contenido que funciona bien en escritorio puede ignorarse por completo en móvil debido a diferencias de diseño, limitaciones de alcance del pulgar o variaciones de renderizado.
Heatmaps vs. analítica
Los heatmaps y la analítica web son herramientas complementarias que responden a preguntas distintas:
La analítica web (Google Analytics 4, paneles de la plataforma) te dice qué está ocurriendo a nivel cuantitativo: cuántos usuarios, qué páginas, qué tasas de conversión, dónde cae el tráfico. Identifica que existe un problema y dónde se ubica dentro del embudo.
Los heatmaps te dicen por qué está ocurriendo a nivel cualitativo: qué están haciendo los usuarios en la página, dónde se confunden, qué elementos impulsan o no logran impulsar la interacción. Diagnostican la causa del problema que la analítica identificó.
El proceso de CRO más efectivo usa ambos: la analítica para identificar qué páginas tienen problemas de conversión que vale la pena investigar, y los heatmaps para diagnosticar los patrones de comportamiento específicos que causan esos problemas antes de diseñar y probar soluciones.
¿Listo para construir una marca de millones de dólares?
.avif)


.avif)