May 19 2010
SemaforoQuesto semaforo indica il livello difficoltà del post
Monitoraggio Eventi con il codice asincrono
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?
Sto facendo un po’ di prove negli ultimi giorni per abituarmi all’utilizzo delle varie funzioni con la nuova sintassi.
Su clienti nuovi (o in avvio) infatti sto iniziando ad utilizzare il codice asincrono a go-go.
Non nego all’inizio di aver fatto un po’ di confusione ma l’occhio e la testa ormai si stanno abituando. 😀
Naturalmente aspetto qualche tua chicca asincrona. 😀
quale chicca? è solo una nuova sintassi 🙂
Grazie! era quello che stavo cercando!
Ciao Marco, una domanda! il codice nuovo supporto anche la vecchia versione delle funzioni sui tracciamenti page ed event o devono per forza essere sostituiti? Grazie! Ciaoo!
se usi il nuovo codice devi aggiornare la funzione, a meno di non “inettare” nella coda asincrona la vecchia funzione (soluzione che personalmente non mi piace e che spero di evitare sempre)
Ciao Marco, ho inserito nel mio sito il nuovo codice con nuovo trackevent ma non funziona. Io ho inserito la seguente sintassi:
Play
è corretta?
Guardiamo se così lo prende…
Niente, mi spiace…
onclick=”_gaq.push([‘_trackEvent’, ‘categoria’, ‘azione’]);”
è corretta
Ciao Marco,
ho bisogno di monitorare un evento su delle schede prodotti, dove è presente un link che rimanda ad una form di richiesta informazioni; il link è strutturato in questo modo:
<a class="button" onclick="protoPop( this.href.replace(/index.php/, 'index2.php' ) + '&only_page=1', { modal: true,width:640,height:480 } );return false;" href="”>
e io ho aggiunto la funzione così:
<a class="button" onclick="protoPop( this.href.replace(/index.php/, 'index2.php' ) + '&only_page=1', { modal: true,width:640,height:480 } );return false;" href="” onclick=”_gaq.push([‘_trackEvent’, ‘link’, ‘click’, ‘apertura-richiesta-informazioni-prodotto’, 0]);”>
ma non mi traccia nulla; ho errato il metodo di inserimento o non è possibile usare la funzione _trackEvent in questa situazione?
Grazie 😉
Non mi ha stampato tutto il codice, mancano le due chiamate php, te le aggiungo qui:
…href=”[php]echo $ask_seller_href[/php]”[funzione _trackEvent]”>[php] echo $ask_seller_text [/php]
hai già un onclick, invece di aggiungerne un altro dovresti aggiungere trackevent a quello.
Ciao Marco! ^_^
Come giustamente spieghi in questo bell’articolo, un aspetto che sta acquisendo sempre maggiore importanza nell’algoritmo di Google è la velocità di downaload delle pagine web.
Il download asincrono riveste pertanto grande importanza, migliorando l’esperienza di navigazione degli utenti e consentendo parallelamente ai webmaster di avere dati più precisi rispetto al codice di monitoraggio tradizionale.
A questo punto, però, mi chiedo: come mai nemmeno nell’Analytics Help Center di Google viene trattata la possibilità di esportare il codice di Analytics su un file javascript esterno?
Può questo inficiare in qualche modo il suo funzionamento?
Da un mio punto di vista, analizzando i risultati di PageSpeed e YSlow (strumenti per valutare le performance in termini di velocità delle pagine web), ritengo che esportare tutti i codici javascript in un unico file esterno possa portare indubbi benefici.
Voi cosa ne pensate? Avete esperienza in merito?
Grazie in anticipo e saluti a tutti!
Maino
non te lo vieta nessuno, ma di certo non è una pratica consigliata da Google: il perché è chiaro: il file che contiene il codice di GA cambia spessissimo, senza che l’utente se ne accorga, o debba accorgersene (al momento in cui scrivo siamo alla versione 4.9.2). se tu lo salvassi in locale poi avresti l’onere di tenerlo aggiornato, e non beneficeresti di eventuali bugfix e altre feature che vengono aggiunte
Ciao Marco,
come prima cosa ti ringrazio per la risposta. Tuttavia il mio dubbio era assai più banale… Cerco di spiegarmi meglio: in ottica alleggerimento pagine HTML, si dibatte da tempo sulla necessità di esportare tutto ciò che non è strettamente HTML in file esterni, ivi compresi i codici javascript (un pò come avviene normalmente per i CSS).
La mia domanda pertanto era: come mai nessuno (nemmeno Google nelle guide ufficiali on-line) annovera la possibilità di fare un richiamo dalla pagina HTML del codice Analytics?
Per intenderci, una cosa di questo tipo:
1) nel tag “head” della pagina html:
2) mentre nel file “google_analytics.js” qualcosa di questo tipo:
var _gaq = _gaq || [];
_gaq.push([‘_setAccount’, ‘UA-XXXXXXXXXXXX’]);
_gaq.push([‘_trackPageview’]);
(function() {
var ga = document.createElement(‘script’); ga.type = ‘text/javascript’; ga.async = true;
ga.src = (‘https:’ == document.location.protocol ? ‘https://ssl’ : ‘http://www’) + ‘.google-analytics.com/ga.js’;
var s = document.getElementsByTagName(‘script’)[0]; s.parentNode.insertBefore(ga, s);
})();
Come potete notare dal codice sopra riportato, il richiamo al ga.js rimane, pertanto in questo caso il discorso aggiornamenti non sarebbe un problema.
Forse questa modalità potenzialmente potrebbe creare problemi a livello di download asincrono? O altro che al momento mi sfugge?
Spero questa volta di essere stato un pò meno “criptico”. 😛
Grazie mille ancora!
Maino
Chiedo venia, il form di immissione testo si è “mangiato” il richiamo allo script… ve lo scrivo adeguatamente modificato con parentesi quadre e spazi:
[script type = ” text / javascript ” src = ” google_analytics.js ” ] [ / script ]
A presto!
Maino
Ciao Marco, complimenti per il tuo blog! Volevo chiederti una cosa rapida: è possibile utilizzare un codice simile a questo per monitorare il click su un pulsante di tipo ? Io l’ho usato sui link e funziona, ma sul pulsante del form no. Mi serve per capire se l’utente si arrende o meno al caricamento dell’invio email. Ciao!
Scusa non si vede il codice: intendevo dire di tipo “input type=submit”
si, se non ricordo male l’onclick si può tranquillamente usare sui pulsanti di submit. Però le form possono essere inviate anche da tastiera, e in quel caso non si onclicca niente 🙂
Con il codice scritto in questo articolo non funziona… magari c’è un altro tipo di codice per i pulsanti submit.
Comunque è solo una “rifinitura” per il sito.