Aggiungi analytics.js al tuo sito

La libreria analytics.js, nota anche come "tag di Google Analytics", è una libreria JavaScript per misurare il modo in cui gli utenti interagiscono con il sito web. Questo documento spiega come aggiungere il tag di Google Analytics al tuo sito.

Tag Google Analytics

Il tag Google Analytics deve essere aggiunto nella parte superiore del tag <head> e prima di qualsiasi altro script o tag CSS, poi aggiungi l'ID proprietà della proprietà Google Analytics su cui vuoi lavorare.

<!-- 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 -->

Il codice riportato sopra svolge quattro operazioni principali:

  1. Crea un elemento <script> che avvia in modo asincrono il download della libreria JavaScript analytics.js da https://www.google-analytics.com/analytics.js
  2. Inizializza una funzione ga globale (chiamata coda dei comandi ga()) che consente di pianificare i comandi da eseguire una volta caricata e pronta la libreria analytics.js.
  3. Aggiunge un comando alla coda dei comandi ga() per creare un nuovo oggetto tracker per la proprietà specificata tramite il parametro 'GA_MEASUREMENT_ID'.
  4. Aggiunge un altro comando alla coda dei comandi ga() per inviare una visualizzazione di pagina a Google Analytics per la pagina corrente.

Le implementazioni personalizzate possono richiedere la modifica delle ultime due righe del tag di Google Analytics (i comandi create e send) o l'aggiunta di codice aggiuntivo per acquisire più interazioni. Tuttavia, non modificare il codice che carica la libreria analytics.js o inizializza la funzione coda dei comandi ga().

Tag asincrono alternativo

Il tag di Google Analytics descritto sopra garantisce che lo script venga caricato ed eseguito in modo asincrono su tutti i browser, ma ha lo svantaggio di non consentire ai browser moderni di precaricare lo script.

Il tag asincrono alternativo riportato di seguito aggiunge il supporto per il precaricamento, che fornirà un piccolo miglioramento delle prestazioni sui browser moderni, ma può ridurre al caricamento e all'esecuzione sincroni su IE 9 e browser mobile precedenti che non riconoscono l'attributo di script async. Utilizza questa configurazione del tag solo se i visitatori utilizzano principalmente browser moderni per accedere al tuo sito.

<!-- 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 -->

Quali dati vengono acquisiti dal tag di Google Analytics?

Quando aggiungi uno di questi tag al sito web, invii una visualizzazione di pagina per ogni pagina visitata dagli utenti. Google Analytics elabora questi dati e può dedurre una grande quantità di informazioni, tra cui:

  • Il tempo totale che un utente trascorre sul tuo sito.
  • Il tempo che un utente trascorre su ogni pagina e l'ordine in cui le pagine sono state visitate.
  • Su quali link interni è stato fatto clic (in base all'URL della visualizzazione di pagina successiva).

Inoltre: l'indirizzo IP, la stringa dello user agent e l'ispezione iniziale della pagina eseguita da analytics.js durante la creazione di un nuovo oggetto tracker vengono utilizzati per determinare, ad esempio:

  • La posizione geografica dell'utente.
  • Il browser e il sistema operativo utilizzati.
  • Dimensioni dello schermo e se Flash o Java è installato.
  • Il sito di riferimento.

Passaggi successivi

Per esigenze di base dei report, i dati raccolti tramite il tag Google Analytics possono essere sufficienti, ma in molti casi è necessario rispondere ad alcune domande sugli utenti.

Le guide disponibili in questo sito spiegano come misurare le interazioni che ti interessano con analytics.js, ma prima di implementare una determinata funzionalità, ti consigliamo vivamente di leggere le guide elencate nella sezione Nozioni di base nel menu di navigazione a sinistra. Queste guide ti forniranno una panoramica generale della libreria analytics.js e ti aiuteranno a comprendere meglio gli esempi di codice utilizzati nel sito.

La prossima guida di questa serie spiega come funziona analytics.js.