El event tracking (o seguimiento de eventos) te puede servir para rastrear el envío de un formulario de contacto, el clic en un enlace del menú, la descarga de un fichero… y en definitiva cualquier clic que un usuario pueda hacer en tu web.
En este artículo verás las distintas posibilidades que tienes para realizar el seguimiento de estos eventos y comprenderás las ventajas de realizar el seguimiento con Google Tag Manager en vez de utilizar Universal Analytics.
¿Cuando utilizaremos tags?
En ocasiones, la realización de una acción por parte del usuario generará la carga de una página del sitio (o la recarga de la actual).
Cuando es así, esta carga quedará registrada en Analytics, de forma que en este caso podremos realizar el seguimiento de nuestra campaña prescindiendo de las etiquetas.
Sin embargo, en muchas ocasiones, la realización de una acción por parte del usuario no implica la carga de una nueva página de nuestro website. Es así, por ejemplo, cuando pulsas sobre un enlace externo, cuando añades un producto al carro de la compra o cuando descargas un documento en pdf,… pues son acciones que no necesariamente requieren la carga de una nueva página, pero cuyo seguimiento nos podría aportar un gran valor analítico.
En estos casos, en los que no se carga una nueva página, es en los que tendremos que implementar etiquetas de seguimiento.
¿De que formas podemos implementar etiquetas de seguimiento?
Las formas en las que podremos utilizar etiquetas para la gestión de nuestras campañas es:
- Insertando el propio código de seguimiento de eventos de Universal Analytics en el código de nuestra web.
- Utilizando las etiquetas de Google Tag Manager.
- Utilizando otro gestor de tags como por ejemplo Open Tag o Adobe Dynamic Tag Mangement…que este no es el único administrador de tags (aunque estos no los vamos a tratar aquí)
Insertando manualmente el código de Universal Analytics
Insertar el manualmente el código es realmente sencillo. Supongamos que por ejemplo quieres hacer el seguimiento de las descargas del pdf de un manual de instrucciones:
ga('send','event','link','download','instrucciones') Si tienes un enlace al documento tal y como:
<a href="instrucciones.pdf" target="_blank">Descargar Manual</a>
Simplemente tendrías que poner:
<a href="instrucciones.pdf" target="_blank" onclick="ga('send','event','link','download','instrucciones')>Descargar Manual</a> Sencillo ¿verdad? Tanto es así que quizás te estés preguntando: entonces…
¿Por qué utilizar Google Tag Manager si lo puedo hacer con Universal Analytics?
Google Tag Manager es un gestor de etiquetas de seguimiento que Google lanzó a finales de 2012 para facilitar la implementación de etiquetas sin tener que modificar el código. Así, la primera ventaja de Google Tag Manager frente a Universal Analytics es que te ayudará minimizar las modificaciones en el código de nuestra web.
La idea es que, colocando un pequeño código Javascript en cada página, puedas definir, implementar y modificar todas las etiquetas de seguimiento que quieras desde fuera… desde tu cuenta de Google Tag Manager.
Si quieres puedes echarle un vistazo a este vídeo de introducción que Google publicó para presentar GTM.
Son muchas las ventajas de utilizar las etiquetas de Google Tag Manager en vez de las de Universal Analytics, pero yo sin duda destacaría tres:
1) Independencia del equipo de desarrollo = flexibilidad + eficacia
Las etiquetas que usabas en Google Analytics o en Universal Analytics tenían un gran inconveniente: había que insertarlas en el código. Esto te hacía depender del equipo de desarrollo web que necesitaba un tiempo para implementar todos esos ‘pedacitos’ de código que te permitían hacer que el seguimiento de una campaña, haciendo que la puesta en marcha de esta se retrase demasiado.
Con Google Tag Manager tan solo tendrás que implementar el código del contenedor en las páginas.
El resto se hace desde el propio GTM. Con esto ganarás cierta independencia del equipo de desarrollo y te dará una mayor flexibilidad y capacidad de reacción al administrar tus campañas.
2) Código más limpio y ligero
Lo único que añadiremos a nuestras páginas será el código del contenedor, con lo cual nos evitamos ‘manchar’ el código de nuestra página con pequeños trocitos de texto para cada enlace, botón,…
3) Mayor velocidad de carga
Google Tag Manager activa las etiquetas de forma asíncrona por lo que no ralentizan la carga de la web como en el caso de las anteriores.
Estructura de Google Tag Manager
Dentro de la estructura de Google Tag Manager tenemos que distinguir 4 elementos distintos (o 4 niveles si prefieres):
Container
El container es el código javascript (tag) que incluiremos en nuestra web. Se trata de un código único. Una vez que lo incluimos en el código de la web administraremos las etiquetas que este ‘contiene’ desde Google Tag Manager.
Esté código, (que encontramos en el apartado «Administrador» de cada contenedor de nuestra cuenta.
Tan sólo tenemos que copiar el código que se nos muestra justo después de la etiqueta <body> (tal y como nos indica el propio GTM.
Así, para ejecutar las etiquetas de GTM deberemos incluir este código en aquellas páginas que queramos que se ejecute (al igual que hacemos, por ejemplo, con el código de seguimiento de Google Analytics).
Hay que tener en cuenta que cuando generamos el contenedor podremos filtrar por dominios la acción de los mismos.
Bueno… no solo ‘podemos’… yo diría que debemos hacerlo para evitar problemas. Puede que por error incluyamos el código del contenedor de un dominio en otro, o puede que un tercero incluya el código de nuestro contenedor en otra web. En cualquier caso, el resultado de nuestra analítica no será el correcto.
Es por eso por lo que es más que aconsejable efectuar este filtrado por dominio cuando creamos un contenedor.
Tags (las etiquetas)
Con Google Tag Manager ya no hace falta copiar código en nuestra web para implementar cada etiqueta. Ahora todo esto lo gestionamos desde Google Tag Manager.
Existen varios tipos de etiquetas que se pueden crear en Google Tag Manager de una forma realmente sencilla, pero también nos da la posibilidad de generar nuestras propias etiquetas HTML personalizadas.
Rule (las reglas)
Las reglas son las que, dependiendo de unas determinadas variables, determinarán si una etiqueta se aplicará o no en una página.
Todas las etiquetas han de tener, al menos, una regla que indique cuando se aplicará la etiqueta. Si no existe ninguna regla que valide a una etiqueta esta nunca será aplicada.
GTM proporciona por defecto una regla que validará una etiqueta en todas las páginas.
Al igual que definimos reglas de activación para indicar dónde SI deberá ejecutarse una determinada tag, podremos definir reglas de bloqueo si queremos que en ciertas ocasiones no aparezca. Obviamente, así como es imprescindible al menos una regla de activación, las reglas de bloqueo serán totalmente optativas.
Macro
Las macros son las variables que se utilizan para definir las reglas que harán que se aplique (o no) una determinada tag.
Google Tag Manager define, por defecto, varios tipos de macro, pero podemos crear nuevas macros personalizadas según nuestras necesidades.
Versiones
Otra ventaja de Google Tag Manager es que, una vez que definas el conjunto de etiqueas, sus reglas y macros, guardaremos una versión de la configuración.
Una vez guardada una versión de nuestro contenedor podrás publicarla para que empiece a funcionar. Pero también tienes la posibilidad de probarla antes con la opción «Vista Previa» así como restaurar una versión anterior o eliminarla.
Esto es realmente interesante, pues nos permite ver que todo funciona correctamente antes de implementar los cambios.
Google Tag Manager y el código asíncrono
A diferencia de otros GTM es un código asíncrono. Cuando se usan códigos no asíncronos (síncronos) estos nos obligan a colocar nuestro código de captura en un lugar concreto del código de la página (en ocasiones en la cabecera <head> o justo después de <body> y otras veces al final del cuerpo y antes de la etiqueta </body>).
Con el código asíncrono ocurre que algunas herramientas puede que necesiten registrar los datos de forma síncrona. En este caso GTM no sería la solución.
De este modo podríamos pensar que cuestiones como realizar test A/B quedarían fuera de las capacidades de Google Tag Manager.
Sin embargo, a pesar de que en ocasiones se habla que los test A/B o los píxeles no asíncronos son algunas de las cosas que no se pueden implementar con GTM, te aconsejo que le eches un vistazo a este artículo de Iñaki Huerta en el que verás como hacerlo utilizando las variables del dataLayer (=»Variable de Capa de Datos») de GTM.
Una curva de aprendizaje compleja
No te engañes: a pesar de ser un código ligero, limpio y que nos proporciona independencia de los desarrolladores, no se trata de un código intuitivo en absoluto.
Yo creo que realmente esta es la barrera que impide que GTM tenga una acogida mayor. Requiere dedicarle un tiempo para su aprendizaje y comprensión.
Yo creo que realmente vale la pena dedicarle el tiempo que se merece, pero hay que comprender que a veces los proyectos tienen otras prioridades y otras opciones (como llevarse bien con los desarrolladores) pueden ser la solución óptima.
