主页 > 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.drupal001.com/2012/04/google-analytics-mechanism/
版权所有: Drupal与高性能网站架构 http://www.drupal001.com


, ,

发表评论

电子邮件地址不会被公开。 必填项已用 * 标注


+ 1 = 八

您可以使用这些 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与高性能网站架构
顶部