Utiliza un mapa de calor (o heatmap) para entender al usuario y mejorar las conversiones web

Te proponemos 4 herramientas de mapa de calor que se pueden implementar en cualquier web muy fácilmente.

Los mapas de calor son nuestros chivatos de cabecera. Nos informan de todo lo que hacen los usuarios en nuestra página web y de cómo esta funciona. ¡No os perdáis nada!

¿Qué son?

Los mapas de calor (heatmap, en inglés) son una herramienta que nos permite saber el comportamiento de los usuarios en nuestras página web, así como averiguar cuales son las zonas más atractivas, cuales funcionan mejor y cuáles debemos mejorar.

¿Cómo funcionan?

Los mapas de calor parten de la idea que de manera mecánica e inconsciente movemos el ratón por la pantalla siguiendo el movimiento de los ojos. Con un 88% de coincidencia podemos obtener estos datos para ser analizados. ¡Es sabido que todo entra primero por la vista!

Los datos que se muestran utilizando manchas superpuestas a la imagen de la página web, con una graduación de color azul (frío - menos interacción) a rojo (calor - más interacción), que da como resultado una termografía.

Mapas de calor - heatmap

Foto: Martin Sanchez

El otoño tiñe de manera progresiva las hojas de los árboles. Del verde del buen tiempo al rojo del otoño. Un mapa termográfico de cómo el otoño va impregnando los árboles del bosque.

Hay 3 tipos de mapas:

Los mapas de calor (heatmap, en inglés) son una herramienta que nos permite saber el comportamiento de los usuarios en nuestra página web y averiguar cuáles son las zonas más atractivas, cuáles funcionan mejor y qué debemos mejorar.

  • 1:
    Por movimiento: los que muestra el movimiento a lo largo de la página. Esta tipología de mapa está cada día más cuestionada por la irrupción de las nuevas tecnologías acostumbradas a la era táctil y, por tanto, los usuarios ya no mueven el ratón siguiendo la vista sino que lo utilizan como a elemento táctil para interactuar en la zona que les interesa.
Mapas de calor por movimiento
  • 2:
    Por clic: los que muestran las zonas donde los visitantes interactuan.
Mapas de calor por clic
  • 3:
    Por scroll: los que muestran donde dejamos de hacer scroll en una página larga.
Mapas de calor por scroll

¿Por qué nos es útil esta información?

Para analizar nuestros procesos de conversión y poder detectar, sobre todo en el caso de los comercios en línea, en qué estado del proceso los usuarios abandonan la compra y los motivos. Puede ser que el botón de compra no esté situado en una zona óptima o que haya algún elemento que desvíe la atención del usuario, como podría ser un banner dentro del proceso de compra. Por tanto, también nos sirve para verificar las prácticas de CTAs (Call to Action).

Mapas de calor (heatmap) - Call to action

Foto: Bess Hamiti

La naturaleza también tiene sus formas de atraer la atención. Sus Call to Action particulares. Esta flor, indica claramente dónde tiene su néctar, para que las abejas lo puedan encontrar.

También nos puede servir para tener un feedback con nuestra interfaz. Saber cuáles son los elementos que funcionan, las imágenes o gráficos que resultan más atractivas, qué longitud es óptima para que no dejen la lectura a medias, etc.

Porque tan importante es que encuentren tu página web en los principales buscadores, como el hecho de que una vez entren se queden el máximo tiempo posible.

Dos propuestas de mapas de pago:

Feng-GUI

Mapas de calor (heatmap) -  Feng GUI

Se utiliza, sobre todo, para analizar webs que todavía no son públicas para poder hacer cambios antes de abrirla. Es muy útil para diseñadores web, ya que permite cargar la maqueta de la que será la web y poder corregirla antes de ser publicada.

Es de pago.

Es una herramienta que hace una predicción del mapa de calor de tu web. El algoritmo analiza tu web (o algún elemento en concreto de la misma) y calcula qué elementos llamarán más la atención de los usuarios. Por tanto, no es exactamente un mapa de calor.

www.feng-gui.com

Crazyegg

Mapas de calor (heatmap) -  Crazyegg

Es una de las más famosas.

Permite segmentar a los usuarios dependiendo de la procedencia y analiza el comportamiento en móviles.

Además de los mapas de clics y de scroll tiene un mapa de overlay con la cantidad de clic a cada elemento de la web.

Es de pago.

No puedes iniciar el periodo de prueba sin introducior tus datos de pago.

www.crazyegg.com

Y dos propuestas de mapas gratuitos:

Hotjar

Mapas de calor (heatmap) -  Hotjar

Analiza mapas de clics, de scroll, embudos de conversión, analisis de formularios, petición del feedback y encuestas als usuarios.

Incorpora una novedad: la grabación de comportamientos. Podemos ver en vídeo como un usuario en concreto navega por nuestra web y el movimiento de su ratón.

Fácil de utilizar: la interfaz es visual e intuitiva, con los datos analíticos muy bien estructurados.

Herramiento de pago pero con una versión gratuita hasta 2.000 visitas diarias.

Sólo está en inglés.

En la versión gratuïta los datos sólo se guardan 3 meses.

www.hotjar.com

Yandex Metrika

Mapas de calor (heatmap) - Yandex Metrika

Es gratuita.

Analiza tanto los mapas de clic como los de scroll.

Puedes comparar la actividad de los usuarios en diferentes momentos seleccionando dos periodos de tiempo.

Se puede utilizar desde dispositivos móviles.

La interfaz está en ruso o inglés.

metrica.yandex.com

Además...

Los mapas de calor son muy útiles, pero no nos debemos cerrar puertas. Existen otras herramientas analíticas de porcentajes de rebotes, tiempo de permanencia, salidas, embudos de conversión, etc, que utilizadas conjuntamente con los mapas de calor nos permiten tener una radiografía suficientemente clara y amplia como para saber cómo funciona nuestra página web y así tener margen de maniobra para mejorarla.

Por ejemplo, un complemento para CMS que puede combinarse con las herramientas de zonas de calor son los Tests A/B. Estos tests consisten en mostrar aleatoriamente diferentes elementos diseñados de forma diferente a nuestra página web y analizando las zonas de calor, podremos comprobar cuál de los elementos funciona mejor para implementarlo definitivamente.

Si nos quieres conocer mejor,
¡contáctanos! Y si te gusta, ¡síguenos!