zz什么是beacons 在Web Analytics中的应用（网站分析的灯塔）

    一直很想写篇关于beacon的文章，今天找资料时，无意间找到了一篇很好的英文文章，写的很好，现将其翻译过来，供大家学习。（省得我自己再写了！哈哈哈！让您见笑了啊！） 

英文原文地址： 
http://www.seolion.com/how-web-beacons-work/ 

    友情提示：阅读完本文后，如果您觉得还是有些迷茫，您不妨再仔细阅读下以上的英文原文。由于作者的翻译水平有限，可能有很多地方翻译的不太准确（虽然有些地方我已经阅读原文很多遍，但是有的地方还是觉得翻译的不太好。），请大家多多谅解吧。哈哈哈！！！ 

    Web beacons通常是一张1*1像素的透明图片,被包含在网页或Email中。它是客户端与Web Analytics数据收集服务器间进行数据交换的桥梁。 

    下面让我们看看Web beacons是如何将数据传输到服务器的。 

    Web beacons是通过javascript tags实现的。 
    （原文：Web beacons through javascript tags） 
    通常，Web Analytics数据收集方法是通过javascript tag实现的。每个需要被分析或被跟踪的网页会包含一些javascript的代码。例如，下面是statcounter分析工具（它是免费的，这点很重要）的代码： 

<!-- Start of StatCounter Code -->
< script type="text/javascript">
    <!-- var sc_project=2296441; var sc_invisible=1; var sc_partition=21;
    var sc_security="0d580486"; //-->
</ script>
< script type="text/javascript" src="http://www.statcounter.com/counter/counter_xhtml.js">
</ script>
< noscript>
    <div class="statcounter">
        <a class="statcounter" href="http://www.statcounter.com/">
            <img class="statcounter" src="http://c22.statcounter.com/counter.php?sc_project=2296441&java=0&security=0d580486&invisible=1"
            alt="web tracker" />
        </a>
    </div>
</ noscript>
<!-- End of StatCounter Code -->

    让我们来分析一下这段代码。 
    前5行代码，是一些和statcounter账号相关的需要被初始化的变量（例如，sc_project, sc_invisible等等）。接下来的一行代码是引用一个statcounter的js文件。 
    statcounter的代码做了很多的事情。例如，它会找到当前被访问的页面的referring URL是什么，你使用的浏览器的窗口大小以及你的IP等等。 
    
    接下来我们就开始讲解今天的重点：Web beacon. 
    Web analytics收集到的数据就是通过statcounter的脚本完成的。在完成上述数据收集的初始化操作之后（前5行代码），收集的数据将会被发送到statcounter的服务器。 
    Web beacon(或者称它为“附属图片”)使这一切得以实现。首先，准备一个图片请求用的URL（通常在这个URL中包含了需要被收集的数据的所有变量及数值信息），然后Javascript生成一个<img>标签，其src属性就是刚才准备好的URL。当浏览器在准备显示这个图片时，statcounter.com的脚本会根据请求中的参数（在第一步中已经准备好的）来收集数据，然后statcounter.com会发送一张1*1像素的透明图片作为response（别忘了，它是一个图片请求），并最终在浏览器中显示出来（这一切，对于访问者而言，并没有感觉出有什么变化，因为它只是一张1*1像素的透明图片）。 


    Web beacons是作为被监测网页的数据传输载体。 
    （原文：Web beacons as part of a mobile specific web page） 

    您可能注意到以上statcounter代码中的<noscript>部分。在<noscript>的代码中，有一个<img>标签。<img>标签中src属性的URL中就是所包含的一些需要被传递的基本变量信息。当浏览器可识别<script>标签，但无法支持其中的脚本时，<noscript>标签中的内容才会被执行。（如果浏览器支持javascript，那么<noscript>标签中的内容就不会被执行）。在移动设备上打开一个具有监测tag的网站时，通常会包含类似上面的<noscript>标签，此时，noscript中的代码会被执行。 
    上面代码示例中的<script>和<noscript>在功能上的区别仅在于，是否有任何javascript代码被引用或发生数据交换。因为，<script>和<noscript>中的代码都会生成<img>图片标签，并且其src属性的值是准备好的URL。但是使用<noscript>时有个限制，不能像<script>所引用的javascript代码所完成的工作那样，在第一步就传递所有需要用到的值（例如，浏览器的窗口大小等），但我们可以在服务器级别控制<img>标签的输出，并找到需要传递的必要数据（如，客户端的IP地址，URL引用等）。(这一段，作者觉得翻译的不太好，大家可以参看英文原文的上下文，再仔细体会下。) 

    至此，本文已经为大家介绍了采用page tag方式对网页进行分析的一般方法(page tag方式一般都会使用到beacon)，并且还谈到了采取此方法是如何对数据进行收集的。如何您使用过一些网站分析工具的话，如Google Analytics, Omniture SiteCatalyst等（感兴趣的读者，还可以参看我写的《国外主流网站分析工具介绍》这篇文章：http://yhz61010.javaeye.com/admin/blogs/709282），您会发现，它们的统计方式和上面讲的基本是一样。不过Omniture还提供了另外一种方法来收集数据，那就是使用Omniture的javascript tag时，你可以预先提供一些想要监测的自定义变量，这样你就可以统计更多的数据，对访问者的行为进行更好的分析。

阅读全文
类别：Web Analytics 查看评论