Upload
semmantica
View
339
Download
1
Embed Size (px)
Citation preview
APRENDE A USAR
GOOGLE TAG MANAGER
Hello!
CARLOS RABADÁNANALISTA WEB EN SEMMANTICA
Analítica web
““
Análisis cualitativo y
cuantitativo de los datos de tu website y los de la competencia, para
lograr una continua mejora de la experiencia de usuario de tus clientes,
traduciéndose finalmente en los resultados deseados
Avinash Kaushik
Existen multitud de soluciones software de analítica
De una forma u otra, todas necesitan obtener
datos sobre los usuarios, las páginas, las interacciones con el portal, los productos, etc
Para poder recopilar todos estos datos, las herramientas de analítica web necesitan hacer uso de una cosa:
ETIQUETAS
Pequeños fragmentos de código fuente insertados en nuestra web, y que recogen
datos sobre la página y el usuario para enviarlos a la
herramienta que corresponda
Las etiquetas son…
La acumulación de etiquetas provoca
PROBLEMAS
Ensucian el documento web
Deterioran el rendimiento
Requieren de la intervención de IT
Provocan errores
Necesario un
CAMBIODE PARADIGMA
Liberar la página
de etiquetas
Administrarlas
externamente
GESTORES DE
ETIQUETASó
TAG MANAGEMENT
SYSTEMS(TMS’s)
““
Solución software para la gestión simplificada del código web y de las distintas etiquetas de las
herramientas de tracking online
Gestores de Etiquetas
En otras palabras…
Una etiqueta para gestionarlas a todas
Gestores de Etiquetas
Algunos conceptos clave a tener en cuenta
1
Por sí solos, los TMS’sno miden nada. Para eso hay que crear
etiquetas
2
El script del TMS ha de
estar instalado en todaslas páginas del portal que deseemos medir
3
Los TMS’s son inyectores de código.
Hay que tener cuidadocon lo que hacemos antes de publicar nuevos cambios
De acuerdo, ¿pero esto no iba
sobre
Google Tag Manager ?
Google Tag Manageraka
GTMEs el gestor de etiquetas de Google
$
G
FÁCIL EXTENDIDO GRATUITO
COMPLETO GOOGLEPOTENTE
Su curva de aprendizaje es suave
Existe mucha documentación en la red
Todas sus funcionalidades son gratuitas
Hace fácil el trabajar con herramientas de terceros
La seguridad que da tener a un gigante
detrás dando soporte
Buen rendimiento y versátil. Disponible SDKs
para mobile y tablet
Ok… Pero ¿qué me ofrece GTM que no me de ya Analytics?
analytics.js
• n etiquetas en el código fuente• Cada nueva etiqueta requiere hacer
modificaciones en el código fuente • Añadir o modificar etiquetas supone
un proceso técnico y lento (IT)• No se pueden probar las nuevas
etiquetas de forma directa en el entorno de producción
• Imprescindibles conocimientos técnicos para hacer cualquier cosa
• Muchas etiquetas pueden llegar a deteriorar el rendimiento de página
• Etiquetas desperdigadas, administración tediosa
Google Tag Manager
• 1 etiqueta en el código fuente (base)• Todas las etiquetas se gestionan a
través de una aplicación web externa• Los cambios en las etiquetas son
instantáneos• Las modificaciones en etiquetas se
pueden probar de manera local en el entorno de producción
• No son necesarios conocimientos técnicos para realizar mediciones sencillas
• La ejecución de las etiquetas se realiza de manera asíncrona
• Administración centralizada de etiquetas, permitiendo una clasificación personalizada
But wait! There’s more…
Creación de tests A/B de comportamiento y recopilación de datos posteriormenteA/B
Control y monitorización de posibles errores
Personalizar la experiencia de usuario en la web en función de su análisis y/o conocimiento previo
Y muchas más cosas que se nos ocurran!
Pero no es oro todo lo que reluce…
Google Tag Manager
• Es obligatorio introducir el script base en todas aquellas páginas que vayamos a medir
• Implementaciones más avanzadas requieren tener unos conocimientos técnicos mínimos
• Mediciones más complejas requieren introducir ciertos scripts en la web
• Migrar desde una implementación Analytics estándar no es trivial
• Scraping = frágil• Es «peligrosamente potente»
Instalación de GTM
Todas las páginas del portal han de contener el script base de GTM, al comienzo del <body>
<body>
<div><section class=«wrap»>……..
Y a partir de ahí nos olvidamos de la web, todo lo demás se hará a través de la interfaz de GTM
Cuenta
Contenedor
Componente Componente
Contenedor
Componente
…
…
GTM por dentro
Todos los contenedores de GTM llevan asociado un identificador único: GTM-ABCD123
Dentro de cada contenedor podremos crear tres tipos de componentes distintos
ETIQUETA(Tag)
VARIABLEDISPARADOR(Trigger)
El componente principal de GTM. Nos permitirán enviar
datos de analítica a la herramienta que queramos
ETIQUETA
También podremos modificar el DOM de la página e
inyectar nuevo contenido HTML (scripts) mediante un tipo de etiqueta especial
ETIQUETA
Colección de plantillas para una configuración rápida y sencilla de múltiples tipos de etiqueta
ETIQUETA
Diferentes clases de disparadores para definir con precisión
cuándo se debe lanzar una etiqueta
DISPARADOR
Cuando el usuario visita cierta página
Al hacer clic sobre un elemento Al enviar un formulario Cuando un elemento se hace
visible en la página Pasados x segundos Cuando se produce un error JS …
DISPARADOR
Capacidad para crear disparadores en función de
nuestras necesidades en cada momento
Un disparador también podrá usarse como
bloqueante de etiquetas
DISPARADOR
VARIABLE
Valores auxiliaresdefinidos a partir de la
página, de un elemento del DOM o de una
función personalizada
VARIABLE
Podremos invocarvariables a la hora de configurar cualquiera
de los tres componentes
principales de GTM
VARIABLE
Las variables amplían enormemente las
posibilidades de GTM, haciéndolo una
herramienta más
escalable y eficiente
ETIQUETA
DISPARADOR
VARIABLEPara poder medir será necesario crear etiquetas
Para ejecutar nuestras etiquetas tendremos que configurar
disparadores
Las variables facilitarán la
configuración de etiquetas y
disparadores, y los harán más versátiles
You’ll know my name
DATALAYER
““
Objeto Javascript encargado de almacenar todos los datos de cada una de las interacciones del
usuario con la página que haya podido escucharGTM
DATALAYER
¿Escuchar?
GTM se puede configurar para que monitorice prácticamente cualquier acción del usuario que navega
Los datos de estas acciones se almacenan en el Datalayer de cada página
Posteriormente podremos leer esta información y crear etiquetas, variables y disparadores en base a estos datos
¿Y por qué es tan importante?
DATALAYER
Porque es el nexo de comunicación entre GTM e IT
En algunas ocasiones, desde GTM necesitaremos
que se nos avise cuando se produzca cierto evento en la página
En otras, necesitaremos que nos pasen
información que no se encuentra disponible a nivel de DOM (transacciones, productos, usuarios, …)
Y toda esa comunicación tiene lugar
dentro del Datalayer
Algunos plugins para el navegador para el día a día con Tag Manager
Tag Assistant Dataslayer Wasp Ghostery Tag Manager Injector GTM Sonar EditThisCookie
¿Es para mí?
La pregunta que debes hacerte ahora
1 ¿Utilizas multitud de herramientas de análitica web en tu website?
2 ¿Tienes que añadir o cambiar etiquetas de estas herramientas a menudo?
3¿Puedes modificar estas etiquetas de forma rápida?
Si has respondido que sí alguna de las anteriores
preguntas significa que una solución tipo Tag Manager te podría ser de gran ayuda
Gracias