La biblioteca analytics.js (también conocida como etiqueta de Google Analytics) es una biblioteca de JavaScript para medir cómo los usuarios interactúan con su sitio web. En este documento, se explica cómo agregar la etiqueta de Google Analytics a tu sitio.
La etiqueta de Google Analytics
La etiqueta de Google Analytics debe agregarse cerca de la parte superior de la etiqueta <head> y antes de cualquier otra secuencia de comandos o etiquetas CSS, y agregar el ID de propiedad de la propiedad de Google Analytics con la que deseas trabajar.
<!-- Google Analytics -->
<script>
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
ga('create', 'UA-XXXXX-Y', 'auto');
ga('send', 'pageview');
</script>
<!-- End Google Analytics -->
El código anterior realiza cuatro acciones principales:
- Crea un elemento
<script>que comienza a descargar de forma asíncrona la biblioteca de JavaScript analytics.js desdehttps://www.google-analytics.com/analytics.js. - Inicializa una función
gaglobal (llamada la cola de comandosga()) que te permite programar comandos para que se ejecuten una vez que la biblioteca analytics.js esté cargada y lista para usarse. - Agrega un comando a la cola de comandos de
ga()a fin de crear un nuevo objeto de seguimiento para la propiedad especificada a través del parámetro'GA_MEASUREMENT_ID'. - Agrega otro comando a la cola de comandos de
ga()para enviar una página vista a Google Analytics para la página actual.
Las implementaciones personalizadas pueden requerir modificar las últimas dos líneas de la etiqueta de Google Analytics (los comandos create y send) o agregar código adicional para capturar más interacciones. Sin embargo, no debes cambiar el código que carga la biblioteca analytics.js o inicializa la función ga() de la cola de comandos.
Etiqueta asíncrona alternativa
Si bien la etiqueta de Google Analytics que se describe más arriba garantiza que la secuencia de comandos se cargue y se ejecute de forma asíncrona en todos los navegadores, tiene la desventaja de no permitir que los navegadores modernos la precarguen.
La etiqueta asíncrona alternativa a continuación agrega compatibilidad con la precarga, lo que proporcionará un pequeño aumento del rendimiento en los navegadores modernos, pero puede degradarse a la carga y ejecución síncronas en IE 9 y navegadores anteriores que no reconocen el atributo async de la secuencia de comandos. Use esta configuración de la etiqueta solo si sus visitantes utilizan principalmente navegadores modernos para acceder a su sitio.
<!-- Google Analytics -->
<script>
window.ga=window.ga||function(){(ga.q=ga.q||[]).push(arguments)};ga.l=+new Date;
ga('create', 'UA-XXXXX-Y', 'auto');
ga('send', 'pageview');
</script>
<script async src='https://www.google-analytics.com/analytics.js'></script>
<!-- End Google Analytics -->
¿Qué datos captura la etiqueta de Google Analytics?
Cuando agrega cualquiera de estas etiquetas a su sitio web, envía una página vista por cada página que visitan sus usuarios. Google Analytics procesa estos datos y puede inferir una gran cantidad de información, como la siguiente:
- Es el tiempo total que un usuario pasa en su sitio.
- El tiempo que un usuario pasa en cada página y el orden en el que las visitó.
- En qué vínculos internos se hizo clic (según la URL de la página siguiente)
Además, la dirección IP, la string usuario-agente y la inspección inicial de la página que realiza analytics.js al crear un nuevo objeto de seguimiento se utilizan para determinar lo siguiente:
- La ubicación geográfica del usuario.
- Qué navegador y sistema operativo se usan
- Tamaño de la pantalla y si Flash o Java están instalados.
- El sitio de referencia.
Próximos pasos
Para las necesidades básicas de informes, los datos recopilados a través de la etiqueta de Google Analytics pueden ser suficientes, pero en muchos casos hay preguntas adicionales que desea que se respondan sobre sus usuarios.
Las guías de este sitio explican cómo medir las interacciones que te interesan con analytics.js, pero antes de implementar una función en particular, te recomendamos que leas las guías que aparecen en la sección Conceptos básicos en la barra de navegación izquierda. Estas guías le proporcionarán una descripción general de alto nivel de la biblioteca analytics.js y lo ayudarán a comprender mejor los ejemplos de código que se utilizan en todo el sitio.
En la siguiente guía de esta serie, se explica cómo funciona analytics.js.