Un mapa de calor es una herramienta extremadamente valiosa para cualquiera que tenga un sitio web.
Los mapas de calor son una representación visual de los datos cruciales del sitio web. Con solo una imagen simple, podrá determinar qué está funcionando con su sitio web y qué necesita mejorar.
Una de las mejores partes del uso de un mapa de calor es que no tendrá que pasar por una sobrecarga de números o perder tiempo tratando de descifrar hojas de cálculo complejas. Los mapas de calor son simples. Cada jefe, cliente o cualquier persona, para el caso, puede comprender los resultados.
Con los informes de mapas de calor, tendrá una representación clara de cómo los visitantes interactúan con su sitio web.
Después de determinar dónde las personas concentran la mayor parte de su atención en su sitio, puede usar esa información para optimizar las conversiones. Ya sea eliminando las distracciones de una página que podrían estar obstaculizando sus tasas de conversión o moviendo un botón de CTA, los mapas de calor mejoran el CRO con informes visuales basados en datos.
Crear un mapa de calor es fácil. De hecho, puede crear uno en línea en menos de 15 minutos, de forma gratuita.
Para aquellos de ustedes que nunca han hecho esto antes o simplemente necesitan orientación adicional, los guiaré a través del proceso paso a paso para crear un mapa de calor.
Paso #1: crea una cuenta de Webinpixels
Hay un puñado de herramientas de mapas de calor de buena reputación en la web, pero Webinpixels será su mejor opción. Esto es especialmente cierto para aquellos de ustedes que desean crear un mapa de calor de forma gratuita.
Más de 300 000 empresas confían en Webinpixels para los informes de mapas de calor, incluidas marcas globales como Dell, Yahoo, Etsy, Intuit Mint, Optimizely y Twillo.
Registrarse en una cuenta de Webinpixels es simple. Simplemente ingrese su dirección de correo electrónico y cree una contraseña. Incluso puedes registrarte usando tu cuenta de Google con solo un clic.
Cada nuevo plan Webinpixels viene con una prueba gratuita de 30 días. Este es tiempo más que suficiente para crear tantos mapas de calor como necesite y probar la herramienta antes de decidirse a comprometerse.
Después de crear una cuenta, se le pedirá que elija un plan. Los planes se basan en páginas vistas mensuales, grabaciones mensuales y almacenamiento.
El plan de nivel de entrada comienza con 30 000 páginas vistas, 100 grabaciones y tres meses de almacenamiento. La opción de nivel superior llega hasta 500 000 páginas vistas, 5000 grabaciones y dos años de almacenamiento. Incluso hay un plan personalizado para cualquiera que necesite más que esto.
Seleccione la opción que más se alinee con el tráfico mensual de su sitio.
Paso #2: Instale el script de seguimiento
Una vez que haya creado una cuenta, Webinpixels le pedirá que instale un script de seguimiento en su sitio web. Este código se conectará con Webinpixels, lo que permitirá que la herramienta recopile datos de su sitio.
Hay algunas formas diferentes de instalar el script de seguimiento. Así es como se verá la pantalla cuando llegue a esta etapa:
Estas son las tres formas de instalar su código de seguimiento:
- Hazlo tu mismo.
- Haga que su desarrollador (o alguien más en su equipo) lo haga.
- Integrar con una aplicación de terceros.
Las tres opciones son muy sencillas. Todo depende de tu nivel de comodidad y conocimientos técnicos. Pero incluso si no tiene experiencia en desarrollo, puede instalarlo fácilmente por su cuenta. Para aquellos de ustedes que se sienten más cómodos enviándolo a su desarrollador, está bien.
Le daré un desglose rápido de cada opción para que pueda decidir cuál es mejor para usted.
Instale el código de seguimiento usted mismo
Si elige la primera opción, accederá a una pantalla que se ve así:
Webinpixels generará automáticamente un código de seguimiento. Simplemente copie el código y péguelo en la sección
de su sitio web después de sus etiquetas .Aquí hay un ejemplo de cómo se verá ese script de seguimiento después de que se haya instalado en su sitio web.
Como puede ver, pegué esto en la última línea de la sección principal después de las etiquetas meta. Si sabe cómo encontrar y editar el código HTML en su sitio, este método es simple y directo.
Luego regrese a Webinpixels y haga clic en «Comprobar mi instalación» para verificar que se haya instalado correctamente.
Haga que un desarrollador instale el código
Si no se siente cómodo haciendo esto manualmente por su cuenta, o prefiere que su desarrollador lo haga, puede enviarles un correo electrónico simple con todas las instrucciones que necesitan.
Simplemente haga clic en la segunda opción y complete los siguientes datos:
Este proceso será sencillo para cualquier desarrollador. Tendrán el script de seguimiento instalado en su sitio en menos de 60 segundos.
Integrar con una aplicación de terceros
Otra forma sencilla de instalar el script de seguimiento en su sitio web es mediante la integración con la plataforma CMS que está utilizando para administrar su sitio web.
Simplemente seleccione una aplicación de la lista para continuar:
Las instrucciones variarán ligeramente según la plataforma que esté utilizando. Independientemente de lo que haga clic, Webinpixels le mostrará automáticamente las instrucciones paso a paso para una instalación sin código.
Por ejemplo, si está utilizando WordPress, las instrucciones lo guiarán para agregar el complemento Webinpixels desde su panel de control de WordPress. Squarespace requiere que cambies algunas de tus configuraciones avanzadas. Shopify te dirige a la tienda de aplicaciones. Wix te envía a su página de integraciones de marketing.
Independientemente de la plataforma que esté utilizando, el proceso de integración de la aplicación debería tardar unos minutos como máximo en configurarse. No tendrá que tocar el código HTML de su sitio si sigue esta ruta.
Paso #3: crea una instantánea
Una vez que se haya instalado el script de seguimiento, estará listo para crear su primera instantánea. Una instantánea le da acceso a cinco informes de datos diferentes: mapa de calor, mapa de desplazamiento, confeti, superposición y lista.
A los efectos de este tutorial, nos centraremos en el informe de mapa de calor.
Primero, decida si desea crear una instantánea o varias instantáneas. La mayoría de la gente elige el último de los dos, pero uno está bien por ahora si es tu primera vez y todavía te estás mojando los pies.
Para nuestros propósitos aquí hoy, pasaré por el proceso de creación de una instantánea, para que tenga una idea clara de cómo configurar esto.
Webinpixels lo guía a través de cada paso con campos de formulario fáciles de seguir. Comience ingresando la URL de la página para la que desea crear un mapa de calor. Luego asigne un nombre a la instantánea (página de inicio, página de precios, página de preguntas frecuentes, etc.) y elija el motivo para crearla.
Estas son las razones que tiene para crear una instantánea:
- Abrir una página por primera vez
- Rediseño de una página existente
- Establecer una línea de base para el monitoreo continuo
- Inspiración para nuevas ideas
- Inseguro
Después de completar estos tres campos de formulario rápido, determine para qué dispositivos desea crear instantáneas. De manera predeterminada, obtendrá una instantánea para computadoras de escritorio, tabletas y dispositivos móviles.
Recomiendo mantener esto habilitado. Pero si lo desactiva, puede rastrear las instantáneas y el tráfico solo para dispositivos específicos.
A continuación, determinará cuándo desea que comience y finalice la instantánea.
Puede iniciarlo inmediatamente o comenzar en una fecha y hora programadas. De forma predeterminada, la instantánea finalizará en 60 días a partir de la fecha de inicio o una vez que la página obtenga 25,000 visitas. Pero puede personalizar esta configuración para finalizar la instantánea en un día y hora personalizados o cuando la página alcance un número específico de visitas.
Hay otras configuraciones avanzadas que también puede personalizar. Por ejemplo, puede cambiar la relación de muestreo. En lugar de realizar un seguimiento de cada visita, puede realizar un seguimiento de cada una de cada cinco visitas o de una de cada diez visitas. Puede omitir las ventanas emergentes y establecer otras reglas de seguimiento de URL personalizadas también.
Pero por ahora, recomendaría seguir con la configuración predeterminada. Realmente no hay razón para perder el tiempo con estas cosas en este momento, especialmente para sus primeras instantáneas.
Paso #4: Analice los datos de su mapa de calor
Las instantáneas del mapa de calor le brindarán información valiosa relacionada con el diseño, la copia, el diseño y otros factores de su sitio que afectan las conversiones.
Las áreas más brillantes del informe visual significan calor (de ahí el nombre). Estas son las áreas más populares de la página. Las áreas más oscuras de la pantalla son menos populares. A medida que ciertas áreas de su página obtengan más clics, los colores en su mapa de calor cambiarán.
Aquí hay un ejemplo de cómo se ve un informe de mapa de calor completo:
Si miras la parte superior de la pantalla, verás que tardó 47 días en llegar a las 25.000 visitas en esta página. Por defecto, esto completará la prueba. Pero puede cambiar esa configuración según sus necesidades, como describí anteriormente.
Hubo 30.855 clics rastreados en esta página durante ese tiempo. Como puede ver, los puntos brillantes son los más calientes.
Este informe de mapa de calor está superpuesto con la función de mapa de desplazamiento. Eso es lo que muestra la barra en el lado izquierdo del informe. Para eliminar esto, simplemente desmarque la casilla «capa con mapa de desplazamiento» en la parte superior izquierda de la pantalla.
Me gusta mantener habilitado el mapa de desplazamiento cuando veo un informe de mapa de calor. Estos dos elementos visuales proporcionan información valiosa cuando se usan en paralelo.
Por ejemplo, determina las áreas de la página donde los usuarios se desplazan, pero no hacen clic. Este sería el lugar perfecto para agregar un nuevo CTA o cambiar el que está allí y no funciona. Podrá dirigirse a diferentes tipos de usuarios en función de su nivel de compromiso. Por lo tanto, la CTA para los usuarios que llegan a la mitad de una página puede ser diferente de la CTA en la parte superior de la página.
También puede ajustar el contraste del informe con la barra deslizante en la parte superior derecha de la página.
Si ciertas áreas de sus páginas tienen menos clics que otras, puede experimentar agregando nuevos enlaces, CTA o títulos a esas áreas para atraer más atención y conversiones.
Para aquellos de ustedes que acaban de crear un nuevo mapa de calor y están esperando datos para analizar, pueden jugar con demostración de huevo loco mientras tanto.
También vale la pena señalar que no tiene que esperar hasta que se haya completado un informe para verlo. Siempre puede verificarlos en tiempo real navegando al menú «Instantáneas» de su tablero de Webinpixels, que se puede encontrar en el lado izquierdo de la pantalla.
Paso #5: Haz cambios basados en los resultados del mapa de calor
Técnicamente, su mapa de calor ya se ha creado en este punto. Pero es importante que comprenda qué hacer con los datos.
Lo que destaca de Webinpixels en comparación con otras herramientas de mapas de calor en el mercado es que tiene pruebas A/B integradas. Por lo tanto, no tendrá que usar una aplicación o plataforma de terceros para experimentar con los cambios.
Siempre debe aprovechar la herramienta de prueba A/B cada vez que realice nuevos cambios en su sitio web. Los datos de la prueba A/B le dirán si sus cambios realmente marcaron la diferencia.
Como puede ver en el informe de ejemplo anterior, la página de variantes tuvo una mejora del 16,83 % con respecto a la página de control.
Solo asegúrese de probar solo una variante a la vez. De lo contrario, no sabrá qué cambio provocó los resultados.
Este será un proceso continuo. Incluso después de ejecutar un mapa de calor para una sola página, siempre hay margen de mejora. Es por eso que las pruebas A/B son tan útiles.
También querrá continuar ejecutando diferentes informes de mapas de calor para otras áreas de su sitio web más allá del informe inicial. A medida que su sitio web escala, siempre tendrá nuevas páginas para analizar.
Si has estado siguiendo esta guía, ya deberías tener tu primer mapa de calor creado. No te ha costado ni un céntimo, y lo has podido hacer en 15 minutos, como máximo. Esperar los resultados del informe llevará algún tiempo, dependiendo de su configuración.
Ahora puede regresar y repetir este proceso para otras páginas de su sitio web. Incluso puede experimentar con la capacidad de crear múltiples instantáneas simultáneamente, como expliqué en el paso 3.
Si no estabas siguiendo, aún puedes registrarte para una prueba gratuita de Webinpixels. Luego use esta guía como referencia para crear su primer mapa de calor.