网站分析方法与数据可视化-郑灿双

网站分析方法与数据可视化腾讯数据平台部Johnnyzheng（郑灿双）Agenda•网站测速统计•站内广告效果分析•指定来源跟踪•页面可视化之页面热区图•页面可视化案例分享网站测速•网页渲染和资源拉取的耗时统计scripttype=“text/javascript”var_speedMark=newDate();/scriptthis.url.push(&r3=+(newDate()-_speedMark));问题1：如果嵌入腾讯分析的cgi位置不在末尾，计算的网页渲染耗时就不准确。问题2：需要站长额外增加脚本段(DZ论坛除外)，提高了技术门槛。站内广告效果分析•监控网站内指定媒体素材的曝光及其点击情况第二步：监控代码转换•将素材html代码到管理台做转换•JS正则，为媒体素材源代码增加预定义的click事件•采集脚本库负责收集广告位的曝光及其点击信息指定来源跟踪•通过自定义标识对网站来源进行分流，从而有效衡量不同转化质量。编辑素材或者交换链链接，增加来源标识收集来源分流标识，增加相应上报字段按照来源分流标识进行汇总数据可视化•1.链接热点图–当使用链接热点图监控你的网站页面的时候，您可以直观的观察页面上点击元素被点击的次数和百分比。–代表作：CrazyEggOverlay百度统计链接点击图•2.热区图–监控访客在您网站某个页面上的所有点击行为，通过热区图的绘制展现，可以很直观的看出页面哪里是热的，进而进行页面元素的调优和改进。–代表作：CrazyEggHeatmapPtmind可视化点击热图腾讯分析页面热区图页面热区图–将用户点击行为相关数据采集组织起来，上报接入server待解析计算。–去毛疵数据，数据合并，标准化。–将点击数换算为(0,1]的比率，再映射为(0,255]区间的值。–点击坐标转换，合并生成灰度热图，渲染渐变彩色热区图。热区图-数据采集收集客户端用户点击行为的位置坐标信息方案1：每个站点一个热区配置列表脚本，在监控脚本内部请求它，后台根据配置更新时间重新生成。方案2：非静态监控脚本，提供cgi，借助缓存和cron程序，达到动态更新热区图页面配置的目的。将所有点击坐标均转换为满屏下的x，y标准坐标，并上报此时分辨率，到后台转化为相对于屏幕中轴的x，y坐标热区图-数据采集P0是满屏下面的点击坐标，P为非满屏幕状态下。通过将非满屏下的点等效转化为满屏状态下的点击坐标。？热区图-数据预处理去毛疵数据相对比较简单过滤掉x，y小于0或者超过阀值的数据：将单点的点击坐标数据按照10*10的正方形块做聚合，统一映射到重心点坐标。将点击数以最大点击数为基准转换为(0,1]的比率。防止因为点击量分布不均匀导致绘制的热区图颜色过渡不平滑，需要将其平滑打散。热区图-颜色换算由之前的数据处理得到的均匀分布的比率值，在这里转化为相应的rgb值，并绘制灰度图。热区图-生成热区图用户通过前端直观的看到页面哪里是热区。1、利用iframe加载用户的真实的配置页面。1、创建与满屏视窗等大的透明div，置于iframe上。2、div加载经过前三步渲染而来的彩色渐变图。1、针对热区图初始化拉框工具js库，支持用户拉框统计。更多数据可视化案例1、矩阵图2、气泡散点图3、雷达图4、TreeMap5、实时交易图6、更多…谢谢大家！