笔记 by 车东

基于鼠标点击跟踪的用户点击行为分析

内容摘要: 在像网站首页这样的资源比较集中的页面中,那些栏目最经常被用户点击?居左居右对广告的点击率的影响是什么? “一切用数字说话”:以上问题都可以通过跟踪浏览器客户端的鼠标行为,按区块对页面进行点击行为的分析。

页面点击统计系统设计

输出: 页面上不同区域的点击量统计。

数据采集: 原理: 通过JAVASCRIPT的鼠标触发事件,动态将当前鼠标的坐标,客户端的分辨率传递到统计服务器上。

如果要往服务器端发请求,做计数器,插入一个图片是最简单的方法,这里是一个简单的例子:

/* (C) 2003 - 2004 www.chedong.com

 * Free for all users, but leave in this  header

 * click based user analysis:
 * usage: touch a empty click.gif or create a static page on at server
 * including following script into your html page
 */

document.onclick = clickStat;

function clickStat() {
    // create a new empty element
    var image = document.createElement("");

    // record client screen size and mouse coordinate
    tempX = event.clientX + document.body.scrollLeft;
    tempY = event.clientY + document.body.scrollTop;
    image.src = "http://www.chedong.com/click_stats.php?width=" + screen.width + "&x="
+ tempX + "&y=" + tempY;
    image.height = 0;
    image.width = 0;

    //send request to stat server
    document.body.insertBefore(image);
    return true;
}

通过全局的onClick事件,每次向统计服务器发一个请求:http: //www.example.com/click_stat.php?width=1024&x=345&y=567 其中:1024x768是屏幕分辨率,345是鼠标X坐标,567是鼠标Y坐标。 点击统计程序click_stats.php会以上信息到日志文件中。

数据输出: 从WEB日志中将相应统计提取出来。然后针对不同页面建立配置文件,将页面区块按照以下格式建立配置文件: #X1 Y1 X2 Y2 comments 0 0 1024 100 navigator 0 100 1024 200 top_story …

再利用用统计脚本根据指定区域的配置,将各个区域的点击量进行汇总。

💬 历史评论

以下 10 条评论从旧版 Movable Type 博客迁移而来。

王元涛 · 2007-10-14 22:53

会不会用户每点一下鼠标,浏览器进程条就要有一次加载过程,造成体验很差?


notbad · 2008-08-22 15:54

用ajax,后台提交,用户体验不会有中断


hkebao · 2008-11-24 09:04

请问一下:在火狐浏览器中如何来实现呢?感觉好像是不行的哦!因为火狐中不支持event对象


lai · 2009-02-18 11:30

我们公司在用的JYC统计就有类似这样的鼠标点击行为分析功能,很不错。 http://www.adjyc.com


西门吹牛 · 2009-08-26 15:09

多谢楼上,JYC统计功能果然很强,我们也用上了。


maxiu · 2009-09-20 11:42

试用了JYC统计,很强大。他们的客服技术很强。


china-home · 2009-10-14 17:01

今天才知道JYC。试了试,还不错。


hktao · 2010-02-21 20:59

jyc统计的确强大。我们公司用了。


· 2010-03-26 22:56

正在用JYC统计,很好很强大!


kelch · 2010-08-18 16:18

当窗口获得焦点的时候,自动为页面上所有的input为button,以及所有的button添加mouseup事件。 当用户在进行操作的时候就会全部记录下来。 代码: window.onfocus=function setEventFunc(){ var inputs = document.getElementsByTagName(“input”); for(i=0;i