aprende a usar google tag manager (gtm)

58
APRENDE A USAR GOOGLE TAG MANAGER

Upload: semmantica

Post on 23-Jan-2017

330 views

Category:

Technology


1 download

TRANSCRIPT

Page 1: Aprende a usar Google Tag Manager (GTM)

APRENDE A USAR

GOOGLE TAG MANAGER

Page 2: Aprende a usar Google Tag Manager (GTM)

Hello!

CARLOS RABADÁNANALISTA WEB EN SEMMANTICA

Page 3: Aprende a usar Google Tag Manager (GTM)

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

Page 4: Aprende a usar Google Tag Manager (GTM)

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

Page 5: Aprende a usar Google Tag Manager (GTM)

Para poder recopilar todos estos datos, las herramientas de analítica web necesitan hacer uso de una cosa:

ETIQUETAS

Page 6: Aprende a usar Google Tag Manager (GTM)

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…

Page 7: Aprende a usar Google Tag Manager (GTM)
Page 8: Aprende a usar Google Tag Manager (GTM)

La acumulación de etiquetas provoca

PROBLEMAS

Page 9: Aprende a usar Google Tag Manager (GTM)

Ensucian el documento web

Deterioran el rendimiento

Requieren de la intervención de IT

Provocan errores

Page 10: Aprende a usar Google Tag Manager (GTM)

Necesario un

CAMBIODE PARADIGMA

Page 11: Aprende a usar Google Tag Manager (GTM)

Liberar la página

de etiquetas

Administrarlas

externamente

Page 12: Aprende a usar Google Tag Manager (GTM)

GESTORES DE

ETIQUETASó

TAG MANAGEMENT

SYSTEMS(TMS’s)

Page 13: Aprende a usar Google Tag Manager (GTM)

““

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

Page 14: Aprende a usar Google Tag Manager (GTM)

En otras palabras…

Page 15: Aprende a usar Google Tag Manager (GTM)

Una etiqueta para gestionarlas a todas

Gestores de Etiquetas

Page 16: Aprende a usar Google Tag Manager (GTM)

Algunos conceptos clave a tener en cuenta

Page 17: Aprende a usar Google Tag Manager (GTM)

1

Por sí solos, los TMS’sno miden nada. Para eso hay que crear

etiquetas

Page 18: Aprende a usar Google Tag Manager (GTM)

2

El script del TMS ha de

estar instalado en todaslas páginas del portal que deseemos medir

Page 19: Aprende a usar Google Tag Manager (GTM)

3

Los TMS’s son inyectores de código.

Hay que tener cuidadocon lo que hacemos antes de publicar nuevos cambios

Page 20: Aprende a usar Google Tag Manager (GTM)
Page 21: Aprende a usar Google Tag Manager (GTM)

De acuerdo, ¿pero esto no iba

sobre

Google Tag Manager ?

Page 22: Aprende a usar Google Tag Manager (GTM)

Google Tag Manageraka

GTMEs el gestor de etiquetas de Google

Page 23: Aprende a usar Google Tag Manager (GTM)

$

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

Page 24: Aprende a usar Google Tag Manager (GTM)

Ok… Pero ¿qué me ofrece GTM que no me de ya Analytics?

Page 25: Aprende a usar Google Tag Manager (GTM)

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

Page 26: Aprende a usar Google Tag Manager (GTM)

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!

Page 27: Aprende a usar Google Tag Manager (GTM)

Pero no es oro todo lo que reluce…

Page 28: Aprende a usar Google Tag Manager (GTM)

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»

Page 29: Aprende a usar Google Tag Manager (GTM)

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»>……..

Page 30: Aprende a usar Google Tag Manager (GTM)

Y a partir de ahí nos olvidamos de la web, todo lo demás se hará a través de la interfaz de GTM

Page 31: Aprende a usar Google Tag Manager (GTM)

Cuenta

Contenedor

Componente Componente

Contenedor

Componente

GTM por dentro

Page 32: Aprende a usar Google Tag Manager (GTM)

Todos los contenedores de GTM llevan asociado un identificador único: GTM-ABCD123

Page 33: Aprende a usar Google Tag Manager (GTM)

Dentro de cada contenedor podremos crear tres tipos de componentes distintos

Page 34: Aprende a usar Google Tag Manager (GTM)

ETIQUETA(Tag)

VARIABLEDISPARADOR(Trigger)

Page 35: Aprende a usar Google Tag Manager (GTM)

El componente principal de GTM. Nos permitirán enviar

datos de analítica a la herramienta que queramos

ETIQUETA

Page 36: Aprende a usar Google Tag Manager (GTM)

También podremos modificar el DOM de la página e

inyectar nuevo contenido HTML (scripts) mediante un tipo de etiqueta especial

ETIQUETA

Page 37: Aprende a usar Google Tag Manager (GTM)

Colección de plantillas para una configuración rápida y sencilla de múltiples tipos de etiqueta

ETIQUETA

Page 38: Aprende a usar Google Tag Manager (GTM)

Diferentes clases de disparadores para definir con precisión

cuándo se debe lanzar una etiqueta

DISPARADOR

Page 39: Aprende a usar Google Tag Manager (GTM)

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

Page 40: Aprende a usar Google Tag Manager (GTM)

Capacidad para crear disparadores en función de

nuestras necesidades en cada momento

Un disparador también podrá usarse como

bloqueante de etiquetas

DISPARADOR

Page 41: Aprende a usar Google Tag Manager (GTM)

VARIABLE

Valores auxiliaresdefinidos a partir de la

página, de un elemento del DOM o de una

función personalizada

Page 42: Aprende a usar Google Tag Manager (GTM)

VARIABLE

Podremos invocarvariables a la hora de configurar cualquiera

de los tres componentes

principales de GTM

Page 43: Aprende a usar Google Tag Manager (GTM)

VARIABLE

Las variables amplían enormemente las

posibilidades de GTM, haciéndolo una

herramienta más

escalable y eficiente

Page 44: Aprende a usar Google Tag Manager (GTM)

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

Page 45: Aprende a usar Google Tag Manager (GTM)

You’ll know my name

DATALAYER

Page 46: Aprende a usar Google Tag Manager (GTM)

““

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

Page 47: Aprende a usar Google Tag Manager (GTM)

¿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

Page 48: Aprende a usar Google Tag Manager (GTM)

¿Y por qué es tan importante?

DATALAYER

Porque es el nexo de comunicación entre GTM e IT

Page 49: Aprende a usar Google Tag Manager (GTM)

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, …)

Page 50: Aprende a usar Google Tag Manager (GTM)

Y toda esa comunicación tiene lugar

dentro del Datalayer

Page 51: Aprende a usar Google Tag Manager (GTM)

Algunos plugins para el navegador para el día a día con Tag Manager

Page 52: Aprende a usar Google Tag Manager (GTM)

Tag Assistant Dataslayer Wasp Ghostery Tag Manager Injector GTM Sonar EditThisCookie

Page 53: Aprende a usar Google Tag Manager (GTM)

¿Es para mí?

La pregunta que debes hacerte ahora

Page 54: Aprende a usar Google Tag Manager (GTM)

1 ¿Utilizas multitud de herramientas de análitica web en tu website?

Page 55: Aprende a usar Google Tag Manager (GTM)

2 ¿Tienes que añadir o cambiar etiquetas de estas herramientas a menudo?

Page 56: Aprende a usar Google Tag Manager (GTM)

3¿Puedes modificar estas etiquetas de forma rápida?

Page 57: Aprende a usar Google Tag Manager (GTM)

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

Page 58: Aprende a usar Google Tag Manager (GTM)

Gracias