11 marzo, 2019

¿Leen mis usuarios todo el contenido de una página? ¿Existen contenidos irrelevantes? ¿Hay contenidos persuasivos que no están siendo visualizados? Estas son solo algunas de las preguntas que puedes llegar a plantearte cuando intentas extraer hipótesis para mejorar la conversión de tu sitio web o aplicación.

Para dar una respuesta a éstas y otras muchas preguntas existe una herramienta súper potente que te ayudará a entender el comportamiento de tus usuarios. Los mapas de scroll, también conocidos como mapas de desplazamiento, nos dan una visualización de qué partes de la página están siendo más visualizadas por los usuarios (calientes) y cuales no (frías).

scroll-map-header

El objetivo de un mapa de scroll es dar las pistas para, en base al análisis, extraer hipótesis para la mejora de la experiencia de usuario con el fin de mejorar tu conversión.

En el artículo de hoy abordaremos las distintas formas que tenemos de interpretar un mapa de scroll y las tecnologías que nos lo ofrecen.

Tabla de contenidos

¿Qué es un mapa de scroll o mapa de desplazamiento?

El mapa de scroll, o mapa de desplazamiento, es un tipo de mapa de calor que muestra de una forma visual hasta qué puntos se desplazan nuestros usuarios en una página web. Por tanto, representa las partes más vistas de nuestra página (calientes) y las menos visualizadas (frías).

Como es lógico, el desplazamiento que los usuarios hacen en un PC no es similar al que hacen en otros dispositivos como móviles o tablets. Las webs responsive adaptan la estructura del contenido a las diferentes configuraciones de pantalla del dispositivo por el cual se conectan los usuarios, de ahí que el contenido no se visualice de igual forma.

mapa de scroll pc y móvil

Créditos: Smashingmagazine

La mayoría de los proveedores de herramientas, que analizaremos más abajo, tienen opciones de segmentación por tipo de dispositivo. De esta forma podremos analizar correctamente el mapa de scroll para las distintas configuraciones de pantalla, analizando qué ocurre con la visualización del contenido en cada una de ellas.

Entendiendo los mapas de scroll

Aunque varía según el proveedor que estemos usando, normalmente los mapas de scroll representan los puntos más calientes, o los más visualizados por los usuarios, de color rojo (en algunos proveedores blanco o amarillo). Y las zonas más frías, o las menos visualizadas, quedan representadas con un color azul. No te has de preocupar por los colores, las herramientas de mapas de scroll disponen de una leyenda explicativa de los mismos.

Algunas herramientas ofrecen otro sistema de representación basado en porcentajes. Con este sistema podríamos llegar a observar qué porcentaje, del total de usuarios que entren a una página web o aplicación, han llegado a visualizar qué partes.
mapa de scroll porcentaje

Las herramientas de este tipo de tecnología conforman el reporte en base al dato de cuanto scroll han hecho los usuarios en nuestras webs. Esto quiere decir que, aunque el usuario haya bajado su scroll un número de píxeles determinado, no nos podemos asegurar que el usuario haya prestado atención a ciertos elementos.

Estas herramientas no realizan un eyetracking del usuario. Por tanto, el hecho de que un mapa de desplazamiento nos indique que un usuario ha hecho scroll hasta una sección concreta de la página, no nos garantiza que éste haya prestado atención al contenido.

Los usuarios no navegamos de forma impredecible, los comportamientos que tenemos se repiten a lo largo y ancho de internet.

Cuando bajamos el scroll es porque visualizamos ciertas partes de una web y les prestamos atención. Aunque unos pocos usuarios puedan navegar de forma inusual, el agregado de todos los usuarios (lo que miden estas herramientas) nos reflejará el comportamiento natural de prestar atención cuando se visualiza una parte de la página. Por tanto, en nuestros análisis mantendremos la premisa de que si el usuario ha llegado a visualizar un contenido concreto es porque le ha prestado atención.

¿Cómo analizar un mapa de scroll?

El primer paso para interpretar un mapa de scroll es identificar los puntos más calientes y los más fríos. De esta forma atacaremos el problema desde una vista más global, para posteriormente avanzar en el análisis e ir profundizando y extrayendo nuevas hipótesis.

Analizando los puntos calientes

Los puntos calientes, normalmente están representados por colores intensos como el rojo, en otras herramientas por blanco. En el momento de la realización de un análisis nos tendremos que preguntar ¿Dónde están nuestros puntos calientes?

Ahora debemos observar qué hay en las zonas más vistas por los usuarios. En este momento nos tendremos que preguntar si el contenido que están viendo nuestros usuarios es el contenido que realmente queremos que vean. Contenidos relevantes o persuasivos, contenidos que sean un motivador de la acción (conversión) deberían ser los más vistos por nuestros usuarios.

En el siguiente ejemplo podemos observar que el contenido más visto es la zona blanca en donde aparecen las ilustraciones. Siendo el contenido más visto ¿por qué no existen CTAs?

Mapas de scroll no CTA

Créditos de la imagen: koozai

Aunque el siguiente paso sería observar mediante un mapa de clics si esos elementos están siendo clicados, una primera hipótesis que podríamos extraer es que añadiendo CTAs justo en los componentes más visibles, tal vez debajo de las ilustraciones, mejoraremos la conversión.

Si por el contrario existen puntos calientes que, a pesar de no ser demasiado relevantes a nuestro parecer, están siendo visualizados por nuestros usuarios, también podremos extraer nueva información de ellos. Tal vez exista contenido el cual sí que sea relevante para el usuario y con el que nosotros no sabíamos que lo fuera.

En el siguiente ejemplo, nuevamente se observa (en blanco) que el foco de atención está puesto sobre el contenido de los puntos, justo donde aparece la imagen con el texto “Digital Marketing this week”. A pesar de que el diseñador intentó atraer el foco de atención mediante flechas hacia los CTAs, los usuarios centraron su atención en el contenido central, el cual no tiene llamadas a la acción.

Mapas de scroll

Créditos: seriouslysimplemarketing

A continuación, otro ejemplo en el cual, entre el 25% y el 50% de los usuarios no están visualizando el CTA principal:

Mapas de scroll

Créditos: oddodesign 

Por último hay que pensar que el hecho de que un usuario visualice cierto contenido no es un indicador de que éste contenido sea relevante.

¿Qué ocurre cuando nuestros usuarios tienen problemas en la comprensión? Cuando un usuario tiene un problema en la comprensión de un texto o una imagen lo normal es que la relea o incluso trate de visualizarla varias veces, si es el caso de una imagen. El hecho de que una zona sea caliente no implica que el contenido sea especialmente relevante. Podría darse el caso de que el contenido sea poco inteligible y que el usuario necesite múltiples visualizaciones para entenderlo.

Analizando los puntos fríos

A modo inverso al que lo hacen los puntos calientes, los puntos fríos nos dan información del contenido menos visualizado. Aunque el análisis de los puntos fríos suele ser el más olvidado, tiene tanta o incluso más importancia que el análisis de los puntos calientes.

¿Hay elementos persuasivos o motivadores de conversión que no están siendo visualizados por los usuarios? El ejemplo muestra contenidos como el social proof, que tienen un carácter motivador para la conversión, no están siendo visualizados:

Mapas de scroll

Créditos: Ladrupalera

Otro problema que se suele encontrar de forma habitual es el denominado falso suelo. El falso suelo suele originarse en aquellas webs que, debido a su diseño, no parece que haya nada más below the fold. El mapa de desplazamiento es la herramienta con más utilidad a la hora de identificar esta tipología de problemas.

falso suelo mapa de scroll

Créditos: postmm

En la imagen anterior, se observa un claro falos suelo, a pesar de que hay contenido bajo la linea de flotación, los usuarios no parece que bajen para nutrirse de información. De este mapa de scroll no solo podemos detectar el aparente problema con el falso suelo, sino que además se observa que gran parte de los usuarios no llegan a ver lo que parece ser la principal llamada a la acción: los tres campos más el CTA de búsqueda.

Antes de pasar a la solución del problema del falso suelo tendremos que preguntarnos si realmente es un problema. ¿Necesitamos que el usuario lea toda o gran parte de la página? Tal vez nuestro contenido above the fold sea lo suficientemente potente y por sí solo haga que el usuario no necesite más información para convertir.

Entonces ¿cómo identificamos si es un problema? para consolidar la hipótesis de que el falso suelo esté suponiendo un problema, podremos analizar métricas como el ratio de rebote o la tasa de salidas de la página.

Si finalmente, tras analizar otras métricas, detectamos que es un problema podríamos solucionarlo mediante técnicas tales como:

  • Cambiar la distribución de las imágenes y el texto para que sea visible el corte y forzar al usuario hacer scroll para terminar de ver el contenido (véase imagen 1)
  • Generar un botón o animación de “hacer scroll” o “ver más” (véase imagen 2)

ejemplo scroll

ejemplo scroll animación

Herramientas

En el mercado existen multitud de herramientas que nos proporcionarán mapas de scroll. Aunque en otros artículos detallaré otras, hoy nos centraremos en tres:

Hotjar

La herramienta de analítica cualitativa para startups y pymes por excelencia.

hotjar logo

Hotjar podría ser la herramienta más conocida que realiza este tipo de análisis. A parte de funcionalidades como: replay de sesiones, mapas de clics o encuestas. Hotjar cuenta con un plan gratuito de un máximo de 3 mapas de desplazamiento. Además cuenta con planes económicos que arrancan desde los 29€.

CrazyEgg

Aunque CrazyEgg no cuenta con planes gratuitos, podemos empezar una prueba de 30 días con cancelación en cualquier momento. A partir de los 30 días, tendremos que pagar uno de sus planes que van desde los 24€ hasta los 249€. En función de las necesidades de nuestra web o aplicación podremos optar por el plan que más nos interese.

Crazyegg logo

Al igual que Hotjar, CrazyEgg nos da otra información de varios tipos de mapas de calor, incluido el mapa de scroll, a parte de otras funcionalidades como el replay de sesiones. CrazyEgg lleva operando en el mercado desde 2005 y su fundador, Neil Patel, es una de las personas más influyentes a nivel mundial en el campo del Marketing Digital. Esto ha hecho de CrazyEgg una herramienta puntera en el mercado y con grandes estándares de calidad.

Inspectlet

Por último y no por ello menos importante, es el turno de Inspectlet.

Inspectlet logo

Otra herramienta “todo en uno” para la optimización que nos da funcionalidades interesantes como: mapas de calor, session replay, encuestas, análisis de formularios o incluso AB Testing. Cuenta con un plan gratuito muy interesante, suficiente para un blog, un pequeño ecommerce o una web corporativa. Si queremos una herramienta centralizadora de todas nuestras palancas de optimización Inspectlet es una de las mejores opciones disponibles en el mercado.

Conclusión

Hemos visto la potencia de los mapas de scroll y cómo estos nos ayudan en mejorar la experiencia de usuario para obtener una mejor conversión. A continuación se enumeran una serie de preguntas a tener en cuenta a la hora de realizar nuestras hipótesis mediante el estudio de estos mapas:

  • Identificar puntos calientes
    • ¿Son de interés para el usuario?
    • ¿Existe un problema en la comprensión?
  • Identificar puntos fríos
    • ¿Existen contenidos persuasivos, como social proof, que no son leídos?
    • ¿Hay contenido relevante bajo el suelo?
  • Identificar falsos suelos
    • ¿El usuario ha leído toda la página?
    • ¿Existe un problema con el above the fold?
  • Identificar nuestros CTAs
    • ¿El usuario los ve?
    • ¿Es la mejor posición para ellos?
  • Bonus, análisis por segmentación:
    • Analizar para las dimensiones de pantalla (web responsives)
    • Analizar qué vieron los usuarios que convirtieron y los que no lo hicieron. De esta forma podemos extraer hipótesis de qué contenido es relevante para la conversión y cual no

Ahora que ya sabes la potencia de los mapas de desplazamiento es hora de ponerlo en práctica. Si tienes dudas estaré encantado de resolvértelas en los comentarios.

Deja un comentario

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