Heatmaps, Scrollmaps y Confeti en WordPress

Los heatmaps, scrollmaps y confeti son representaciones visuales de la interacción de los visitantes en una página web mientras navegan por ella.

Descubre qué areas son las más atractivas y cuáles las más ignoradas y usa esta información para mejorar tu WordPress.

Este tipo de tests te ayudarán a comprender mejor a tus visitantes, puesto que verás qué es lo que capta su interés. Crea tu primer test de heatmaps después de haber instalado, activado y configurado Nelio A/B Testing.

Instrucciones para los test de heatmaps

Una vez hayas instalado, activado y configurado Nelio A/B Testing, sigue estas instrucciones para crear un test de heatmaps.

Crear un nuevo test

  1. Bajo el menú Nelio AB Testing, haz clic en Tests para ver y gestionar tus tests.
  2. Haz clic en el botón Añadir test en la parte superior de la pantalla.
  3. Se te abrirá una ventana con todos los tipos de test que puedes crear. Cada uno de ellos tiene un nombre y un icono.
    • Haz clic en Heatmap.
Selector de tipos de test en Nelio A/B testing.

Nombra y define tu test

Primero de todo, dale un Nombre descriptivo al test que quieres crear para que te ayude a identificarlo en el futuro. Además, en la barra lateral derecha, encontrarás dos pestañas adicionales:

  • Estado y Gestión, donde ves el estado en el que está tu test actualmente (BorradorPreparadoProgramado o Pausado) y opciones sobre cuándo debe iniciarse y finalizar,
  • Descripción del test, donde puedes indicar qué estás probando.
Creación de un nuevo test the heatmaps

Selecciona el contenido a probar

Primero, selecciona el contenido sobre el que quieres realizar el test. Para ello, primero debes escoger el tipo de contenido de la lista que aparece por defecto (por ejemplo, Página). A continuación, selecciona el contenido especifico de ese tipo que quieres probar (una página concreta, en nuestro ejemplo).

Para ello, o bien lo escoges de la lista de opciones que aparece por defecto, o bien marcas la casilla de Realizar heatmap de una página especificada usando su URL e indicas la URL de la página que quieres probar.

Selección de página a probar en test de heatmaps

Cómo iniciar el test

Una vez hayas definido totalmente tu test, verás que el estado del mismo habrá pasado de Borrador a Preparado. En ese momento, podrás iniciarlo para que puedas hacer un seguimiento de los visitantes de tu web.

Iniciar un test A/B con Nelio A/B Testing.

Inicia tu test

Para iniciar un test, comprueba que esté Preparado y, si lo está, haz clic en el botón Iniciar… que hay en la esquina superior derecha. Si no estuviera Preparado, puedes poner tu cursor encima del icono de información que aparece al lado del Estado para ver el motivo por el cual tu test sigue estando como Borrador.

Si no quieres iniciar el test directamente, sino que quieres dejarlo programado para una fecha concreta, especifícala usando el campo Inicio de la sección Estado y gestión.

Una vez iniciado el test, el plugin te mostrará su página de resultados y verás que el estado cambia a En ejecución.

Seleccionar el modo de finalización de un test A/B con Nelio A/B Testing.

Cuándo quieres que finalice tu test

También puedes definir cuándo quieres que la ejecución acabe, indicando el Modo de Finalización del test:

  • Manual: el test se parará cuando hagas clic en el botón de Parar el test, en el listado de tests o en su página de resultados.
  • Duración: el test se parará automáticamente tras el tiempo indicado.
  • Páginas vistas: el test se parará automáticamente tras alcanzar el número total de visitas que hayas especificado.

Cómo ver el progreso de un test y sus resultados

En la opción de menú Tests puedes ver el listado de los tests creados, el estado en que se encuentran y la fecha de su última actualización. En todo momento puedes ver los resultados de un test que está iniciado o que ya ha finalizado haciendo clic en el enlace Ver Resultados que se encuentra debajo de su nombre.

Barra lateral del test de heatmap

Resultados de tu test

En la barra lateral derecha de la página de resultados encuentras tres pestañas que indican el tipo de visualización:

  • Heatmap: muestra qué áreas de tu página generan más interés.
  • Scrollmap: muestra a través de franjas horizontales de color, hasta dónde hacen scroll los visitantes.
  • Confeti: muestra los clics de los visitantes según el filtro que elijamos.

Para cada pestaña, encontrarás adicionalmente:

  • Parámetros de configuración específicos del tipo de visualización que se está viendo.
  • Algunos metadatos sobre tu test. En concreto, puedes ver el estado del test, cuanto tiempo ha estado en marcha, cuando se inició y el modo de finalización.
  • También se incluye la descripción y el ámbito del test.

Heatmap

Un heatmap es una representación gráfica que te permite identificar los puntos calientes de tu web. Es decir, las zonas que más llaman la atención a los usuarios. De esta forma podemos mejorar la usabilidad de la misma.

Si conocemos el comportamiento de los visitantes dentro de la web en relación a las imágenes, enlaces, vídeos, etc., podremos mejorar el aspecto de la misma para que el visitante se sienta más cómodo y así potenciar la conversión.

Resultados de un heatmap con Nelio A/B Testing.

Información mostrada

Al visualizar un heatmap, puedes configurar:

  • El nivel de opacidad de la página que se está visualizando. Cuanta más opacidad, más se destaca el heatmap.
  • La intensidad del calor: para ver los colores calientes con el grado de intensidad deseada.
  • La resolución: selecciona si deseas ver el heatmap de las visitas realizadas desde pantallas de ordenador, desde tablets o desde móviles.

Scrollmaps

Los scrollmaps se utilizan principalmente en páginas que tienen mucho scroll a fin de poder detectar el nivel de profundidad del scroll. Es decir, hasta qué punto llega el usuario al hacer scroll y cuál es el límite bajo el cual no existe navegación.

Resultados de un scrollmap con Nelio A/B Testing.

Información mostrada

Al visualizar un scrollmap, puedes configurar:

  • El nivel de opacidad de la página que se está visualizando. Cuanta más opacidad, más se destaca el heatmap.
  • La resolución: selecciona si deseas ver el scrollmap de las visitas realizadas desde pantallas de ordenador, desde tablets o desde móviles.
  • La leyenda del scrollmap: se indica la popularidad asociada a cada color.

Confeti

El confeti muestra los clics que se han realizado en la página seleccionada desglosados según el filtro que elijamos. De esta manera podemos ver no solo donde se hace clic, sino también cuándo, quién, cómo, etc. Es un informe clave para resolver algunas dudas más allá del volumen de clics.

Resultados de un heatmap con Nelio A/B Testing.

Información mostrada

Al visualizar un mapa de tipo confetti, puedes configurar:

  • El nivel de opacidad de la página que se está visualizando. Cuanta más opacidad, más se destacan los clics.
  • El filtro aplicado, entre los siguientes:
    • Tipo de Navegador utilizado.
    • País desde el que se accede.
    • Día de la semana en el que se realizó el clic.
    • Tipo de dispositivo utilizado.
    • Sistema operativo usado.
    • Hora del día en la que se realizó el clic.
    • Tiempo transcurrido desde que se ha cargado la página hasta hacer el clic.
    • Ancho de la ventana.

¿No sabes cómo mejorar tu web? Entonces necesitas Nelio A/B Testing

¡ECHA UN VISTAZO A NUESTROS PLANES!

El mejor plugin de test A/B para WordPress