Aggiungere analytics.js al 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 tuo sito web. Questo documento spiega come aggiungere il tag Google Analytics al sito.

Il tag Google Analytics

Il tag Google Analytics deve essere aggiunto nella parte superiore del tag <head> e prima di qualsiasi altro tag script o CSS, quindi aggiungi l'ID proprietà della proprietà Google Analytics con 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 sopra indica quattro operazioni principali:

  1. Crea un elemento <script> che inizia il download asincrono della libreria JavaScript analytics.js da https://www.google-analytics.com/analytics.js
  2. Inizializza una funzione globale di ga (nota come la coda di comandi ga()) che consente di pianificare l'esecuzione dei comandi una volta caricata la libreria analytics.js e quando è tutto pronto.
  3. Aggiunge un comando alla coda di 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 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 della coda di comando ga().

Tag asincrono asincrono

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 asincrono di seguito aggiunge il supporto per il precaricamento, che fornirà un piccolo aumento delle prestazioni nei browser moderni, ma può ridurre il caricamento e l'esecuzione sincroni su IE 9 e browser per dispositivi mobili meno recenti che non riconoscono l'attributo dello 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 raccolti dal tag di Google Analytics?

Quando aggiungi uno di questi tag al tuo 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 trascorso da un utente sul tuo sito.
  • Il tempo che un utente trascorre su ogni pagina e l'ordine in cui 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 user agent e l'ispezione della pagina iniziale eseguita da analytics.js durante la creazione di un nuovo oggetto tracker vengono utilizzati per determinare:

  • La posizione geografica dell'utente.
  • Quali sono il browser e il sistema operativo utilizzati.
  • Dimensioni dello schermo e se sono installati Flash o Java.
  • Il sito referente.

Passaggi successivi

Per le esigenze di base dei rapporti, i dati raccolti tramite il tag di Google Analytics possono essere sufficienti, ma in molti casi ci sono altre domande a cui vuoi rispondere sugli utenti.

Le guide di questo sito spiegano come misurare le interazioni che ti interessano con analytics.js, ma prima di implementare una determinata funzionalità, è vivamente consigliato leggere le guide elencate nella sezione Nozioni di base nella navigazione a sinistra. Queste guide offrono una panoramica di alto livello della libreria analytics.js e ti aiutano a comprendere meglio gli esempi di codice utilizzati in tutto il sito.

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