Comprender cómo actúan los usuarios en cada una de las páginas de nuestro sitio web, es fundamental para poder mejorar la experiencia del usuario, y ofrecerles nuevas y mejores formas de interactuar con nuestros contenidos. Los mapas de calor son claves para conseguirlo.
La UX o experiencia de usuario, se ha convertido en un aspecto fundamental para rentabilizar nuestros activos digitales, como el sitio web de nuestra empresa o negocio.
Por eso, en este artículo queremos hablaros del mapa de calor web, y de cómo éste puede ayudarnos a comprender cómo los usuarios utilizan nuestro sitio, y por tanto a mejorar su usabilidad.
índice de contenido
¿Qué es el mapa de calor web?
El mapa de calor del sitio web es una herramienta de visualización de datos que ayuda a las empresas a comprender el rendimiento de determinadas páginas de su sitio web.
En términos más simples, el mapa de calor del sitio web es una representación gráfica de datos en forma de diagrama o mapa, con diferentes colores que denotan diferentes conjuntos de datos y valores.
Los mapas de calor del sitio web utilizan un esquema de colores de cálido a frío para mostrar el rendimiento de una página web, donde el color más cálido indica la mayor participación de los visitantes y el más frío indica una menor participación.
Por tanto, un mapa de calor web es ideal para averiguar qué sección de una página web tiene la mayor participación de los visitantes, dónde los visitantes hacen más clic, si los visitantes hacen clic en la llamada a la acción o no, si llegan al final de la página, etc.
Los mapas de calor del sitio web recopilan todos los datos sobre cómo se comportan los visitantes en tu página web y te ayudan a tomar decisiones de optimización.
Tipos de mapas de calor de sitios web
Hay 5 tipos principales de mapas de calor de sitios web: mapa de calor, mapa de clics, mapa de desplazamiento, mapa de calor de seguimiento del ratón y mapa de calor de seguimiento ocular.
Mapa de calor
Los mapas de calor permiten recopilar información sobre el comportamiento de los visitantes para que puedas usar esos datos para personalizar tu sitio web.
Representa visualmente el rendimiento de varias páginas de tu sitio web en términos de ofrecer una buena experiencia de usuario y responder a las consultas de tus visitantes.
Mapa de clics
Los mapas de clic indican en qué partes de tu página web se hace clic en menor y mayor cantidad. Además de representar visualmente qué elementos de tu página web son más populares, los mapas de clic también ayudan a identificar las lagunas de navegación en la página.
Con los mapas de clic, puedes realizar un seguimiento de los clics en:
Imágenes
Realiza un seguimiento de los clics en las imágenes de tu página web para ver en cuáles clican más los visitantes. Agrega enlaces relevantes a ellas y colócalas de acuerdo con las expectativas de tus visitantes.
Imagina un escenario en el que, al navegar por tu tienda online, los visitantes hacen cada vez más clic en las imágenes de productos sin hipervínculos esperando ser redirigidos a una página con descripciones de productos, pero en cambio, la imagen no los lleva a ninguna parte porque no está vinculada a ninguna otra página. Esto puede generar confusión y crear fricciones. Con la ayuda del mapa de clics, puedes identificar dichos patrones y realizar cambios respaldados por datos.
Enlaces
Utiliza mapas de clic para identificar dónde esperan los visitantes que se encuentren determinados enlaces, y coloca esos enlaces de acuerdo con las expectativas de tus visitantes.
Por ejemplo, después de configurar el mapa de clics en una de tus páginas y ejecutarlo durante un período de tiempo determinado, descubres que después de navegar por diferentes páginas, para volver a la página de inicio, sus tisitantes en su mayoría hicieron clic en una sección o elemento que no no tiene ningún enlace a la página de inicio. Esto indica que la estructura de tu página no coincide con las expectativas de sus visitantes y es hora de cambiarla.
CTA
Usa clickmaps para ver si los visitantes están haciendo clic en la CTA principal o si se distraen con otros elementos. Identifica todas esas distracciones y coloca tu CTA en la parte más popular de tu página web.
Comprueba la navegabilidad de tu sitio web utilizando mapas de clic y mejora la experiencia del usuario (UX).
Por ejemplo, al hacer clic en el botón ‘continuar’ en la página del carrito, tus visitantes pueden esperar volver a la página exacta del producto en la que estaban antes de agregar un producto al carrito. Pero contrariamente a las expectativas de tus visitantes, el botón ‘continuar’ los lleva al siguiente paso en el proceso de pago.
Esto significa que la navegación de tu sitio web no coincide con las expectativas de tus visitantes y debe modificarse para que coincida con ellas.
Mapa de desplazamiento. Scrollmap
El Scrollmap o mapa de desplazamiento, es una representación visual del comportamiento de desplazamiento de tus visitantes. Indica cuánto se desplazan los usuarios hacia abajo en una página, así como en qué secciones pasan más tiempo.
Además, te indica la cantidad de visitantes que se desplazaron hasta la parte inferior de una página, los visitantes que se desplazaron por el 50% de una página (pero no el 100%), o donde la mayoría de los visitantes abandonaron una página, etc.
Consejo: según el informe de mapa de desplazamiento, coloca los elementos más importantes de la página web en las secciones donde los visitantes pasan la mayor parte del tiempo.
Los mapas de desplazamiento no solo indican datos con varios colores, sino que también reflejan los porcentajes que se dan para que conozcas la cantidad de usuarios que se movieron hacia abajo en tu página web y los que no lo hicieron. Ayudan a identificar el contenido importante que se está ignorando.
Puedes utilizar mapas de desplazamiento para:
- Calcular la longitud ideal de una página web más allá de la cual los visitantes no se desplacen hacia abajo.
- Identificar dónde pasan más tiempo los visitantes y dónde están perdiendo interés.
- Identificar el área más adecuada donde se debe colocar la información o los elementos clave, como las llamadas a la acción.
Mapa de calor de seguimiento del ratón
El mapa de calor de seguimiento del mouse (también conocido como Hover Maps, Attention Maps, Move Maps) indica las áreas sobre las que los visitantes pasan más el cursor.
Puede utilizar mapas de calor de seguimiento del ratón para:
- Identificar las secciones en las que los visitantes pasan más tiempo, para saber dónde poner el contenido más importante.
- Reunir información sobre dónde mira un visitante mientras navega por tu página web mediante el análisis de dónde se detiene el mouse y dónde se desplaza a una velocidad más rápida.
Un hecho interesante es que los visitantes a menudo tienden a desplazarse sobre áreas que les resultan atractivas e interesantes o que están tardando más en comprender porque los mensajes pueden ser confusos o difíciles de entender. Esta es la razón por la que los mapas de calor de seguimiento del mouse pueden ayudar a identificar las áreas en las que los visitantes pasan más y menos tiempo.
Sin embargo, es importante recordar que es posible que lo anterior no siempre sea cierto, especialmente para los sitios de noticias en línea. Esto se debe a algo llamado «aparcadores».
Los aparcadores son visitantes que dejan el cursor en un lugar independientemente de lo que estén leyendo, en qué sección se encuentren o si están consumiendo o no el contenido.
Pasar por alto la posibilidad de que los aparcadores afecten los datos del mapa de calor de seguimiento del mouse a menudo aumenta las posibilidades de contaminación de los datos.
Una forma de salir de esto es segmentar en función del tiempo empleado.
Por ejemplo, supongamos que el artículo de tu sitio de noticias con mayor tráfico tiene un tiempo de lectura de 6 minutos. Dando a los visitantes un búfer adicional de 4 minutos, puedes segmentar a los visitantes para incluir solo aquellos usuarios que pasan menos de 10 minutos en la página. De esta manera, no solo incluyes datos de aquellos visitantes y usuarios que realmente leen el artículo en tu análisis, sino que también eliminas el riesgo de contaminación de datos debido a la presencia de aparcadores.
Mapa de calor de seguimiento ocular
El mapa de calor de seguimiento del ratón, anteriormente explicado, a menudo se confunde con el mapa de calor de seguimiento ocular. Según la duración de la fijación y la frecuencia con la que un visitante mira una imagen, los mapas de calor de seguimiento ocular representan los elementos más atractivos de una página para los visitantes en forma de puntos «calientes» y «fríos» mediante el seguimiento del movimiento de los ojos de un visitante.
Los seres humanos tienden a favorecer la vista sobre cualquier otro sentido y esto es exactamente lo que puede resultar útil para muchas empresas.
Por ejemplo, una tienda de comercio electrónico puede beneficiarse mucho si pueden descubrir qué es lo que más ven los visitantes cuando visitan su sitio web. Saber qué secciones llaman más la atención de un visitante e identificar los elementos que pueden beneficiarse de estar ubicados en las secciones donde la interacción visual es mayor puede ayudar a las empresas a realizar cambios respaldados por datos en su sitio web que coincidan con las expectativas de los visitantes.
Los mapas de calor de seguimiento ocular son especialmente útiles para determinar qué tan atractivas son ciertas imágenes en un sitio web.
Puedes utilizar mapas de calor de seguimiento ocular para:
- Identificar dónde miran más los visitantes en tus páginas para obtener información.
- Identificar si la mirada de los visitantes se distrae con algún elemento (visual o textual) de la página.
- Realizar un seguimiento del patrón de mirada de los visitantes para colocar todo el contenido y las imágenes importantes en las secciones más llamativas de la página.
¿Por qué debería utilizar el mapa de calor del sitio web?
Las herramientas de análisis de usuario tradicionales o cuantitativas solo te dicen cuántos visitantes llegaron a tu página y cuántos convirtieron, pero no responden exactamente qué sucedió durante esos dos pasos, lo que llevó a las acciones resultantes.
Aquí es donde entra en juego la comprensión de la calidad de esas interacciones. Digamos que una tienda de comercio electrónico recibe alrededor de mil visitantes nuevos al día, y alrededor de 20 nuevos clientes compran algo. Para el propietario de la tienda, para comprender por qué los 980 visitantes restantes no se convirtieron, necesitaría conocer todas las diversas razones que los llevaron a dejar la tienda sin realizar ninguna compra.
Las razones pueden ser, no poder encontrar el botón ‘Agregar al carrito’ o no poder encontrar la información de envío o ‘dedicar demasiado tiempo a crear la cuenta de invitado para el pago’, etc. Dicha información se puede descubrir fácilmente utilizando herramientas de análisis cualitativo como mapas de calor.
El mapa de calor es una de las herramientas de diagnóstico más poderosas y eficientes con la que puedes descubrir una gran cantidad de información sobre cómo los visitantes interactúan con tus páginas web y utilizar esa información para mejorar el compromiso de tu sitio web y diseñar una interfaz de usuario más inteligente.
Así pues, algunas de las razones por las que utilizar estos mapas en tu negocio:
Mide el rendimiento del sitio web
Con los distintos tonos de color del mapa de calor que representan diferentes niveles de rendimiento, los mapas de calor resaltan instantáneamente los problemas importantes en tu sitio web.
Con los mapas de clics que rastrean el patrón de clic de los visitantes, los mapas de desplazamiento que determinan la longitud óptima de la página y los mapas de seguimiento del mouse que indican dónde se desplaza un visitante mientras navega por tu página web, puedes determinar fácilmente qué tan atractivo es tu sitio web y qué tan bien estás haciendo la usabilidad.
Simplifica los datos numéricos
Como se mencionó anteriormente, los mapas de calor complementan la hipótesis creada por los números y representan los datos de una manera fácil de entender. Según el esquema de color que utiliza, puedes determinar fácilmente;
- qué partes de tu página web están funcionando bien,
- qué secciones tienen margen de mejora y
- qué secciones necesitan un rediseño completo.
Lee la mente de tus visitantes
Puedes rediseñar todo tu sitio web y aún así no mejorar su rendimiento, si no consideras lo que tus visitantes esperan encontrar y dónde. Los mapas de calor te ayudan a realizar cambios seguros que coincidan con las expectativas de tus visitantes.
Lo mejor que pueden hacer los mapas de calor es decirte exactamente cómo se comportan los visitantes en tu sitio web y cómo esperan que sean las cosas. En pocas palabras, los mapas de calor del sitio web te ayudan a leer la mente de cada uno de tus visitantes para poder realizar los cambios correspondientes.
Mejora el CRO
Todos los beneficios anteriores contribuyen a un gran ejercicio de optimización de tu sitio web a la mejor y más inteligente versión posible. Cada visitante rastreado en un mapa de calor significa información útil adicional para optimizar tu sitio web.
Tomemos un ejemplo para comprender cómo los mapas de calor contribuyen a la optimización general del sitio web.
Para cualquier negocio online, la página de inicio es donde comienza el viaje de cada visitante (a menos que aterrice directamente en una página de producto u oferta a través de enlaces externos, anuncios pagados, etc.).
Ya sea que vayan a comprar un producto, se suscriban a un boletín informativo, llenen un formulario de clientes potenciales o lo abandonen sin realizar una conversión, todo su viaje comienza desde la página de inicio.
Supongamos que tienes una tienda de comercio electrónico y deseas ver cómo reaccionan los visitantes a la home. Así que, configuras un mapa de calor en la página de inicio durante un período de muestra de 2 semanas y muestra el tráfico de 3000 visitantes nuevos.
El mapa de calor se ejecuta con éxito durante el período de muestra y te brinda toneladas de información sobre el comportamiento de los visitantes. Después de mirar el mapa de calor generado, observas que hay algunas secciones de tu página de inicio que atraen a muchos visitantes. Estas eran las secciones que estaban en la parte superior de la página: la imagen principal, el título de la página de inicio y reseñas de productos.
Lo que también notas es que no muchos visitantes se desplazaban hasta la parte inferior de la página de inicio y ahí es donde habías colocado el CTA principal: ‘Suscríbase a nuestra newsletter’.
Ahora que tienes todas estas ideas, ¿son de alguna utilidad además de hacerte saber lo que piensan los visitantes sobre tu sitio web? ¡ABSOLUTAMENTE SÍ!
Ya sabes que la imagen principal, el título de la página de inicio y las reseñas de productos obtuvieron la mayor atención, puedes trabajar para mejorar estas secciones y también agregar otra información importante en éstas.
También puedes cambiar la ubicación de la CTA principal de la home y colocarla en la mitad superior de la página, en una sección que reciba la máxima atención. Lo que harán estos cambios es que convertirán tu página de inicio en una versión que coincida con las expectativas de tus visitantes, mejorarán la experiencia del usuario (UX) de tu sitio web y, por lo tanto, ayudarán a aumentar la tasa de conversión.
Errores comunes cometidos al usar mapas de calor de sitios web
En principio, un mapa de calor no es complejo de utilizar, pero aun así, los especialistas en marketing seguimos cometiendo errores al configurar y utilizar estos mapas.
Algunos los errores más comunes son:
Tamaño de la muestra
Los mapas de calor deben tratarse como cualquier otra herramienta estadística y por tanto deben usar un tamaño de muestra que sea representativo de todo el público objetivo.
Al seleccionar el tamaño de la muestra, hay que tener en cuenta que no debe ser demasiado grande o demasiado pequeño porque, en ese caso, el tamaño de la muestra no será representativo y el informe del mapa de calor no será de mucha utilidad.
Además de depender del objetivo que se desea rastrear, el tamaño de la muestra también depende de otros factores. Se puede calcular el tamaño de muestra correcto para el ejercicio de mapas de calor en función de los siguientes parámetros:
Tráfico mensual
El tráfico total mensual de las páginas en las que se implementará el mapa de calor
Margen de error
El margen de error que establece refleja cuánto pueden diferir los resultados de la investigación, de la imagen real de toda la población.
Nivel de confianza
Porcentaje que refleja la confianza que tenemos de que la muestra elegida va a producir un resultado determinado.
Si tu sitio web recibe mucho tráfico, puedes establecer fácilmente el tamaño de muestra para tu mapa de calor utilizando la siguiente fórmula presentada por Scott Smith :
(valor Z) ² X desviación estándar (1 desviación estándar) / (margen de error) = n²
Donde,
El valor Z corresponde al nivel de confianza elegido. Puedes encontrar fácilmente tablas online que enumeren los valores z para las losas de nivel de confianza que son más comunes. Por ejemplo:
| Nivel de confianza | Puntuación Z |
| 99% | 2,58 |
| 95% | 1,96 |
| 90% | 1,65 |
| 85% | 1,44 |
| 80% | 1,28 |
La desviación estándar es el grado de diferencia entre la media de un conjunto de datos y los puntos de datos individuales en el conjunto de datos.
También puedes optar por utilizar calculadoras de tamaño de muestra en línea para evitar cometer errores de cálculo.
Tipo de tráfico
Además del tamaño de la muestra, también es importante evitar el uso del tipo de tráfico incorrecto.
Por ejemplo, las empresas de cualquier industria siempre tienen 2 tipos de visitantes en sus sitios web en común: visitantes nuevos o nuevos y visitantes antiguos o recurrentes.
Ahora, los parámetros de seguimiento del comportamiento para los visitantes nuevos y los visitantes que regresan son muy diferentes. Un visitante que regresa puede reaccionar a los mensajes en tu sitio web de una manera muy diferente a un visitante nuevo. O bien, un visitante que regresa puede llegar a tu sitio web en busca de una información diferente a la de un visitante nuevo.
Periodo de muestra
Al configurar un mapa de calor en tu página web, debes tener en cuenta el período de tiempo que elijas para ejecutarlo. Al decidir el período de la muestra, recuerda los siguientes puntos:
- El período de muestra debe establecerse teniendo en cuenta factores externos como días festivos, festivales, período de venta, fines de semana, etc.
- El período de muestra debe considerar diferentes comportamientos de los compradores.
Si no se tienen en cuenta los puntos anteriores al configurar el período de muestra, aumentan las posibilidades de que el informe de mapa de calor no sea representativo.
Datos contaminados:
Como especialistas en marketing, siempre buscamos formas de obtener resultados rápidos. En algunos casos, esto puede ser beneficioso, pero en otros, puede ser perjudicial.
Cuando se trata de mapas de calor, esta curiosidad obstaculiza la calidad de los datos generados. Esto es especialmente cierto para las organizaciones que son nuevas en el uso de herramientas como mapas de calor.
Cuando echas un vistazo repetidamente a un mapa de calor o cuando deduces conclusiones de él antes de que finalice su período de muestra, básicamente estás contaminando tus propios datos del mapa de calor.
Conclusión apresurada
Uno de los errores más comunes y perjudiciales es tomar las primeras tendencias ganadoras como resultado final y detener el mapa de calor antes de que finalice el período de muestra.
Digamos, por ejemplo, que configuras un mapa de calor en una de tus páginas web y tomas 2 semanas como período de muestra. Al final de la primera semana, observas los datos y ves que muchos visitantes estaban haciendo clic en una sección sin enlaces en lugar de hacer clic en la llamada a la acción principal. Sin esperar a que termine la segunda semana, realizas cambios y los implementas.
Al realizar cambios basados en suposiciones, estás comprometiendo la validez de tu informe de mapa de calor. Si te apresuras a llegar temprano a una conclusión, es posible que pierdas información clave que el mapa de calor es capaz de generar para tu negocio.
Ejemplo de mapas de calor en industrias populares
Los mapas de calor pueden aportar información muy útil del comportamiento de los usuarios independientemente del tipo de sitio web que tengas.
Mapas de calor de sitios web en comercio electrónico
Las empresas de comercio electrónico utilizan mapas de calor para aumentar sus conversiones porque les ayudan a descubrir y analizar exactamente cómo se comportan los visitantes en tu sitio web.
Para comprender cómo funciona esto en realidad, tomemos un ejemplo de un mapa de calor de un sitio web sobre cómo los compradores usan Amazon al comprar un libro.
Si observas el mapa de calor, puedes determinar fácilmente las áreas que reciben la mayor atención en la página:
Lo que revela este mapa de calor es que las secciones que más llaman la atención y las secciones que generan más participación se encuentran en la parte superior de la página. Otra observación es que los visitantes también hacían clic en la sección «los clientes que compraron esto también compraron», la sección «productos patrocinados» y la sección «libros de esta serie»:
Con información como la anterior, las tiendas de comercio electrónico pueden colocar productos relacionados y contenido importante en las áreas más populares y generar conversiones más altas.
Para comprender un uso más específico de los mapas de calor en la industria del comercio electrónico, veamos cómo una tienda en línea que vende productos para bebés utilizó mapas de calor de sitios web para identificar distracciones y utilizó esa misma distracción en su beneficio.
A continuación se muestra un mapa de calor trazado en la página original:
En el análisis, el mapa de calor reveló que la cara del bebé en la página estaba recibiendo la mayor parte de la atención de los visitantes cuando deberían haber sido los mensajes y el producto del lado derecho los que deberían haber sido las áreas más populares.
Investigaciones posteriores revelaron la razón de ser de la atención que estaba atrayendo el rostro del bebé: las mujeres, los bebés y las personas atractivas son el tema principal de la mirada de los visitantes en cualquier página. Basándose en todas estas ideas, se cambió el diseño de la página, y este es el mapa de calor del nuevo diseño:
En la primera captura de pantalla, se notó que la cara del bebé era una distracción para los visitantes. Entonces, el tema de la vista del bebé se cambió al producto y los mensajes, y el mapa de calor del nuevo diseño muestra que, si bien la cara del bebé continuó atrayendo la atención, los visitantes prestaron cada vez más atención al contenido y al producto en el lado derecho siguiendo la línea de mirada del bebé.
Mapas de calor de sitios web en medios y publicaciones
Una empresa editorial en línea puede producir boletines, periódicos, revistas mensuales, etc. Sea cual sea el tipo de contenido, el objetivo principal es siempre aumentar el número de lectores y las suscripciones a los distintos productos que ofrecen.
El hecho es que las personas solo leerán sus artículos y periódicos digitales y se suscribirán a ellos si su artículo agrega valor a sus conocimientos existentes. Por lo tanto, es imperativo que se coloquen solo las piezas más informativas sobre las que la gente quiera saber más en las secciones más vistas de la página.
Por ejemplo, veamos el mapa de calor de TheGuardian.
Fuente de la imagen: talkroute
El mapa de calor revela que la mayor parte de la atención se concentra en las secciones superior izquierda de la página y que los lados inferior y derecho de la página reciben poca o ninguna atención.
Si algunas secciones de tu página obtienen la mayor parte de la atención y las otras secciones se ignoran por completo, tu página debe rediseñarse.
Digamos, por ejemplo, que la sección ‘más noticias’ en la página anterior puede tener noticias que se alinean con los intereses de muchos lectores. Pero debido a que su capacidad de atención disminuye cuando llegan a la sección inferior, solo terminan interactuando realmente con las secciones superiores izquierda que no tienen temas de su interés.
Esto puede generar fricciones y una mala experiencia del usuario. Los mapas de calor del sitio web pueden ayudarles a identificar dichos patrones de navegación y permitirle ubicar las noticias en consonancia con los intereses y expectativas de sus visitantes.
En la industria de la transmisión de video, Netflix es el rey cuando se trata de usar varios medios para la optimización de la conversión, como pruebas A / B, mapas de calor de sitios web y otras herramientas de análisis del comportamiento de los visitantes para personalizar la experiencia de sus usuarios.
Una de las pruebas más sólidas de esto es la revisión de 2013 de toda su interfaz de usuario destinada a reducir la carga cognitiva de sus usuarios. Esto es lo que se veía la página de Netflix antes de la revisión:
Fuente de la imagen: Netflix
En 2009, Netflix lanzó el formato que se muestra arriba para televisores inteligentes y dispositivos conectados. Sin embargo, este formato presentaba filas interminables de carátulas de cajas. Entonces, en 2012, los diseñadores de Netflix se embarcaron en la búsqueda para construir maquetas para un formato de interfaz de usuario que se enfocaría