Oct 21 2011

HelpSemaforoQuesto semaforo indica il livello difficoltà del post
semaforo verde - articolo per tutti semaforo giallo - articolo avanzato semaforo rosso - articolo per esperti

Usare eventi che non influenzino il bounce rate

autore: Marco Cilia categoria: funzioni

Un evento su Google Analytics è una azione che l’utente compie sul sito e che non è connessa al caricamento di una pagina. Essendo una azione, essa influenza il bounce rate, per cui se un visitatore atterra su una pagina, ed è l’unica della sua sessione esso sarà un bounce. Se però su quella stessa pagina viene “sparato” un evento, fino ad oggi la visita non risultava nei bounce.

Dall’ultima release del file ga.js – del 17 ottobre – è stato introdotto un nuovo parametro nella funzione _trackEvent: questo parametro si occupa di definire se l’evento inviato deve o non deve influenzare il bounce rate. Il nuovo parametro è opzionale e si posiziona alla fine della chiamata alla funzione, così che non dobbiate modificare nulla se non i soli eventi che volete rendere ininfluenti ai fini del bounce rate. La nuova funzione _trackEvent nella sua forma completa ha questa forma:


_gaq.push(['_trackEvent', 'category', 'action', 'opt_label', opt_value, opt_noninteraction]);

dove opt_noninteraction è un valore a scelta tra false (cioè “questo evento influenza il bounce rate”) e true (“questo evento non influeenza il bounce rate”).

Ovviamente il tutto ha senso solo sulla PRIMA pagina vista di ogni vista, l’unica dove si può realizzare un bounce, perché dalla seconda in poi la visita non sarà più un rimbalzo, eventi o meno…


Jun 03 2011

HelpSemaforoQuesto semaforo indica il livello difficoltà del post
semaforo verde - articolo per tutti semaforo giallo - articolo avanzato semaforo rosso - articolo per esperti

Tracciare Google +1 con gli eventi

autore: Marco Cilia categoria: javascript

Pochi giorni fa Google ha reso disponibile il suo pulsante +1 per rendere più “social” le ricerche: è un pulsante che serve a segnalare agli amici, durante le loro ricerche, le pagine che noi abbiamo apprezzato. Pochi istanti dopo l’introduzione è stata fatta la fatidica domanda: come si traccia il tutto con Google Analytics?

Joost De Valk ha la risposta, che non era troppo difficile, e siccome l’ha data per prima ve la riporto qui dandone il giusto credito (al contrario di alcuni articoli che mi sono capitati sott’occhio: dannata tendenza italiana a “dimenticare” di attribuire i crediti…): il pulsante è ingegnerizzato bene e consente di specificare una funzione custom da associare al click; nel nostro caso ovviamente si tratterà di una chiamata a _trackEvent. Nel dettaglio:

Bisognerà includere nelle proprie pagine il javascript necessario al pulsante, incollando questa riga prima di /body


<script type="text/javascript" src="http://apis.google.com/js/plusone.js"></script>

Dopodiché si potrà creare il pulsante desiderato tramite l’interfaccia apposita (image credit: yoast.com):
Google +1

avendo cura di selezionare le opzioni avanzate e specificare nella riga JS Callback function (funzione richiamo JS in italiano) “plusone_vote” (è il nome della funzione che useremo).

Poi incollare la riga che ci verrà fornita dall’interfaccia (se abbiamo selezionato le opzioni come in figura sarà uguale alle seguente)
<g:plusone size="tall" callback="plusone_vote"></g:plusone>

nel punto in cui vogliamo che compaia il pulsante.

Ultimo, specificare dopo la riga del javascript che abbiamo messo prima di /body la seguente funzione


<script type="text/javascript">
  function plusone_vote( obj ) {
    _gaq.push(['_trackEvent','plusone',obj.state]);
  }
</script>

che come vedete sul click esegue un evento con categoria “plusone” e action “on” oppure “off” a seconda che si tratti di un +1 o della rimozione di un +1.

Che tipo di dati ci aspettiamo? banalmente il numero di +1 complessivi per giorno. Che tipo di indicazioni ci darebbe? ben poche, fatto così. Una modifica interessante potrebbe essere aggiungere l’url della pagina, così
_gaq.push(['_trackEvent','plusone',obj.state,location.href]);
in modo da avere i +1 distinti per pagina, e poter correlare poi il numero di +1 precedenti con picchi di traffico nei giorni successivi, se il +1 è in grado di modificare la posizione in SERP. Alcuni amici premono +1, il mio post sale nelle SERP dei loro amici, alcuni di loro premono il +1 e così via…


Sep 28 2010

HelpSemaforoQuesto semaforo indica il livello difficoltà del post
semaforo verde - articolo per tutti semaforo giallo - articolo avanzato semaforo rosso - articolo per esperti

Tracciare i video HTML5

autore: Marco Cilia categoria: javascript

Dicono che il futuro dei video online sarà HTML5, e che Flash morirà. Sia come sia è evidente che pressoché tutti i browser moderni supportano il nuovo standard di riproduzione dei video, il tag video appunto, e che quindi alcuni webmaster potrebbero voler migrare a quella tecnologia senza perdere d’occhio le interazioni degli utenti sui video tracciate con Google Analytics.

Rob su elisa|DBI ha scritto un post su quanto questa operazione sia facile rispetto al vecchio ActionScript. In sostanza nel suo esempio il video è racchiuso tutto in questo codice


<video controls autoplay id=”super-video” width=”250″>
  <source src="videos/video1.ogg">
    Your browser does not support the video tag
  </source>
</video>

piuttosto facile, no? dopodiché bisogna “iniettare” via javascript le funzioni necessarie al tracciamento, dopo che la pagina si è caricata interamente ma prima che il video parta. Questo viene risolto con le chiamate


document.addEventListener("DOMContentLoaded", init, false);
    
    function init(){
      var video = document.getElementById("super-video");
      video.addEventListener("play", videoPlay, false);
      video.addEventListener("pause", videoPause, false);
      video.addEventListener("ended", videoEnd, false);
    }

dopodiché servono le funzioni che associano ad ogni azione la chiamata al tracciamento dell’azione tramite gli eventi, e cioè


function videoPlay() {
      trackEvent('Play', 'My Video'); 
    }
    
    function videoPause() {
      trackEvent('Pause', 'My Video'); 
    }
    
    function videoEnd() {
      trackEvent('Ended', 'My Video'); 
    }

e in ultimo la chiamata vera e propria a _trackEvent, che riconosceremo subito


function trackEvent(action, title) {
      _gaq.push(['_trackEvent', 'Videos', action, title]);
    }

Con poche righe di codice, semplicemente, vengono tracciati i tre eventi principali, play, pausa e completamento della visione del video. Certo, non sarà raffinato e completo come il mio sistema per tracciare video flash e youtube, ma è un metodo più o meno alla portata di tutti!


May 19 2010

HelpSemaforoQuesto semaforo indica il livello difficoltà del post
semaforo verde - articolo per tutti semaforo giallo - articolo avanzato semaforo rosso - articolo per esperti

Monitoraggio Eventi con il codice asincrono

autore: Marco Cilia categoria: funzioni

Il vantaggio del codice asincrono è che crea una coda di comandi che viene eseguita in parallelo allo scaricamento di altri javascript, rendendo il caricamento della pagina più veloce. La cosa che spesso trae in inganno – da quel che sento – è che molti pensano che adesso tutto debba essere inserito dentro a questa coda prima che i comandi vengano “sparati” verso i server di Google Analytics. Non è vero.

Un esempio tipico è il monitoraggio degli eventi, che sono associati quasi sempre ad azioni effettuate dall’utente, quindi non è possibile prevedere se esse saranno fatte 10 secondi o 25 minuti dopo che la pagina ha finito di caricarsi. Quale è la sintassi da utilizzare per tracciare un evento (per praticità riprendo lo stesso esempio del post originale sulla funzione trackEvent)con il nuovo codice asincrono? è semplicemente:


<a href="#" onclick="_gaq.push(['_trackEvent', 'categoria', 'azione', 'descrizione', valore]);">Play</a> 

come vedete la funzione è la stessa, così come i parametri (ve lo ricordo: categoria e azione sono obbligatori, gli altri opzionali), cambia solo la sintassi. Sparisce pageTracker e ci sono alcune parentesi in più, ma non è poi molto differente dalla vecchia forma, no?


Sep 18 2009

HelpSemaforoQuesto semaforo indica il livello difficoltà del post
semaforo verde - articolo per tutti semaforo giallo - articolo avanzato semaforo rosso - articolo per esperti

4 informazioni utili se tracci gli eventi

autore: Marco Cilia categoria: funzioni

Phil Pearce, ai più noto come PPC Guru, ha postato sul forum di supporto di Google Analytics alcune interessanti precisazioni riguardo la funzione _trackEvent, che viene utilizzata per tracciare interattivamente eventi senza incrementare il numero di pagine viste.
Sono quattro precisazioni “tecniche”, ma vi può essere utile conoscerle sia che mettiate mano direttamente al codice sia che lo facciate fare a qualcuno. Eccole:

  1. il parametro opzionale “valore” deve essere per forza un intero, ovvero non avere decimali.
  2. Poiché è un valore intero, non c’è bisogno di racchiuderlo tra gli apici, come si fa con le stringhe.
  3. Virgole, virgolette e apici contenuti nei valori vanno preceduti dal carattere di escape \ (backslash). Ad esempio se passiamo il valore Genova\,Italia
  4. Se si usa _trackEvent e _trackPageview insieme è necessario porre attenzione all’ordine di apici e virgolette, specie quando le funzioni sono racchiuse in un evento onclick.

In effetti ogni tanto la documentazione ufficiale non è allineatissima, ma ho sempre riscontrato che segnalando gli errori questi venissero sistemati.


Jul 28 2009

HelpSemaforoQuesto semaforo indica il livello difficoltà del post
semaforo verde - articolo per tutti semaforo giallo - articolo avanzato semaforo rosso - articolo per esperti

Segmenti avanzati con eventi

autore: Marco Cilia categoria: report

Anche se può sembrare strano, fino a ieri non era possibile creare un segmento avanzato che si riferisse alle visite contenenti eventi, tracciate quindi tramite la funzione _trackEvent(). Google ha aggiunto questa funzionalità e lo ha annunciato con un post sul blog ufficiale.

Le tre dimensioni che si possono usare nei segmenti sono azione, categoria ed etichetta degli eventi, mentre i parametri selezionabili sono gli eventi univoci, il totale eventi e il valore, ammesso che sia stato inviato visto che è un parametro opzionale della funzione. Ad esempio un segmento con “totale eventi maggiore di 0” sarà in grado di mostrarci solo le visite che hanno scatenato almeno un evento durante la permanenza sul sito, mentre un segmento con “categoria eventi: download e totale eventi maggiore di 2” ci dirà quante visite sono risultate nel download di due o più file.

Se avete scaricato e state utilizzando il mio videotracker (e se non lo state facendo la domanda è: PERCHE’ ? 🙂 ) questi segmenti possono essere utili per isolare ed analizzare ancora più in dettaglio i visitatori che usufruiscono dei vostri video. Un esempio molto veloce è un segmento fatto così:

Azione dell’evento – corrisponde esattamente – Volume
e
Valore evento – Maggiore di – 90

che mostra solo le visite che hanno visto dei video e mantenuto un volume dell’audio superiore al 90%.

Utilizzando le etichette degli eventi, che nel videotracker corrispondono al titolo del video, si possono anche segmentare le visite per singolo video, e ad esempio si possono monitorare le fonti di traffico di chi ha visto un certo video, che possono essere molto diverse (pensiamo solo alle keyword di ingresso sul sito) rispetto a chi ha visto un video differente.


Jul 02 2009

HelpSemaforoQuesto semaforo indica il livello difficoltà del post
semaforo verde - articolo per tutti semaforo giallo - articolo avanzato semaforo rosso - articolo per esperti

Initdata e tracciamento eventi

autore: Marco Cilia categoria: codice di monitoraggio

In passato vi ho descritto l’uso della funzione _trackEvent(), utile per usare il tracciamento degli eventi sulle pagine ed evitare di generate troppe pagine virtuali o per tracciare comportamenti complessi dell’utente indipendentemente dalla sua attività (ad esempio per tenere traccia degli eventi in AJAX, che tipicamente non ricaricano la pagina e quindi non generano un nuovo invio di dati a Google Analytics).

Un caso un po’ anomalo è capitato ad un utente del forum di supporto: venablc ha bisogno di chiamare la funzione _trackEvent() senza richiamare anche _trackPageview(), probabilmente perché sta inviando i soli dati degli eventi ad un altro profilo e non vuole vedere le pagine viste; omettendo semplicemente la chiamata il codice non funziona e la consolle degli errori javascript riporta un laconico errore di “oggetto non definito”.

La soluzione al problema è resuscitare la defunta funzione _initData(), soppressa qualche tempo fa. L’oggetto che manca a _trackEvent infatti viene creato da _initData(), che a sua volta è richiamata automaticamente da _trackPageview(). Ma nessuno ci vieta di chiamarla esplicitamente, evitando di inviare i dati della pagina vista ma consentendo a _trackEvent() di funzionare regolarmente!
[ovviamente quanto detto vale per il caso specifico e può essere adattato alle vostre esigenze senza dimenticare quanto detto in questo altro post: o initData ce l’avete in tutte le pagine o non ce l’avete in nessuna, per quanto riguarda il profilo che raccoglie i dati]


Dec 14 2008

HelpSemaforoQuesto semaforo indica il livello difficoltà del post
semaforo verde - articolo per tutti semaforo giallo - articolo avanzato semaforo rosso - articolo per esperti

funzioni: _trackEvent()

autore: Marco Cilia categoria: funzioni

La funzione di tracciamento degli eventi è una conseguenza della riscrittura a oggetti del codice di tracciamento di Analytics, come dicevo nel post precedente. Javascript infatti è un linguaggio orientato agli oggetti, e senza entrare in dettagli troppo tecnici diremo che questo tipo di paradigma della programmazione comporta alcuni indubbi vantaggi che gli ingegneri di Google hanno ritenuto utile implementare nel GATC.

Un evento, secondo la definizione (bozza del 22/9/2008) della Web Analytics Association, è una qualsiasi azione registrata che ha un timestamp attribuito dal browser o dal server; sono esempi di azioni il display di un banner o l’invio di una richiesta asincrona tramite AJAX in una porzione di pagina web.
La funzione che Google Analytics usa per tenere traccia degli eventi è _trackEvent(categoria, azione, descrizione, valore).
I valori passati come parametro a questa funzione sono:

  • categoria [obbligatorio]: è una stringa che identifica il “gruppo” di eventi cui l’azione appartiene. Poiché possono coesistere più eventi nella stessa pagina è un parametro che non può essere omesso.
  • azione [obbligatorio]: è una stringa che identifica l’azione svolta dall’utente e strettamente correlata alla categoria. Anche in questo caso è un parametro che non può mancare.
  • descrizione [facoltativa]: è una stringa che si può usare per aggiungere ulteriori informazioni all’evento. Nel caso di eventi complessi o presenza di molti eventi contemporanei può essere utile per districarsi nella lettura dei report.
  • valore [facoltativo]: è un numero intero che si può indicare per associare un valore all’evento.

Un esempio tipico di tracciamento degli eventi è un video comandato via javascript da pulsanti personalizzati. Il pulsante play potrebbe avere questo codice assegnato:
<a href="#" onClick="pageTracker._trackEvent("Video", "Play", "video-compleanno-2008", 0);">Play</a>

Analogamente si potrebbero passare a Google Analytics anche i valori di pause e stop, magari dopo aver scritto un paio di funzioni javascript per razionalizzare e ottimizzare il codice, e poi leggere nella sezione eventi dei report i risultati. La sezione eventi non è ancora stata ufficializzata, ma in un profilo in cui ho fatto alcune prove essa è comparsa da sola. Probabilmente viene attivata quando iniziano ad arrivare i primi dati sotto forma di eventi.

Il vantaggio del tracciamento eventi è che non si ricorre al metodo delle pagine virtuali di _trackPageview(), e che quindi non si inflaziona il relativo conteggio. Tramite gli eventi, con un po’ di lavoro, è anche possibile monitorare in forma più estesa i donwload di materiali e documenti dal sito.