1 abril, 2019

Si te preguntara ¿dónde están haciendo clics los usuarios de tu web? tal vez tu respuesta sea: en los enlaces.

Pero ¿y si te dijera que tus usuarios hacen clics en otras zonas de tu web no tan evidentes además de en los enlaces? ¿y si además te dijera que esta información te ayudará a entender a tus usuarios y mejorar tus ratios de conversión?

Los mapas de clics, en inglés clickmaps, nos dan información de dónde hacen clics nuestros usuarios (enlaces u otras zonas no enlazadas).

Para poder analizar estos datos de una forma cómoda y lo más sencilla posible, las herramientas de mapas de clics superponen estos mapas directamente sobre nuestra web y aplicaciones, haciendo mucho más intuitivo el análisis.

Resultado de imagen de heatmap neil

Créditos: crazyegg.com

Tabla de contenidos

¿Qué es un clickmap, en español, mapa de clics?

Un clickmap es una representación visual de dónde están haciendo clics nuestros usuarios. En dispositivos móviles se entiende como «clic» cuando el usuario toca su pantalla.

Por tanto, no deja de ser una potente herramienta de análisis y mejora de usabilidad. Con un mapa de clics podremos analizar el comportamiento de usuarios reales, sabiendo en dónde clican y analizando el porqué. La principal idea del análisis de los clickmaps es generar hipótesis que mejoren la arquitectura de nuestro sitio web o aplicación para mejorar la conversión.

Esta información es representada en un mapa de calor, en el cual las zonas más clicadas (calientes) aparecerán en colores rojizos y las menos clicadas (frías) en colores azules o sin color.

hotjar pc movil

Créditos: hotjar.com

Como ya podrás intuir, los usuarios no se comportan igual en PC que en Móvil o Tablet. Además, webs con tecnología responsive, cambian su contenido en función de las distintas configuraciones de pantalla o dispositivo por el cual se conecte el usuario. No tendría ningún sentido el ver un mapa de clics de una versión PC, superpuesta en nuestra web Móvil. De ahí que casi todos los proveedores de herramientas den opciones de segmentación por dispositivo. De esta forma podremos analizar cada uno de los dispositivos por los cuales se conectan los usuarios.

¿Cómo funciona un clickmap?

Técnicamente, cada vez que un usuario hace clic, o toca su pantalla en un móvil o tablet, la herramienta es capaz de recuperar el elemento HTML en el cual se ha hecho clic y generar en base a esto un mapa de calor superpuesto en nuestra web.

Algunas herramientas tienen limitaciones cuando de páginas SPA (Single Page Applications) se trata. En ocasiones la herramienta será incapaz de leer correctamente el HTML de la página debido a que éste se está generando de forma dinámica (no existen en la página y se van cargando cuando son necesarios).

Tecnologías como Ember.js, Angular.js o Vue.js, frameworks modernos de programación, están diseñados para trabajar bajo SPA, dando problemas a las herramientas de marketing para recopilar datos. Aunque no hay que preocuparse ya que algunas herramientas, que veremos más abajo, ya nos aportan soluciones para este tipo de tecnologías.

Clickmap elementos dinámicos

Créditos: luckyorange.com

Pese a que varía en función de la herramienta que estemos usando, generalmente los mapas de clics se representan bajo los siguientes colores:

  • Colores vivos, como rojos o amarillos: indican las zonas más clicadas por nuestros usuarios
  • Colores fríos, tales como azules o verdes: representan zonas con bajo interés de clic
  • Zonas sombrías: zonas sin clicar o ningún interés de clic

No sufras por los colores, normalmente los proveedores de estas herramientas ofrecen una leyenda en el análisis que nos ayudará a entenderlos.

Algunas herramientas, como Google Analytics, complementan estos clickmaps con leyenda en porcentaje, pudiendo analizar no solo por colores, sino con dato cuantitativo de qué porcentaje de usuarios está clicando en qué zonas.

Page Analytics (by Google)

¿Cómo analizar un clickmap?

Como ocurría con los scrollmaps lo primero que tenemos que hacer cuando queremos realizar el análisis es fijarnos en dónde están nuestros puntos fríos y dónde se sitúan nuestros puntos calientes. Así podremos empezar a extraer hipótesis de qué partes están generando más interés y cuales menos.

Análisis de puntos calientes

Ha llegado el momento de la extracción de hipótesis. Por el momento nos centraremos en los puntos más coloridos: rojos y amarillos. Estos puntos indican el contenido más relevante para el usuario ya que son los más clicados.

Llegados a este punto, una primera pregunta que debemos hacernos es ¿hay elementos que parecen estar siendo clicados y realmente no tienen ningún enlace o funcionalidad?. Parece obvio, pero algunos elementos tales como imágenes o textos pueden llegar a causar confusión al usuario y parecer clicables, cuando en realidad no lo son.

click-map elementos no clicables

Créditos: Optimizely.com

En el ejemplo superior, podemos observar que existen clics en los iconos y textos que explican las bondades del producto. Dichos iconos y texto no son clicables a pesar de que los usuarios están haciendo clics sobre ellos. Además, el único enlace disponible «Find out more» no parece que se lleve la mayoría de los clics.

Entonces ¿qué hacer cuando encontramos elementos sin funcionalidad que están siendo clicados? aunque no existe una única respuesta lo más común que se suele hacer en estos casos es cambiar el formato del elemento, eliminarlo o incluso enlazarlo. Si los usuarios quieren clicar ahí ¿por qué se lo vas a impedir?

Como siempre, mi recomendación: realizar un Test AB con la verificación de nuestras hipótesis.

Pero no todos los elementos no clicables y están siendo clicados suponen un problema. Una de las informaciones más valiosas que podemos extraer de un mapa de clics es lo que están leyendo nuestros usuarios.

usuario leyendo

Tal vez tú no lo hagas de forma habitual, pero gran parte de los usuarios tenemos por costumbre el subrayar aquello que vamos leyendo, concretamente aquella información que realmente nos interesa. Puede ser una práctica viejuna, del pleistoceno de internet con la cual me identifico, pero créeme si te digo que encontrarás clics en determinados puntos de texto en tus mapas de calor.

clickmap textCréditos heatmap.com

Por tanto, la información que podemos extraer aquí es qué partes son las más relevantes para nuestros usuarios. Entonces ¿qué podemos hacer con esto?

Tal vez remarcar dicho texto, reordenarlo para que sea más visible a primer nivel o incluso eliminar el resto que no está siendo de interés para el usuario sean las prácticas más habituales cuando nos encontramos clics en textos.

La infoxicación (o el tener demasiada información de nuestro producto o servicio) no es una buena forma de convertir, la mayoría de veces menos es más y una información concreta, de especial relevancia para nuestros usuarios, harán que piensen menos y vayan más a la acción.

Resultado de imagen de infoxicacion

Este tipo de análisis se encuentra con una limitación, en dispositivos móviles el usuario no remarca el texto con su dedo debido a la dificultad de hacerlo de forma cómoda. Aunque, como bien digo, supone una limitación, siempre podremos extraer hipótesis de lo que ocurre en PC para aplicarlas posteriormente en dispositivos móviles.

Otros puntos calientes en los cuales debemos poner atención son en aquellos que están próximos unos con otros. En el ejemplo de abajo se puede observar como los CTAs de la izquierda están compitiendo.

nurse clicmap

Créditos: crazzyegg.com

Aunque el CTA principal debería ser «Buy Unlimited CE Membership» ya que es la acción hacia compra, vemos que el CTA de «Browse Course Catalog» le está quitando protagonismo.

Continuando con el análisis de la imagen de arriba, podemos observar que hay clics en elementos no clicables (justo encima del CTA verde) y clics dispersos en las categorías de la derecha que están nuevamente compitiendo y perdiendo el foco del CTA de compra.

Por último vemos un interés nulo por el texto central explicativo del producto. Esto puede darnos algunas pistas del bajo interés que supone dicho texto.

Con todas estas hipótesis optaron por el siguiente rediseño que les dio un +15.6% de conversión. Puedes ver el caso completo aquí.

rediseno nurse

Créditos: crazzyegg.com

Para terminar la parte de la observación de puntos calientes, no nos podemos olvidar de los puntos de fuga. Un punto de fuga es aquel enlace que hace que el usuario pierda el foco de la conversión y acabe abandonando el proceso.

Enlaces del tipo «Salir» o enlaces hacia otras urls que no aportan valor a la conversión y distraen al usuario del objetivo son claros ejemplos de puntos de fuga.

Para identificar estos problemas tendremos que observar qué enlaces suponen un alto volumen de clics y si estos están aportando o restando valor a la conversión para posteriormente preguntarnos ¿realmente necesitamos que estén ahí?

Uno de los ejemplos mejor trabajados, que me encanta exponer, es Linkedin.

Linkedin quiere que hagas una tarea (objetivo): añadir a los contactos de tu email a tu red, para ello tiene un proceso sin puntos de fuga ni distracciones que, a mi parecer, resulta impecable:

linkedin punto de fuga

Aunque por un mero hecho de usabilidad exista el botón «Saltar» y el logo de Linkedin esté enlazado a su página principal, no encontraremos ni un solo enlace más, ya que se ha eliminado por completo la navegación de la cabecera y el footer. Además el foco está concentrado en el CTA principal «Añadir contactos».

Análisis de puntos fríos

Si los puntos calientes nos daban información de los puntos más clicados o los más interesantes para los usuarios. Con los puntos fríos vamos a conocer que contenidos son los menos relevantes para los usuarios o en los que menos atención muestra.

Para empezar analizando los puntos fríos tendremos que localizar aquellos contenidos que realmente fueron diseñados para la mejora de la conversión. Una vez identificados observaremos nuestro mapa de calor en busca de contenidos irrelevantes.

En el ejemplo, Hotjar observó que su vídeo promocional no estaba siendo visto por ninguno de los usuarios, de 7000 visitantes solo 3 hicieron clic en él.

hotjar pc movil

Créditos: hotjar.com

De aquí extrajeron dos hipótesis:

  • Los usuarios no están dispuestos a ver un vídeo sobre Hotjar y prefieren probar el producto
  • El icono del vídeo no es visible. De aquí se pueden extraer otras hipótesis secundarias tales como:
    • El contraste con la imagen de fondo es bajo
    • El tamaño del icono no es el correcto y apenas se diferencia del resto de la web
    • El icono no es representativo

Finalmente se decidieron por contrastar la primera hipótesis. Los usuarios no estaban dispuestos a ver un vídeo y preferían probar el producto. Por tanto rediseñaron la web y finalmente no incluyeron el vídeo, lo que dio lugar a un aumento significativo de las conversiones.

Como bien decía, los puntos fríos nos dan información de nuestro clickmap de las zonas menos relevantes para los usuarios. Con el ejemplo de Hotjar hemos visto que podemos identificar elementos, aparentemente importantes, que resultan de relevancia casi nula para el usuario.

Pero también podría darse el caso opuesto, elementos irrelevantes sin clicar.

Lo normal es que los elementos irrelevantes no sean clicados. Pero entonces, la pregunta es: si para nosotros son elementos irrelevantes, o elementos de relleno, y no están siendo clicados ¿para qué los necesitamos?

Más arriba, traté la infoxicación como un problema común en la conversión. Si existen elementos irrelevantes o de relleno, que no están siendo clicados, tal vez no haya necesidad de disponer de ellos. Aunque pudiera darse el caso que dichos elementos estén ahí por otros motivos (por ejemplo un texto para generar posicionamiento SEO, o un texto legal). En definitiva, tendremos que buscar el equilibrio entre conversión y otras disciplinas como el SEO.

Y por supuesto, siempre testando y midiendo los resultados de contrastar nuestras hipótesis.

Herramientas

En el artículo de mapas de scroll, hable sobre tres herramientas que nos permitían generar mapas de calor. En este artículo voy a recopilar otras tres que nos permiten generar mapas de clics, aunque cualquiera de las opciones habladas en el artículo anteriormente mencionado disponen de esta opción (clickmaps).

Google Analytics (Page Analytics by Google)

Page Analytics es una extensión ofrecida por Google que nos dará una aproximación a un mapa de clics basado en porcentajes. Aunque Page Analytics no es la mejor opción en cuanto a clickmaps se refiere, si es cierto que con un simple plugin, sin necesidad de instalar en nuestra web o app ninguna etiqueta más, podremos obtener el porcentaje de usuarios que clican en nuestros enlaces. De ahí que tenga cierto interés y haya decidido incluirla en el listado.

analytics by google

Para empezar a trabajar con Page Analytics las únicas dos cosas que tendremos que tener es:

  • Google Analytics instalado en nuestra web
  • La extensión para Chrome: Page Analytics

Para poder empezar a analizar qué porcentaje clica en nuestros enlaces lo único que nos queda por hacer es introducir la url de nuestro site en el navegador y el informe cargará de forma automática con la extensión.

Es importantes remarcar que Page Analytics solo nos dará la información de enlaces pero no de clics en otro tipo de elementos HTML.

Yandex Metrica

Si hablo de Google Analytics he de hablar de Yandex Metrica. Otra herramienta totalmente gratuita.

yandex metrica

Yandex Metrica (el Google analytics ruso) es una potente herramienta de analítica todo en uno. No solo podremos encontrar reportes de datos cuantitativos como lo hace Google Analytics, sino que además podremos activar opciones de mapas de calor tales como: mapas de scroll, mapas de clics o incluso replay de sesiones.

Si he de poner un «pero», sería la cesión de tus datos a los rusos, pero por el momento no tengo nada que esconderles 😉

Smartlook

Por último y no por ello menos importante, quería hablar sobre Smartlook.

smartlook logo

Muy similar a Hotjar, no deja de ser una joya en cuanto a analítica cualitativa se refiere. Como otras muchas herramientas cuenta con funcionalidades como: clickmaps, scrollmaps, replay de sesiones…

¿El precio? desde planes gratuitos hasta 598€ al mes, en función del volumen de usuarios que tenga tu negocio.

Conclusiones

Hemos visto que los mapas de clics son totalmente necesarios para analizar la experiencia de usuario y mejorar nuestra conversión.

Dan una información muy valiosa acerca de qué elementos son relevantes y cuales no, además de darnos el «porqué» de las acciones que los usuarios llevan a cabo en nuestra web o aplicación.

Para finalizar me gustaría resumir la parte más importante y la cual queda en el olvido por muchos: el análisis y la extracción de hipótesis.

Para llevar a cabo un correcto entendimiento de los datos y un buen análisis de un clickmap tendremos que responder a las siguientes preguntas:

  • Identificar puntos calientes:
    • ¿Son elementos clicables? Cabe recordar que en ocasiones los usuarios clicamos elementos pensando que son links o que tienen algún tipo de interacción. Los clics en elementos no clicables suponen una frustración para el usuario lo cual se traduce en una bajada de nuestra conversión
    • ¿Compiten nuestros CTAs? Centra el foco del usuario en la acción de conversión, cuida de los CTAs o enlaces que se distribuyen los clics de tus usuarios
    • ¿Existen puntos de fuga? Un punto de fuga es aquel  enlace que distrae al usuario del objetivo de la conversión sacándolo del proceso. Analiza si existen dichos puntos de fuga mediante zonas calientes en tus clickmaps y elimina aquellos que tengas la posibilidad de hacerlo
    • ¿Existen contenidos relevantes mal posicionados? Recuerda que un texto puede darnos las pistas de en qué está interesados los usuarios debido a que algunos usuarios subrayan con su ratón los contenidos que realmente les interesa. Trata dicho contenido como oro en paño y posicionalo visualmente de la mejor forma posible
  • Identificar puntos fríos:
    • ¿Hay contenidos irrelevantes? Los contenidos irrelevantes no aportan valor al usuario, aunque en ocasiones son necesarios (contenido SEO, textos legales…) trata de buscar el equilibrio entre conversión y otras disciplinas tales como SEO
    • ¿Hay contenidos importantes sin clicar? Si existen contenidos de tu clickmap sin clicar y crees que son relevantes para la conversión trata de modificarlos o exponerlos a primer nivel para que los usuarios lo vean. Si esto no te funciona entonces hazte la siguiente pregunta ¿realmente he de considerar ese contenido relevante? Tal vez no lo sea y estés obcecado en que sí lo es

Por último repetir, y resulta de vital importancia, el realizar nuestro análisis en las distintas configuraciones de pantalla. Los usuarios no interactuan (hacen clic o touch) de la misma forma en un móvil que en un PC. Analizando por las distintas configuraciones de pantalla extraeremos hipótesis para cada uno de ellos y otras muchas que podrán ser comunes a ambos.

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *