Tests AB con Nelio A/B Testing- Parte 1: Los mapas de calor

Soy un gran fan de los test AB, me encantan, tengo que reconocerlo. Considero que son un experimento apasionante y te permiten aprender muchísimo sobre el comportamiento del usuario. En particular sobre la UX de tu sitio.

Es cierto que no son milagrosos y que en ocasiones las diferencias medidas no son demasiado relevantes, pero otras veces son muy destacables y en todos los casos te permiten descubrir áreas de mejora potencial.

Sin embargo, no olvidemos que una estrategia de AB Testing siempre tiene que empezar por la identificación de un insight. Un detalle que te advierte sobre una oportunidad de mejora. Un cambio, una pista, que puede ayudarte a mejorar el rendimiento de tu sitio.

Antes de empezar a hacer tests a lo loco, hay que plantearse precisamente qué elementos vamos a testear y por qué. Para ello podemos fijarnos en informes analíticos habituales como aquellos que tienes disponibles en Google Analytics o incluso en Search Console.

Pero también podemos bajar a un nivel más cercano y visual a la web mediante los mapas de calor.

Los mapas de calor o heatmaps es una de las mejores herramientas para descubrir potenciales experimentos de test AB.

Qué son los heatmaps o mapas de calor

Los mapas de calor en analitica web nos permiten hacer tres cosas fundamentalmente:

  1. Pintar un mapa sobre una url de tu sitio registrando qué zonas de la página atraen más la atención del usuario. Esto lo muestran mediante colores, rojo más denso, azul menos denso.
  2. Pintar un mapa de clics sobre una url de tu sitio, qué zonas han recibido mayor densidad de clics por parte de tus visitantes.
  3. Pintar un mapa del scroll que hacen los usuarios, midiendo hasta donde se deslizan marcando diferentes densidades.

Como te imaginarás, de estos mapas podemos obtener mucha información útil. Cosas como:

  • Dónde se fijan más los usuarios.
  • Dónde no se fijan lo suficiente.
  • Si están haciendo clic en un área que no interesa.
  • Qué botones o enlaces llaman más la atención.
  • Si llegan o no hasta el pie de página.
  • O si no hacen clic en una llamada a la acción porque simplemente ni siquiera llegan a verla.

Cualquiera de estas reflexiones puede llevar asociado un test AB que nos ayude a optimizar esa situación. En el peor de los casos nos aportará una valiosa visión del contexto analítico.

Atención vs. puntero del ratón

Los experimentos con mayor presupuesto suelen realizarse en laboratorios donde un dispositivo físico realiza un seguimiento de la mirada del usuario para saber dónde y cuánto tiempo centra su atención.

Esto permite trazar mapas muy fiables y detallados.

Para la mayoría de los mortales esto se sale de nuestra capacidad y de nuestro presupuesto. Aunque con un poco de imaginación podemos acercarnos al mismo resultado.

Resulta que en la navegación con ratón (solo en ordenador, por tanto) existe una correlación bastante alta entre la posición del ratón y la mirada (la atención). Un estudio de la Carnegie Mellon University lo concreta en un más que razonable 88%.

A mi desde luego con eso me vale para casi todos mis proyectos.

Naturalmente este sistema pierde todo el sentido cuando hablamos del consumo móvil, ya que no contamos con puntero, sino solo el arrastre del dedo para hacer scroll.

Por otra parte el mapa de clics y de scroll siguen siendo útiles también en la versión móvil.

Mapas de calor con Aurora Heatmap

En un artículo anterior sobre plugins de analítica web hablaba de Aurora Heatmap. Se trata de un plugin muy interesante por lo sencillo que es de gestionar: Instalar, activar y ya empieza a pintar mapas de toda tu web.

En unos pocos días (siempre en función del volumen de visitas que recibas) podrás empezar a ver tus mapas de clics (no de atención ni de scroll).

No se registran el 100% de las visitas porque Aurora cuenta con algoritmo que selecciona las más representativas y parecen ser suficientes.

Como ves, cumple con uno de los criterios que buscábamos en el punto anterior y puede ser suficiente para algunos de los casos.

Sin embargo en mi opinión se queda un poco pobre. Por una parte carece de scrollmap y por otra mide todas las páginas de tu sitio. Esto puede traducirse en un consumo de recursos muy grande si recibes mucho tráfico (incluso a pesar del algoritmo).

Cuando en nuestro proyecto de medición sabemos o intuimos que vamos a utilizar un test AB, creo que es más interesante apostar por un plugin más completo y que ya incluye ambas herramientas: Nelio AB Testing

Mapas de calor con Nelio AB Testing

Nelio AB Testing es la herramienta profesional de realización de tests AB específica para WordPress más potente que existe. Además integra una maravillosa funcionalidad de mapas de calor tanto de clics como de scroll.

Por si esto fuera poco, los mapas de Confetti son un complemento tan atractivo que cuando los conozcas ya no podrás imaginarte un test sin ellos.

El único «problemilla» que tiene Nelio AB Testing es que aunque está disponible líbremente en el repositorio oficial de WordPress, su funcionalidad se reduce a muy pocos experimentos en su versión gratuita.

Es necesario recargar la cuota disponible para poder utilizar los recursos propios de los servidores de Nelio, que son los que se encargan de llevar todo el peso analítico, y mantener tu web lo más ligera posible. Se trata por tanto de un plugin de tipo freemium.

El plan más económico arranca en 29€/mes, que te permitirá testear hasta 5000 páginas vistas. Este es ideal para experimentos en tu propio sitio. Si lo que buscas es una solución para tu negocio como freelance o como agencia, tendrás que recurrir al plan Professional por 89€/mes o al Enterprise por 259€/mes.

Una vez instalado y activado el plugin podemos crear un nuevo experimento o test. Entre todos los disponibles, de momento nos interesa el Heatmap.

Configurar un mapa de clics no puede ser más sencillo. Solo necesitamos completar los siguientes campos:

  • Nombre del test: Te recomiendo que sea lo suficientemente descriptivo para poder identificarlo posteriormente porque estará unas semanas en marcha y puede mezclarse con más tests.
  • La página, entrada, custom post type o url que quieres medir.
  • La fecha de inicio y finalización del test, que también puede detenerse manualmente.
  • Una descripción de tu test.

En cuanto tenemos todo configurado, podemos lanzar el test.

En mi caso he sometido a este test a la página de about me que tengo en este mismo blog para ver si identifico qué partes son más relevantes para los lectores con el objetivo de mejorarla.

Con los datos que he recogido con unas cuantas visitas ya se puede empezar a vislumbrar cuáles son las zonas más relevantes.

Nelio te ofrece de salida el mapa de calor de clics para identificar los botones o enlaces de mayor valor para el usuario. Este mapa lo puedes combinar con el mapa de scroll para conocer las zonas que mayor interés despiertan.

Heatmap o mapa de clics

La primera pestaña del informe, la de heatmap, te ofrece dos controles que permiten acentuar o no la capa del mapa de calor que se solapa con la captura de pantalla de tu página. El objetivo de los mismos es mejorar la visibilidad. Este control está disponible en todas las diferentes vistas.

Existe otro control más que permite alternar entre los resultados de la vista de escritorio, tablet y móvil.

Bajo este área, se dispone un cuadro con los datos del experimento: páginas vistas, duración, fecha de inicio, de final y el cuadro con la descripción que hiciste al crear el experimento.

Finalmente en la pestaña Avanzado existe un control para re-posicionar los datos, que en ocasiones pueden haberse desplazado respecto al screenshoot.

El botón de Detener el experimento está en la zona superior derecha. Como puedes ver, todos los datos están disponibles incluso aunque el experimento siga rodadno.

En la imagen adjunta puedes ver qué zonas han atraído mayor interacción en la parte inferior de la página.

Scrollmap

En el mapa de scroll podemos ver las zonas de la página que más atención atraen en cuanto a volumen de usuarios.

Aunque con los colores del mapa podemos hacernos una idea general, desplazando el puntero por la captura de pantalla aparece una regla con el % de popularidad de esa zona.

En la siguiente captura puedes ver cuál es el área o párrafo que más interés suscita y que sería un buen candidato a probar en él una CTA.

Mapa de Confetti

El mapa de confetti es una maravilla que permite escoger diferentes dimensiones y conocer sus métricas y zonas de clic segmentadas.

Por ejemplo, en la captura puedes ver un mapa con el momento del clic, es decir, cuánto tiempo llevaba en la página el usuario cuando ha hecho clic en una zona en concreto.

Las posibilidades son muchas: el ancho de la ventana en píxeles, los días de la semana, la hora, el navegador usado, país, SO o el tipo de dispositivo.

De esta forma puedes descubrir si hay diferencias en alguna dimensión e identificar problemas u oportunidades interesantes.

Por ejemplo, podrías descubrir que hay días de la semana en los que hay un mayor interés en determinados widgets o comparar las zonas de interés entre móvil y escritorio.

Es cierto que muchas de las relaciones que nos muestra el mapa de confetti pueden ser obtenidas haciendo comparativas en Google Analytics, pero verlas en un mapa es mucho más cómodo y visual. No descartes tampoco descubrir clics en zonas que no son enlaces y el interés que esto pude tener.

En este sentido tengo que decir que hay algunos clics «raros» que son difíciles de interpretar. Algunos de ellos considero que se pueden achacar a clics para llevar el foco a esa ventana y ciertas costumbres de navegación de algunos usuarios con dispositivos táctiles. Pero es difícil saberlo a ciencia cierta.

Respecto a los datos obtenidos y como simple ejemplo, en mi caso, con la dimensión Momento de clic hay un trío de datos curiosos:

  • Las visitas de mayor duración (más de 2′) se interesaron por mi perfil en Mastodon.
  • Ha habido varios clics en la herramienta de configuración de las cookies
  • Se hace uso del widget de menú de categorías para leer más contenidos del sitio

Las interpretaciones pueden ser variadas:

  • curiosidad por una red poco conocida como Mastodon ¿un post sobre ella, quizás?
  • curiosidad por saber qué plugin uso para las cookies ¿un tutorial de GDPR Cookie Compliance?
  • y la tercera mucho más relacionada con el interés que puede suscitar los temas sobre los que escribo habitualmente y de donde seguro que puedo sacar mucho más valor.

Tutorial en vídeo

Aunque la herramienta es realmente sencilla de utilizar, te he grabado este vídeo donde puedes ver de principio a final cómo se crea un experimento de mapa de calor con Nelio AB Testing y cómo se muestran los resultados del mismo.

Conclusiones

Poner en marcha un Heatmap de cualquiera de las páginas de tu sitio web no puede ser más fácil. Con un par de clics lo tendrás funcionando y en unos días puedes empezar a sacar conclusiones. Y una de las cosas más chulas es que no hace falta parar el experimento para ir viendo los resultados.

Sin embargo tampoco es recomendable dejarlo abierto indefinidamente. Estas cosas consumen recursos y tienen cierta repercusión en el rendimiento de la página.

Puedes ver a continuación una comparativa simple realizada con GTMetrix donde podemos ver el impacto de tener el experimento en marcha. En este caso en concreto la misma página es un 30% más lenta con la medición del mapa de calor funcionando.

La diferencia es notable, aunque tampoco me parece dramática teniendo en cuenta lo que puede repercutir en el diseño basado en datos para tu sitio.

El plugin desarrollado por el equipo de Nelio Software me parece, de largo, el más completo para esta tarea. Algo que a priori pudiera parecer un complemento de los test AB, se ha convertido en uno de los experimentos más interesantes que podemos llevar a cabo con su herramienta Nelio AB Testing.

Sé que el mayor handicap que tiene el plugin es que se trata de un servicio premium, de pago. Sin embargo la mayoría de desarrollos de calidad orientados a conversión, ecommerce y rendimiento comercial, son de ese tipo. Naturalmente.

La parte buena es que puedes probarlo líbremente con la versión del repositorio oficial. La mala es que si te gusta, tendrás que pagarlo. Siendo justos, un mes de experimento en un único sitio puede costarte unos 29€. Creo que es más que razonable por el rendimiento que le puedes sacar.

Y si eres una agencia, seguramente ya estás pagando por herramientas parecidas en otras áreas como el SEO, por ejemplo.

Próximamente continuaré con esta serie analizando otros tipos de experimentos con Nelio AB Testing. Sus posibilidades son enormes y tenemos que aprovecharlas para mejorar nuestros sitios web.

Nos vemos en el próximo post.

Deja un comentario