Mapas de calor web, mejora el rendimiento y la conversión de tu site

Cómo mejorar tu web gracias a los Mapas de calor

Conocer cómo se comporta el usuario al llegar a nuestra página web resulta de vital importancia para descifrar qué elementos y secciones son las más atractivas dentro del diseño web, cuáles de estos elementos son de menor importancia y qué zonas son las que reciben mayor atención por parte del usuario. Para averiguar todos estos parámetros, el mapa de calor o heatmap es una de las técnicas de analítica web más útiles y efectivas. Gracias a este análisis y monitorización del sitio web conseguiremos conocer cómo trabajar y optimizar nuestra web con el objetivo de mejorar la experiencia de usuario y aumentar el porcentaje de conversiones en ella.

mapa de calor web

¿Qué es un mapa de calor?

Los mapas de calor son aplicaciones con una representación basada en la termografía que nos permiten reconocer los puntos calientes en nuestro sitio. Estos puntos calientes representados por un código de colores son las zonas a las que el usuario dirige su atención. Las acciones que se evalúan dentro del mapa de calor son: dónde se hace clic, por donde pasa el ratón y dónde se hace scroll.

El código de colores utilizado en un mapa de calor no solo muestra aquellas zonas que reciben mayor atención e interacción por parte del usuario, sino también aquellas en la que no se está realizando ninguna acción. Los colores que identifican dicha interacción van desde el rojo, naranja y amarillo, en cambio para las zonas en las que se presta más atención, se usan tonos azulados y verdosos.

Los mapas de calor se basan en la técnica del eye-tracking, una tecnología se utiliza para monitorizar los comportamientos en la visión de los usuarios con el objetivo de intentar detectar qué es lo que le llama la atención y hacia dónde se dirige esta. Como para nosotros es imposible identificar qué es lo que mira nuestro usuario, utilizamos como parámetro la posición y los movimientos del ratón. Cabe destacar que está comprobado que el movimiento del cursor está directamente relacionado con la zona en la que centramos la visión.

Debemos tener en cuenta que para que los heatmaps sean plenamente funcionales necesitan contar con un volumen considerable de visitas en nuestra página. Si el volumen de tráfico web es bajo observaremos muestras muy pequeñas y por consiguiente, los datos obtenidos serán poco concluyentes.

Funcionalidades principales de los mapas de calor

Algunas de las principales características que nos ofrecen los mapas de calor son:

  • Localizar las flaquezas o puntos débiles en el diseño web: una vez realizado el análisis con el mapa de calor este nos mostrará las zonas en las que el cursor pasa más tiempo en una zona determinada de la página. Si resulta que en esta zona no existe ningún elemento importante, sería necesario aprovecharla y utilizarla para intentar conseguir algún objetivo o acción importante gracias a ella.
  • Analizar la interfaz: si el usuario no hace clic dónde debería hacerlo o no dirige su atención hacia aquellos elementos que nosotros consideramos importantes nuestra web no está siendo del todo funcional. Con el mapa de calor podremos analizar estos aspectos para determinar si los elementos que hemos integrado en nuestro diseño cumplen la función que le hemos asignado. Un ejemplo podrían ser los enlaces en los que se puede hacer clic, si estos no están bien diferenciados el usuario no los verá y por lo tanto, no hará clic en ellos.

    mapa de calor

  • Ubicar publicidad: con el mapa de calor además de saber en qué zona es mejor ubicar por ejemplo un banner publicitario, podremos observar hasta dónde llega el usuario haciendo scroll y si el anuncio es visible para él o no. Si resulta que el usuario no llega a la profundidad en la que se encuentra nuestro elemento, podemos reubicarlo y hacerlo de nuevo funcional.
  • Ubicar imágenes y texto: saber hacia dónde mira el usuario nos permitirá conocer la zona en la que queremos situar las imágenes y textos a destacar.

Tipos de mapas de calor

Como hemos comentado antes podemos diferenciar 3 tipos de mapas de calor:

Mapa de calor por clics o Click Heatmap:

Como su nombre indica este mapa de calor identifica aquellas áreas en las que se hace un clic. La información se presenta de manera sencilla y concisa: allí dónde se hace uno o más clics se marca con un color rojo o naranja.

Es interesante observar atentamente dónde se realizan estas acciones, si existe una zona en la que se tiende a hacer clic y no existe ningún elemento en ella como un enlace, banner, o llamada a la acción, entonces la estamos desaprovechando. A través del heatmap podríamos observar también si se clican títulos o palabras que parece que tienen un link pero que en realidad no lo son, en estos casos sería conveniente mostrar dichos elementos de una manera más clara para el usuario.

click heatmap

Mapa de calor por movimiento de ratón o Mouse movement heatmap:

En este mapa se identifican las zonas por las que el usuario mueve el cursor. Se debe tener en cuenta que el mouse puede realizar trayectorias que no necesariamente tengan que ver con el contenido de nuestra web. Esto se debe tener en cuenta en el momento que analizamos nuestros resultados.

La funcionalidad más importante de este tipo de mapa de calor es el registro de actividad del usuario y la manera en la que este navega por nuestro sitio web, lo que resulta ser un factor determinante a la hora de evaluar el modo de conversión.

mouse over heatmap

Mapa de desplazamiento o Scroll Map

Este mapa web nos muestra hasta dónde llega el usuario haciendo scroll, si la profundidad es poca podría significar que el usuario lee hasta la mitad de nuestra web y se marcha debido a una navegación confuso o a un contenido poco relevante. En ese caso, podríamos optar por determinar si nuestro contenido está siendo del todo relevante e incluso valorar situar elementos gráficos importantes hasta dónde llega la vista del usuario para incentivar el que siga haciendo scroll. Las áreas más superficiales se identifican con color rojo y verde, mientras que la más profundas se determinan con color azul.

scroll heatmap

Herramientas disponibles

Existen infinidad de opciones a la hora de elegir mapas de calor web, existen gratuitos y de pago. En este caso nos centraremos en las herramientas que cuentan con plugin para WordPress.

Crazy Egg

Crazy Egg presume en su página de ser “como un par de gafas de rayos X para ver exactamente lo que hace la gente dentro de tu sitio web”. Podríamos decir que es una de las herramientas de pago más conocidas, cuenta con una prueba gratuita de todos sus planes por un periodo de 30 días. Los precios van desde 9$ al mes para la lectura de 10.000 visitantes y 10 páginas activas, a planes en los que se ofrece 100.000 visitas en 50 páginas activas e informes de horario por 49$ al mes.

Además nos ofrecen un cuarto mapa de calor: el de confeti, este mapa nos segmenta y filtra por términos de búsquedas y páginas de referencia, como puede ser un backlink, una publicación en red social o tráfico orgánico. Muy interesante, ¿verdad?.

crazyegg confeti map

Hotspots Analytics

Hotspots se define como el plugin más potente para hacer mapas de calor en WordPress. Además de incluir los mapas de calor nos ofrece un gráfico de la actividad y el comportamiento del usuario en diferentes modelos de pantalla responsive, Tablet, PC o smartphone.

Otra de las funcionalidades interesantes de Crazyegg es que ofrece un mapa de calor para cada página del sitio, de esta manera obtenemos el detalle del comportamiento de los usuarios en cada una de ellas.

hotspot mapacalor captura

ClickTale

ClickTale se nos presenta como una herramienta profesional de pago para el análisis de los patrones de conducta de los usuarios que ingresan a nuestra web. No solo integra funciones como el diseño de mapas de calor, además ofrece el análisis de formularios y la grabación individualizada de comportamiento.

En sus mapas de calor los datos se presentan segmentados con información mucho más detallada. Su enfoque y filosofía es el de favorecer al máximo la conversión, por ello ofrecen la visualización de las zonas en las que se pueden poner elementos para aumentar la monetización.

Para obtener esta herramienta es necesario solicitar una demo desde su página web.

clicktale mapacalor captura

Sumo

Sumo es una multi-herramienta que abarca desde las redes sociales hasta la analítica web. Su objetivo principal es la captación de suscriptores, pero también se encarga de diseñar mapas de calor para observar la actividad de los usuarios.

Como funcionalidad interesante podríamos destacar el feedback en tiempo real para observar los últimos clics de los usuarios.

Su plan gratuito incluye las visitas mensuales limitadas, un sitio web y todas las aplicaciones (incluyendo los mapas de calor) entre otras funcionalidades. Incluye diferentes planes de pago con otras características más avanzadas.

sumo captura

Google Analytics

Aunque lo que hace Google Analytics no es exactamente un mapa de calor, lo incluimos entre estas herramientas por una funcionalidad en concreto: la analítica de página, en la que analiza la cantidad de clics que recibe cada botón o enlace que se encuentre en la web.

Es gratuita y además te ofrece otras utilidades que pueden ser de utilidad para analizar tu página web y hacerla más funcional y atractiva para los usuarios.

Para poder crear este mapa de clics es necesario activar la opción de “Utilizar la atribución de enlace mejorada”, para hacerlo sigue estos sencillos pasos:

  • Accede al Administrador en la parte superior de Google Analytics.
  • Accede a la propiedad para la que quieres usar la atribución de enlace mejorada y haz clic en la pestaña de Configuración de la propiedad.
  • En el apartado Analítica de página, selecciona la opción “Usar atribución de enlace mejorada”.
  • Pulsa Aplicar.
  • Puedes elegir la vista insertada o la vista completa, en la insertada verás el enlace en una nueva pestaña y, en la completa, la verás sobre la interfaz de Analytics.

    inpage analytics

    Entonces ¿Cuál es la mejor herramienta?

    Resulta muy complicado calificar una de estas herramientas como la mejor, cada aplicación contiene unas características determinadas que nos pueden ayudar a medir el comportamiento de los usuarios en nuestra interfaz. Una combinación de dos utilidades podría ser lo ideal, dependiendo de qué aspecto queramos analizar, además por supuesto de tener en cuenta cómo diseñar la home page de nuestra web, la parte más importante de todas. Los datos conseguidos de nuestro análisis serán de vital importancia sobre todo si los cruzamos con otros datos y métricas de analítica web como la tasa de rebote, fuentes del tráfico, flujo de las visitas, etc.

    Como consecuencia de este análisis exhaustivo podremos decir que conocemos al detalle el perfil de nuestro usuario y por lo tanto, sabemos qué ofrecerle y cómo hacerlo de una manera atractiva y funcional.

    ¿Conoces alguna otra herramienta de mapa de calor web que quieres agregar a este listado?

    Si te gustó este artículo o te sirvió de ayuda por favor compártelo
    Un saludo,
    Óscar / DevService
    Por Óscar Carrillo