¿Qué es un mapa de calor y para qué se utiliza?

Muchas de las técnicas de análisis más avanzadas con las que soñó hace años ahora están disponibles con un solo clic.

Ese Mapa de calor o mapa de calor Son un ejemplo obvio, como verás en las siguientes líneas, pero también puedes probar y registrar sesiones de usuarios, encuestas de satisfacción o pruebas complejas multivariadas.

Esto representa uno real Democratización del análisis digital Este es un gran paso adelante para cualquier propietario de un sitio web que desee modificarlo.

Mencioné todo El mapa de calor de la red es una de las tecnologías más populares No solo porque ya están disponibles para cualquier mortal, sino también porque son bastante fáciles de explicar, son elementos muy visuales los que hacen posible hacerlo de forma eficaz. conocimiento Para su sitio web.

¿Qué es un mapa de calor y para qué se utiliza?

Un mapa de calor es una representación gráfica de un elemento que usa códigos de colores para representar varios estados de actividad. Por lo general, el rojo es el nivel máximo de actividad y el azul es el nivel mínimo de actividad. El promedio se refleja en colores en el espectro que separa el rojo y el azul: naranja, amarillo y verde.

Como tal recurso visual y con una representación tan natural y fácilmente comprensible de los colores para todos (áreas calientes en rojo, áreas "frías" en azul), se utiliza en muchas disciplinas.

Por ejemplo, aquí tienes una de las cataratas más clásicas: un mapa de la temperatura media anual de los Picos de Europa:

Este mapa de calor, por supuesto, muestra que la temperatura media anual de estos picos es más baja. La leyenda de color le ayuda a explicar la bifurcación de datos fácilmente.

Otro ejemplo sería este donde puedes ver un mapa de calor que incluye el censo latinoamericano de Estados Unidos:

Mira: hay más hispanos en la costa oeste, especialmente en la frontera con México. No necesita saber nada sobre demografía, geografía o análisis. Es muy obvio. Este es un gran beneficio de usar mapas de calor.

Un mapa de calor también es una herramienta muy útil en el análisis digital y de redes. Se utilizan para estudiar el comportamiento de los usuarios en sitios web y aplicaciones. Básicamente sus patrones de movimiento.

En estos casos, el objetivo suele ser optimizar la experiencia del usuario y lo más importante es identificar áreas de mejora para cumplir con los objetivos comerciales.

Como puede imaginar, en este artículo nos centraremos en el tipo final de mapa de calor: el mapa de calor de la red.

Mapa de calor de red o tipo de mapa de calor

En las estrategias de análisis para sitios web se utilizan habitualmente cuatro tipos de mapas de calor.

Aunque las primeras carreteras son difíciles de construir, las otras son muy frecuentes y se pueden expandir en un área grande sin mucho esfuerzo.

Preste atención al mapa de calor o Registro visual

Estas cartas son clásicas y son las más difíciles de jugar fuera del laboratorio.

Incluyen la creación Seguimiento ocular del usuario Descubre el modo deportivo mientras navegas por tu sitio web.

Utilizan dispositivos muy especiales en forma de gafas que requieren acceso directo a un entorno controlado para usuarios y experimentos. Además, esto solo es posible una vez, dependiendo de la cantidad de puntos y plazas disponibles.

Cuando se utilizó este tipo de mapa para mostrar la importancia de la primera posición en los resultados de búsqueda, se hizo muy popular.

Identificaron un patrón de lectura en forma de F que premia a los 3 primeros y luego reduce significativamente el interés del usuario.

Este modelo es un clásico que reaparece en distintas páginas.

Mapa de calor deportivo

Obviamente, para la mayoría de las personas, las opciones enumeradas anteriormente no están disponibles. Sin embargo, existe una opción más económica y práctica, Seguimiento del puntero del mouse.

En este caso, no se requiere hardware, solo un script instalado en su sitio. Esto se conectará al servidor que almacenará toda la información del movimiento del mouse para cada visita y luego mostrará el promedio en un mapa de calor.

Si bien puede parecer obvio que la atención del ojo y la atención del cursor no necesariamente tienen que superponerse, la verdad es que este estudio muestra una alta correlación entre los dos. En concreto, el 88% se da allí, lo que parece muy indicativo.

Este tipo de mapa de calor no se puede utilizar en tecnologías móviles porque no tiene dicho puntero en la interfaz.

Haga clic (o haga clic en el teléfono) un mapa de calor

Aspectos destacados de esta tarjeta Indique el punto en el que el usuario hizo clic en la página.Cuanto mayor sea la concentración de clics, más cálidos serán los colores en el mapa de calor de la red.

Este es un tipo de mapa muy interesante ya que generalmente revela problemas de usabilidad, como: B. Áreas donde los usuarios hacen clic y esperan una determinada acción (botones o enlaces) y no pueden encontrarla.

En el caso de dispositivos móviles, se registra Haga clic en O una ola en la pantalla, entonces Desliza tu dedo por la pantalla, Desplazamiento horizontal o vertical.

Este tipo de tarjeta tiene Tarjeta de confetiRepresentan el número de clics en consecuencia e indican en color otros datos como el tipo de navegador, el sistema operativo, la hora, la duración del acceso, etc. Los verá más tarde cuando hable sobre el complemento Nelio.

En ambos casos, no requieren ninguna tecnología física y se crean utilizando scripts en la red.

Desplazarse por un mapa de calor

Este tercer conjunto de mapas de calor refleja Las áreas web a lo largo de la barra de desplazamiento tienen la mayor concentración de usuarios.

Con ellos, puedes saber si la visita llegó al pie de página de la página, qué porcentaje del artículo leyeron o si no vieron la llamada a la acción que publicaste en la última parte de la publicación.

¿Por qué crear un mapa del sitio de calor?

La analítica de flujo de clics como Google Analytics es realmente útil, pero solo le dice qué sucedió en el sitio web o cuánto sucedió. Ésta es información cuantitativa.

Los mapas de calor son parte del análisis cualitativo y desea saber por qué está sucediendo en su sitio. Este es un complemento básico diseñado para resolver un problema que sabe que existe debido al flujo de tráfico, pero que no es la causa.

Por ejemplo, si tiene un llamado a la acción (CTA o Llamada a la acción) En la parte inferior de la página de destino donde vende productos y obtiene muy pocos clics, puede haber muchas razones para esto. Los problemas comunes son los precios altos, las tasas de interés bajas, los problemas de usabilidad o disponibilidad y los errores técnicos posteriores.

Un gráfico de desplazamiento puede ayudarlo a comprender el porcentaje de usuarios que alcanzan la altura de la página.

Imagine que solo el 5% de los usuarios alcanza este nivel, por lo que solo 5 de cada 100 visitas pueden hacer clic. Esto cambia todo al evaluar las conversiones.

Herramientas y complementos para incrustar mapas de calor en su sitio web

Como dije al principio de este artículo, hay muchas opciones disponibles hoy para realizar este tipo de experimentos en su sitio web. Algunos incluso son gratuitos.

De cualquier manera, los usuarios que pagan suelen ofrecer un período de prueba lo suficientemente largo como para comenzar a utilizar esta herramienta.

Echemos un vistazo a continuación para ver cuáles de mis experiencias son las más interesantes y qué beneficios ofrecen.

estante

No hay duda de que Hotjar es la herramienta más popular para proporcionar experimentos de mapas de calor.

Es un paquete de encuestas de satisfacción y análisis del comportamiento del usuario. Además de los mapas de calor, también ofrece servicios que registran las sesiones de los usuarios, recopilan comentarios, convierten tablas de embudos y analizan servicios.

El mapa de calor es muy completo (mover, hacer clic y desplazarse) y se puede clasificar por tipo de dispositivo.

Hasta cierto punto, los mapas de calor de clics son interactivos para los analistas. Simplemente colocando el puntero del mouse sobre esta posición en el mapa, cada bloque muestra el porcentaje de clics recibidos en comparación con el número global de clics.

Además, todos los datos de la tarjeta se guardan como originales y se pueden exportar a CSV donde puede ver la etiqueta. Archivo HTML.Id y clase CSS de cada elemento, estos elementos han pasado el clic o el puntero del mouse.

Hotjar se puede utilizar en cualquier tipo de sitio web, independientemente de su motor o CMS. Aunque tiene un complemento de WordPress, puede usarlo en sitios de Magento, Prestashop o solo HTML, por ejemplo.

Tiene sus propias etiquetas en la biblioteca de Google Tag Manager. Entonces, si está utilizando GTM en su sitio web Hotjar, la implementación del script no podría ser más fácil (le mostraré el video tutorial a continuación). De lo contrario, agregue un poco de código a la etiqueta.Su sitio web está listo para usar.

Se trata de Herramienta de pago, pero servicio gratuito Existen limitaciones experimentales. Estas limitaciones le dan suficiente margen de maniobra para explorar la herramienta y utilizar fácilmente experimentos en sus propios proyectos.

El precio es un poco elevado, pero ten en cuenta que hay muchas vistas a las que acceder ya que están orientadas al mercado profesional.

Prueba Nelio A / B

solución Mapa de calor WordPress El equipo de Nelio es uno de los mejores CMS nativos que existen.

Como sugiere el nombre, la prueba Nelio A / B es una herramienta que se centra en experimentos A / B y pruebas multivariadas. De hecho, es uno de los mejores, ya que tiene una interfaz de usuario muy agradable que se integra perfectamente con los últimos diseños de Gutenberg.

Pero también tiene la función de implementar mapas de calor, que de ninguna manera es una adición, sino muy interesante.

La prueba Nelio A / B tiene un mapa de calor con función de clic y desplazamiento. Ambas opciones están divididas por tipo de dispositivo: computadora de escritorio, tableta y dispositivo móvil.

Debo enfatizar que no ofrece un mapa en movimiento siguiendo el puntero del mouse como Hotjar, pero ofrece una novedad muy interesante: la tarjeta de confeti.

Estas tarjetas muestran el número de clics recibidos marcando cada punto como un punto (de ahí confeti) y dibujándolos con códigos de colores para asignarlos a diferentes tamaños.

Las opciones para estos tamaños son numerosas y variadas: ancho de ventana en píxeles, día de la semana, hora del día, navegador utilizado, país / región, sistema operativo o tipo de dispositivo. Estos son datos que son muy importantes para el comportamiento del usuario y los patrones de reconocimiento.

Nelio A / B-Test es un complemento de tipo freemium. Puede descargarlo de forma gratuita desde el repositorio oficial de WordPress y probarlo para obtener hasta 500 páginas vistas sin activar una licencia. Si necesita más vistas, deberá usar la versión paga de Basic, Professional o Enterprise.

Las operaciones necesarias para calcular el mapa de calor se realizan en el servidor Nelio, no en el suyo. Por tanto, es una de las soluciones locales que menos impacto tiene en el rendimiento del sitio.

Mapa de calor de la aurora boreal

La gran ventaja de Aurora Heatmap, otro complemento de WordPress, es que puede crear tantos mapas de calor como desee de forma gratuita, sin estar limitado por la cantidad de pruebas o la duración del experimento.

La razón de esto es que no utiliza ningún servicio externo y todos los recursos son propios, es decir, el servidor de su propio sitio web.

Además, es extremadamente fácil de configurar: instalar, activar e iniciar mediciones. No necesitas más.

Al mismo tiempo, es una de las opciones con menos opciones. En la versión gratuita, todo lo que tienes que hacer es hacer clic en el mapa. Tienes que comprar servicios premium para ir móvil y móvil, y no hay un período de prueba.

Otro aspecto que no me gusta es la creación de mapas de calor para todas las páginas de su sitio web. No puede elegir aquellos que serán objeto del experimento.

Si tiene mucho tráfico y páginas (como blogs), el consumo de recursos es enorme; por ejemplo, es posible que solo le interese el comportamiento del usuario en la página de inicio.

En mi opinión, esta opción solo es adecuada para páginas pequeñas, de lo contrario, el intercambio de cookies de terceros puede causar problemas a los usuarios en el nivel de control de GDPR, por lo que otras opciones no son posibles.

En cualquier caso, siempre es interesante tener un anfitrión que se desempeñe bien en tales situaciones.

Cómo instalar un mapa de calor o un mapa de calor en su sitio web

Como verá en las próximas líneas, cualquiera puede experimentar con mapas de calor ya que no existen dificultades técnicas.

Sugeriré dos métodos diferentes. El primero se aplica a cualquier tipo de sitio web, independientemente de la tecnología. Solo se necesita un poco más de habilidad para trabajar con pequeños fragmentos de código.

El segundo será para WordPress.

Cómo crear manualmente un mapa de calor

Puede utilizar Hotjar para crear un mapa de calor en cualquier tipo de red. Como mencioné anteriormente, este es un sitio premium, pero tener una cuenta gratuita es suficiente para comenzar a experimentar.

Una vez que haya creado una cuenta y la haya vinculado a su sitio web (describiré este proceso en detalle en el video a continuación), puede usar Hotjar para configurar un mapa de calor.

Para hacer esto, haga clic en el menú de la página principal de su cuenta. Mapa de calor Una vez en Nuevo mapa de calor.

El primer paso es nombrar el experimento. Le sugiero que agregue enlaces a la página que está analizando. Manténgase alejado de los títulos del Experimento 1, Mapa de calor web, etc.

El siguiente paso es elegir el número de páginas vistas que desea utilizar para crear el mapa. Cuantas más páginas se utilicen, más representativo será el mapa.

La disponibilidad depende del tipo de cuenta utilizada. Basic está limitado a mil páginas vistas. Son suficientes para experimentos sencillos.

En el tercer paso, debe definir el objeto de prueba, es decir, el lado en el que desea realizar la prueba. Hay dos opciones para cuentas básicas:

• Página específica: Solo páginas que coinciden con la URL especificada.
• Grupo de páginas: Las páginas que comparten una raíz de URL común. En comercio electrónico, por ejemplo, estas son las siguientes URL: myweb.com/shop/products/ ... Hotjar ofrece un documento completo con las fórmulas disponibles para el posicionamiento de páginas.

Al usar la URL de una página específica, puede indicar si solo la URL debe analizarse como una coincidencia exacta (Coincidencia de URL exacta) O también le gustaría una variante lateral (Mapeo de URL sencillo) Al cargar su variante Cadena de consulta Fragmentos.

En el último caso, puede incluir www, http / https, mayúsculas / minúsculas, etiquetas de campaña y variables en sus versiones de prueba y sin ellas al final de la URL (por ejemplo,? X = 1 & y = 1). Se recomienda evitar perder páginas vistas.

Algo queda Ajustes avanzados Se utiliza para realizar capturas de pantalla de mapas, que pueden resultar muy interesantes en determinadas situaciones:

Excluir elementos del mapa de calor Esto es importante si su página muestra una ventana emergente cuando se carga y no desea que aparezca en la captura de pantalla que se usa para mostrar el fondo del mapa. También puede usarlo para ocultar cualquier otro elemento que no desee mostrar, como B. Banners de Adsense.

URL de la página de captura de pantalla personalizada Se utiliza para seleccionar una página específica que desea mostrar como mapa. Esto es útil cuando está analizando una serie de páginas y no desea que el mapa aparezca en la primera página cargada (este es el método predeterminado).

El último paso es solo verificar que todos los datos se hayan ingresado correctamente, especialmente la presencia de la URL. Crea un mapa de calor Realiza un experimento que comienza a recopilar datos de inmediato.

Después de unos días, puede mirar su tarjeta y Hotjar le informará del porcentaje que falta del experimento para obtener una muestra representativa.

con Mostrar mapa de calor Incluso si el experimento no está terminado, puede ver el desarrollo.

Puede desplazarse, tocar y desplazarse por el mapa como desee, segmentar por dispositivo y cargar toda la información recopilada en un archivo CSV.

En el video tutorial a continuación, verá todo el proceso desde la apertura de una cuenta con Hotjar hasta la visualización de los distintos mapas de calor generados por la herramienta.

Cómo instalar un mapa de calor en WordPress

Si su sitio web está basado en WordPress, se sentirá más cómodo sin salir de la interfaz y no querrá instalar scripts en su sitio web. Comparado con Hotjar sería una buena opción Pruebas Nelio A / B.

Las pruebas Nelio A / B están disponibles en el repositorio de WordPress. Para instalarlo, solo tiene que iniciar sesión en su sitio web y descargarlo desde mesa andar Complementos> Agregar nuevo. Utilice el motor de búsqueda para buscar, instalar y activar Nelio A / B Testing.

Nelio crea una nueva entrada en el menú del escritorio llamada Nelio A / B Test. La primera vez que lo ingrese, se le pedirá que acepte el acuerdo de usuario.

Luego se muestra la página de resumen de la prueba, que por supuesto está en blanco.

Esta página también se utiliza para determinar el número de visitas a la página que puede probar con una cuenta de prueba Nelio A / B.

Como mencioné anteriormente, este es un complemento gratuito, pero con limitaciones. La versión avanzada le da acceso a experimentos avanzados, especialmente patrones de prueba grandes.

En la versión más simple, puedes ver que hay 500 vistas disponibles. Hay más que suficiente para nuestros experimentos, no te preocupes.

prensa versión de prueba sí prueba En el menú verá una lista de las pruebas ejecutadas a partir de las cuales puede construir Nueva prueba...

Verás hasta 11 tipos de experimentos, pero en la versión básica solo puedes hacer pruebas A / B en páginas o mapas de calor. Este último es nuestro objetivo.

Configurar un mapa de calor es fácil. En la captura de pantalla a continuación, puede ver los campos que deben completarse.

• Su nombre de prueba: Necesitas nombrar la prueba. Recomiendo usar el que se explica por sí mismo. Una vez que haya ejecutado varias pruebas, siempre es útil comprender el contenido de cada prueba de inmediato.
• Lado de grabación: Puede elegir el tipo de contenido que desea probar. Si su sitio web tiene un tipo personalizado (CPT), también aparecerá en la lista desplegable.
• Seleccione una página / publicación: Dependiendo del tipo de contenido, este menú desplegable mostrará todas las opciones que tiene en el sitio web.
• Genere un mapa de calor para la página con la URL dada: De esa manera, puede elegir cualquier URL del sitio. Esto es ideal para páginas que no se pueden seleccionar con las opciones anteriores. Por ejemplo, páginas dinámicas como archivos de categorías. Si habilita este campo, verá un campo para ingresar una URL en lugar de la lista desplegable anterior.
• describir: Este campo es opcional, pero es interesante describir su hipótesis para iniciar el experimento. Si lo dejas funcionar durante unos días, es posible que olvides por qué comenzó.

Una vez que haya realizado todos los ajustes, puede Empezar Experimente, solo tiene que esperar a que disminuya el tráfico.

Para obtener una tarjeta lo suficientemente confiable, debe tener cientos de visitantes. Idealmente alrededor de mil, pero mucho antes de eso, descubrirá patrones de clic y gráficos de desplazamiento decentes.

En cualquier caso, puede ver sus mapas incluso antes del final del experimento, ya que se generan en tiempo real (no realmente, pero casi). Si obtiene una muestra aceptable (más de 300 veces si es posible), puede hacerlo manualmente.

Pase el puntero del mouse sobre la prueba en la lista prueba Usted puede Ver resultados.

La primera información que le muestra el complemento es el mapa de calor del clic, aunque solo se muestra en la pestaña Mapa de calor En general.

Puede elegir escritorio, tableta o teléfono y algunas configuraciones para mejorar la visualización del mapa, la opacidad y la intensidad del calor.

Esta información es puramente visual y es imposible determinar el porcentaje de clics que representa la escala de colores. En este sentido, Hotjar es más completo y preciso.

Siguiente pestaña del informe Desplazarse por el diagrama, O desplácese por el mapa de calor. Le mostrará la profundidad de la navegación en la página según la Porcentaje de usuarios.

En este caso, ha nombrado reglas para su referencia y guía. popularidad En otras palabras, si mueve el mouse sobre el mapa, obtendrá datos precisos sobre el porcentaje de usuarios que han visitado esa área de la página.

En la tercera y última pestaña, tienes una tarjeta papel picadoUn mapa es una versión de un mapa de calor en el que cada punto de contacto se puede segmentar de acuerdo con varios parámetros en forma de metadatos.

El siguiente ejemplo le permite ver el mapa según el ancho de la ventana del navegador del usuario.

Tamaños disponibles para este mapa de calor de confeti:

• Día de trabajo
• Momentos del día
• Haga clic en un momento (predeterminado)
• Navegador
• nación
• sistema operativo
• equipo

Podemos decir que este tipo de mapa permite identificar patrones en función de las características de navegación y el contexto del usuario.

Debe tener en cuenta que este mapa requerirá muchas más visitas que antes para que los datos sean realmente representativos.

finalmente

Como puede ver, cualquiera puede colocar mapas de calor en su sitio web y realizar un análisis cualitativo de las interacciones de los usuarios con ellos.

Las conclusiones que puede extraer de este tipo de experimentos suelen ser muy valiosas y reflejan la naturaleza del problema o la nueva oportunidad.

Los costos de inversión para el usuario final son muy bajos: cada solución ofrecida ofrece una cuenta gratuita que cubre las necesidades básicas. Todo lo que tiene que hacer es tener en cuenta el tiempo de espera y asegurarse de que estará listo en menos de media hora.

A nivel de desempeño Esto tiene un impacto significativo en su sitio durante la generación del mapa de calor.... Es importante establecer una fecha límite para el experimento y que sea lo más breve posible.

La clave es encontrar la muestra más representativa y, en función del tráfico promedio a su sitio web, determinar la duración de la prueba.

Vi que un lado se ralentizaba significativamente debido a un experimento que de repente dejó de funcionar. Esto puede tener un impacto en el SEO y la experiencia del usuario que no se puede ignorar.

En resumen, el examen es muy fácil y gratuito. Cuando la duración es ajustable, el impacto en el rendimiento es razonable. Después de recopilar los datos, puede detenerlos y dedicar el tiempo necesario a analizarlos.

No hay razón para no hacer un mapa de calor de las páginas más importantes, así que, ¿a qué estás esperando?