主頁 > SEO > Google Analytics之工作原理和應用技巧

Google Analytics之工作原理和應用技巧

PDF版本

大型網站以及高流量網站中,數據分析無疑是非常重要的一個環節,通過數據分析,我們可以了解到網站的流量、流量來源、哪些頁面訪問最高、哪些頁面需要提升,哪些回頭用戶,哪些用戶瀏覽之后沒有轉換成目標用戶,轉換的目標用戶是通過那些頁面進入交易頁面的、等等。對于任何一個商業網站,這些數據都非常重要,不但對于網站的用戶體驗、搜索引擎優化(SEO)有很大幫助,并且對于網站的用戶和收入都非常重要。在眾多的免費流量統計軟件中,Google Analytics (谷歌分析)無疑是相當優秀又易用的一款。因此,我們在這里打算開始一系列Google Analytics的相關經驗總結,以供大家參考。

Google Analytics的工作原理

首先,我們來看一下Google Analytics的基本工作原理。Google Analytics通過在網頁中嵌入一段GA的JS代碼,然后這段GA的JS代碼會收集相關信息發送到Google Analytics的服務器以完成數據統計。

在頁面中,如果調用了_trackPageview函數,GA就會向Google的服務器發送統計信息,這個是如何實現的呢?
因為,我們知道跨域的AJAX請求是受限制的,GA通過向Google服務器發起一張1像素的gif圖片來發送相關的信息給Google的服務器。

如圖所示:

Google Analytics 原理

主要參數解釋:

  1. utmac:GA賬號ID
  2. utmcc:當前頁面GA所需的所有Cookie值,這個很關鍵。
  3. utmcs: 瀏覽器的編碼
  4. utmdt: 頁面的標題
  5. utmn: ?gif的隨機ID,以免圖片緩存。
  6. utmr: 頁面的referURL

此外還有一些其他的電子商務相關的參數等。

不只一張圖片
GA并不只是發送一張gif請求,有些時候GA會發送多張gif請求,如下圖所示,我們執行了一個電子商務的track,通過Firebug觀察,GA一共發送了4個請求。
Google Analytics電子商務追蹤

Google Analytics代碼的基本設置

Google Analytics目前分為異步版本和非異步版本,我們推薦最好使用異步版本的代碼。

傳統代碼(非異步)

<script type="text/javascript">// <![CDATA[
   var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www."); document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E"));
// ]]></script><script type="text/javascript">// <![CDATA[
   try{ var pageTracker = _gat._getTracker("UA-xxxxxx-x"); pageTracker._trackPageview(); } catch(err) {}
// ]]></script>

傳統代碼中,pageTracker是GA追蹤代碼的主要對象,如果我們見到pageTracker就可以認定它是非異步的傳統GA代碼。

異步代碼

 var _gaq = _gaq || [];
  _gaq.push(['_setAccount', 'UA-XXXXX-X']);
  _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);
  })();

異步代碼中,_gaq是GA用于追蹤的主要對象,_gaq在剛開始是一個javascript數組,在GA的完整的js加載之后_gaq就成為了一個GA的完整實例。

_gat 對象
在GA中,有一個全局對象_gat,官方的GA文檔中描述,_gat應該僅僅用于創建跟蹤對象,而不應該用它來做其他的追蹤。因此,我們應該通過_gaq的push方法來追蹤其他任何操作。

但是,這里有一點需要注意,通常情況下我們會把GA的js代碼放在頁面的末尾,如果我們需要在頁面加載的時候就用如下代碼追蹤一個用戶動作(如:電子商務交易),

var _gaq = _gaq || [] ;
_gaq.push(['_addTrans',
    txID,           // order ID - required
    'Acme Clothing',  // affiliation or store name
    '11.99',          // total - required
    '1.29',           // tax
    '5',              // shipping
    'San Jose',       // city
    'California',     // state or province
    'USA'             // country
  ]);
  _gaq.push(['_addItem',
     txID,           // order ID - required
    'DD44',           // SKU/code - required
    'T-Shirt',        // product name
    'Green Medium',   // category or variation
    '11.99',          // unit price - required
    '1'               // quantity - required
  ]);
  _gaq.push(['_trackTrans']);

上面的代碼不會起作用,原因是調用_trakTrans前必須先調用_trackPageview。因此,最佳的實踐是把GA的追蹤代碼和GA的JS加載代碼分開。
把這部分放在頂部

// <![CDATA[
    var _gaq = _gaq || [];  
   _gaq.push(['_setAccount', 'UA-XXXXX-X']);  
   _gaq.push(['_trackPageview']);  
 // ]]

把JS的加載放在頁面的尾部

  (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);
  })();

這樣,在頁面的HTML中,如果調用需要調用任何的GA函數,都不會有任何問題。

Drupal中有一個Google Analytics的模塊,但是該模塊沒有把兩個代碼分開,所以我們建議還是手動修改一下這個模塊,或者通過手動加載Google Analytics代碼到頁面中,這樣能更好的發揮GA的異步追蹤的特性。

關于異步代碼加載位置,請參考博文:正確使用 Google 統計代碼的異步加載特性

Google Analytics的其他高級特性會在后續文章中陸續討論。


聲明: 本站所有文章歡迎轉載,所有文章未說明,均屬于原創,轉載均請注明出處。
本文有效鏈接: http://www.tbdskt.live/2012/04/google-analytics-mechanism/
版權所有: Drupal與高性能網站架構 http://www.tbdskt.live


, ,

發表評論

電子郵件地址不會被公開。 必填項已用 * 標注


二 × 5 =

您可以使用這些 HTML 標簽和屬性: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

引用:0

下面所列的是引用到本博客的鏈接
Google Analytics之工作原理和應用技巧 來自 Drupal與高性能網站架構
頂部
四川时时彩投注平台