Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

Aprende a usar Google Tag Manager (GTM)

656 views

Published on

Conferencia impartida por Carlos Rabadán en la Feria de Tiendas Virtuales 2016 sobre el cambio de paradigma que supone empezar a utilizar Google Tag Manager (GTM): principales gestores de etiquetas, ventajas del uso de GTM, instalación de GTM, contenedores, disparadores y variables.

Published in: Technology
  • Be the first to comment

  • Be the first to like this

Aprende a usar Google Tag Manager (GTM)

  1. 1. APRENDE A USAR GOOGLE TAG MANAGER
  2. 2. Hello! CARLOS RABADÁN ANALISTA WEB EN SEMMANTICA
  3. 3. 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
  4. 4. 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
  5. 5. Para poder recopilar todos estos datos, las herramientas de analítica web necesitan hacer uso de una cosa: ETIQUETAS
  6. 6. 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…
  7. 7. La acumulación de etiquetas provoca PROBLEMAS
  8. 8. Ensucian el documento web Deterioran el rendimiento Requieren de la intervención de IT Provocan errores
  9. 9. Necesario un CAMBIO DE PARADIGMA
  10. 10. Liberar la página de etiquetas Administrarlas externamente
  11. 11. GESTORES DE ETIQUETAS ó TAG MANAGEMENT SYSTEMS (TMS’s)
  12. 12. “ “ 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
  13. 13. En otras palabras…
  14. 14. Una etiqueta para gestionarlas a todas Gestores de Etiquetas
  15. 15. Algunos conceptos clave a tener en cuenta
  16. 16. 1 Por sí solos, los TMS’s no miden nada. Para eso hay que crear etiquetas
  17. 17. 2 El script del TMS ha de estar instalado en todas las páginas del portal que deseemos medir
  18. 18. 3 Los TMS’s son inyectores de código. Hay que tener cuidado con lo que hacemos antes de publicar nuevos cambios
  19. 19. De acuerdo, ¿pero esto no iba sobre Google Tag Manager ?
  20. 20. Google Tag Manager aka GTM Es el gestor de etiquetas de Google
  21. 21. $ 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
  22. 22. Ok… Pero ¿qué me ofrece GTM que no me de ya Analytics?
  23. 23. 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
  24. 24. 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!
  25. 25. Pero no es oro todo lo que reluce…
  26. 26. 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» 
  27. 27. 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»>……..
  28. 28. Y a partir de ahí nos olvidamos de la web, todo lo demás se hará a través de la interfaz de GTM
  29. 29. Cuenta Contenedor Componente Componente Contenedor Componente … … GTM por dentro
  30. 30. Todos los contenedores de GTM llevan asociado un identificador único: GTM-ABCD123
  31. 31. Dentro de cada contenedor podremos crear tres tipos de componentes distintos
  32. 32. ETIQUETA (Tag) VARIABLEDISPARADOR (Trigger)
  33. 33. El componente principal de GTM. Nos permitirán enviar datos de analítica a la herramienta que queramos ETIQUETA
  34. 34. También podremos modificar el DOM de la página e inyectar nuevo contenido HTML (scripts) mediante un tipo de etiqueta especial ETIQUETA
  35. 35. Colección de plantillas para una configuración rápida y sencilla de múltiples tipos de etiqueta ETIQUETA
  36. 36. Diferentes clases de disparadores para definir con precisión cuándo se debe lanzar una etiqueta DISPARADOR
  37. 37.  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
  38. 38. Capacidad para crear disparadores en función de nuestras necesidades en cada momento Un disparador también podrá usarse como bloqueante de etiquetas DISPARADOR
  39. 39. VARIABLE Valores auxiliares definidos a partir de la página, de un elemento del DOM o de una función personalizada
  40. 40. VARIABLE Podremos invocar variables a la hora de configurar cualquiera de los tres componentes principales de GTM
  41. 41. VARIABLE Las variables amplían enormemente las posibilidades de GTM, haciéndolo una herramienta más escalable y eficiente
  42. 42. 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
  43. 43. You’ll know my name DATALAYER
  44. 44. “ “ Objeto Javascript encargado de almacenar todos los datos de cada una de las interacciones del usuario con la página que haya podido escuchar GTM DATALAYER
  45. 45. ¿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
  46. 46. ¿Y por qué es tan importante? DATALAYER Porque es el nexo de comunicación entre GTM e IT
  47. 47. 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, …)
  48. 48. Y toda esa comunicación tiene lugar dentro del Datalayer
  49. 49. Algunos plugins para el navegador para el día a día con Tag Manager
  50. 50.  Tag Assistant  Dataslayer  Wasp  Ghostery  Tag Manager Injector  GTM Sonar  EditThisCookie
  51. 51. ¿Es para mí? La pregunta que debes hacerte ahora
  52. 52. 1 ¿Utilizas multitud de herramientas de análitica web en tu website?
  53. 53. 2 ¿Tienes que añadir o cambiar etiquetas de estas herramientas a menudo?
  54. 54. 3 ¿Puedes modificar estas etiquetas de forma rápida?
  55. 55. 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
  56. 56. Gracias

×