Mapas de calor: qué son y cómo pueden mejorar tu sitio web

Cualquier sitio web que busque monetizar su tráfico sabe que su principal reto es conseguir retener el interés en sus usuarios.

Aún siendo este aspecto una de las principales preocupaciones, son muchos los sitios web que prefieren experimentar “a lo loco” en base a corazonadas propias o inspirados por cualquier artículo que encuentren por Internet. Esto es un gran error ya que, en realidad, realizar modificaciones aleatorias y sin base alguna en tu sitio es la mejor forma para:

• Disminuir la tasa de conversión.
• Perder ventas
• Perder usuarios.

¿Qué es un mapa de calor?

Los mapas de calor o heatmaps son representaciones visuales de la atención de los usuarios y su interacción en una página web mientras navegan por ella.

Como verás en la siguiente imagen, puedes analizar estos mapas en busca de las zonas resaltadas que indican una mayor atención o interacción con ese elemento en concreto que se encuentra resaltado.

Los colores más cálidos indican áreas en las que los usuarios prestan más atención, mientras que los colores más fríos son, a menudo, pasados por alto.

Al analizar el comportamiento de tus usuarios en páginas específicas, puedes realizar cambios para aumentar la tasa de conversión. Deja que sean tus propios usuarios los que determinen las áreas que debes mejorar en tu sitio web.

Una vez que tengas identificadas las áreas de mejora, crea variaciones y comprueba su rendimiento usando el A/B testing.

¿Por qué usar mapas de calor?

Los mapas de calor son extremadamente útiles. Sirven para medir la atención y la interacción de los usuarios de un sitio web. Estos son algunas de las razones principales por las que deberías usarlos:

• Para medir el engagement: ¿Escribes artículos y nunca sabes en que punto abandonan la lectura tus usuarios? Al usar un mapa de calor, podrás observar el scroll que hacen tus usuarios en la página, es decir, hasta que punto leen tu artículo y las interacciones que se producen en él. Si, tras este análisis, descubres que solo un pequeño porcentaje de los lectores alcanza el final del texto, quizás deberías considerar cambiar la estructura del mismo y mover la posición de tu CTA final.
• Para ver las acciones realizadas en la página: ¿Dónde hacen clic tus usuarios? ¿Están haciendo clic donde quieres? Con los mapas de calor, podrás ver si tus usuarios están haciendo clic en los elementos más importantes y descubrir en qué puntos pueden estar bloqueándose.
• Para medir la atención: ¿Qué titulares atraen más? ¿Cuáles son las imágenes más efectivas? ¿Qué elementos distraen más del contenido principal? ¿Son visibles los formularios? Una vez que obtengas las respuestas a estas preguntas, podrás empezar a realizar cambios que sirvan para aumentar tu tasa de conversión.

Ahora que ya estás más familiarizado con el concepto de los mapas de calor, quizás te estés preguntando si existe más de un tipo de mapas de calor y lo cierto es que sí.

Tipos de mapas de calor

La mayoría de las soluciones te permiten generar mapas de calor que muestran la interacción de los usuarios desde distintos puntos de vista. Lo ideal es hacer uso de todos ellos para obtener una vista lo más completa posible del comportamiento de tus usuarios.

Mapa de clics o Click Heat Map

Este tipo de mapa te permite cuantificar acciones. Consiste en una representación gráfica de todos los clics de tus usuarios en tu página. Estos mapas proporcionan datos muy valiosos ya que te permiten ver exactamente con qué interactúan tus usuarios en tu sitio web.

Cada vez que alguien hace clic en algún elemento de la página, el mapa lo muestra con un punto de un determinado color. Si observas muchas áreas con colores intensos, esto indica que son elementos con una alta tasa de clics.

Podrás identificar muy rápidamente los puntos calientes de tus páginas y comprobar si tus usuarios hacen clic donde tú quieres que lo hagan. En la imagen, podemos ver cómo las funciones “Share” y “Image sharer” son las menos populares de todas.

Scroll-Map o mapa de scroll.

Los mapas de scroll te permiten conocer la cantidad de página que visualizan tus usuarios y especialmente aquellos elementos que atraen su atención. De esta forma podrás determinar si ven las partes importantes de tu página o se distraen por el camino con elementos poco relevantes.

Si observamos la imagen anterior que muestra un mapa de scroll de una página que trata sobre SEO, podemos ver que la imagen y las dos primeras líneas son los elementos más populares, ya que el 85% de los usuarios les prestan atención.

Porcentaje de clics

Estos tipos de mapas complementan a los mapas de calor clásicos. Te permiten ver los clics generados por cada imagen o CTA de forma individual proporcionándote una información extremadamente valiosa.

Con ellos, puedes:

• Entender la importancia de cala elemento para tus usuarios.
• Evitar que tus usuarios hagan clic en elementos sin enlaces.

Mapa de calor Confetti

Aunque este tipo de mapa parezca igual a un mapa de calor clásico, con este tipo de mapas puedes ver cada clic individual en una página, en lugar de una representación que muestra la densidad de clics como es el caso en los mapas de calor tradicionales. Los mapas confeti te permiten ver si tus usuarios están haciendo clics en elementos que no cuentan con enlaces para poder solucionarlo lo antes posible.

Ya conoces los distintos tipos de mapas de calor que existen, pero, quizás hayas oído hablar de una tecnología similar llamada eye-tracking.

Diferencia entre mapas de calor y eye-tracking

Si los mapas de calor se basan en realizar el seguimiento de los movimientos y acciones del ratón, el eye-tracking analiza exactamente dónde miran los usuarios con sus ojos.

El objetivo del eye-tracking es el de conocer exactamente qué elementos miran tus usuarios dentro de una página y analizar a qué elementos les prestan más atención.

Al igual que con los mapas de calor, los resultados de este tipo de análisis se muestran en forma de mapa de calor mostrando con colores más cálidos las zonas donde los usuarios prestan más atención.

Si bien es cierto que esta es una tecnología muy útil,  requiere de un equipamiento especializado que no está al alcance de la mayoría. Además, para poder llevar a cabo este análisis es necesario contar con un grupo de personas que físicamente realicen la prueba en un laboratorio.

Si estás interesado en el eye-tracking, existen soluciones basadas en inteligencia artificial como Feng-Gui o EyeQuant que te permiten simular estas pruebas con la ayuda de algoritmos avanzados.

Principales funcionalidades de los  mapas de calor

Al analizar un proveedor de mapas de calor, ten en cuenta los siguientes aspectos:

• Segmentación por comportamiento: La herramienta de mapas de calor debería permitirte crear mapas de calor específicos para ciertas audiencias en base a criterios de segmentación como usuarios que han convertido, nuevos usuarios, usuarios recurrentes, usuarios provenientes de campañas de pago, etc.
• Comparación de mapas: Deberías ser capaz de comparar fácilmente de forma visual los resultados de distintos mapas provenientes de segmentos de usuario distintos.
• Organización por tipo de página: Contar con un mapa de calor específico para cada página puede ser complicado si nos estamos centrando en páginas de producto, por ejemplo y cuentas con cientos o miles de ellas. Deberías ser capaz de combinar resultados de todas las páginas de un mismo tipo.
• Mapas de calor responsive: La herramienta de mapas de calor debe ser capaz de obtener datos de usuarios sin importar el dispositivo desde el que accedan a la página web. Por tanto, esta debe ser capaz de reconocer tanto los clics y movimientos del ratón como los gestos y toques desde el móvil. En la fase de análisis, deberías ser capaz, también, de poder distinguir entre sesiones por tipo de dispositivo para que puedas interpretar los datos correctamente.
• Mapas exportables: La posibilidad de exportar tus mapas de calor es una característica muy recomendable ya que te permitirá compartir tus mapas con otros compañeros o crear un archivo privado con todos los mapas que vayas obteniendo a lo largo del tiempo.
• Mapas de calor dinámicos: La herramienta debería ser capaz de identificar cuando se hace clic en un elemento dinámico como un menú desplegable, carruseles o elementos diseñados con AJAX, React.js o Angular.js.
• Mapa de calor retroactivo: ¿Has cambiado el diseño de tu sitio web después de configurar un mapa de calor? La herramienta debería ser lo suficientemente inteligente como para conservar los datos del diseño anterior y mostrar nuevos resultados para el nuevo diseño y no sobre imponer los datos antiguos sobre el nuevo diseño ya que los resultados no tendrían ningún sentido.

Aumenta tu tasa de conversión: combina los mapas de calor con el A/B testing

Imaginemos que has usado un mapa de calor para comprender el comportamiento de tus usuarios y cómo estos interactúan con tu marca. A raíz de esto, has identificado algunos puntos fuertes y débiles en tu sitio web y te gustaría mejorar aquellos que necesitan ser optimizados.

La idea es crear distintas versiones de tus páginas, anuncios, landing pages, etc. para comparar el rendimiento de cada una de ellas.

Al combinar los mapas de calor con el A/B testing estarás realizando una estrategia de optimización bastante completa:

• Identificas problemas gracias a los mapas de calor.
• Pruebas las posibles soluciones gracias al A/B testing.
• Eliges la opción que mejor funcione.

En la siguiente imagen, podrás ver un cómo un mapa de calor revela que la atención e interacción de los usuarios está muy repartida entre varios elementos que compiten entre sí. Al dividir la atención de los usuarios en distintos elementos se consigue un descenso de la tasa de conversión.

Con la ayuda del A/B testing, la empresa realizó algunos cambios en su página principal para enfocar la atención del usuario en una llamada a la acción en concreto.  Después de esto, realizaron un segundo mapa de calor para para comprobar la validez de los cambios.

Con las nuevas modificaciones, la atención de los usuarios pasó a centrarse en el número de teléfono y la llamada a la acción y, por tanto, se produjo un aumento en las conversiones.

Resumen

[gdrts_stars_rating_auto]