【DTalk实践】谷歌Philip Walton:我如何为构建的每个网站使用Google Analytics?

2018-08-15 12:16:27 / 打印

我从2005年起就是Google Analytics的用户,谷歌把自己的产品当成一个海量的数据挖掘和分析系统来设计,并始终把收集更多有价值的数据(包括通过对企业提供免费Google Analytics,)做为一个核心工作来不断推进,以达到搜索相关性的不断提高。

谷歌之所以可以做到这一点,Google Analytics的可用性和数据分析能力满足了常规网站分析的大部分需求是很重要的。很多中国的大型互联网团队内部开发的流量分析系统很多都参考了GA的设计。

这几年我在培训不同行业的企业团队时,发现了一个明显的规律:“许多企业完全没有准确采集和监测到需要的用户行为数据,或者监测到了但几乎没有参考并应用到业务优化流程里。”  这里面有一个隐含的原因,就是技术团队对数据本身的业务价值重视程度不够。所以Philip的这篇文章写的挺有价值的。

Dtalk 创始人 顾青

Google Analytics是一个强大且复杂的工具。但不幸的是,很多人不懂得充分使用这个工具。

有很多非常厉害但免费的内容解释如何运用Google Analytics,但是大多局限于针对市场和广告的使用案例,非常少的针对那些只需要刚好了解人们对他们建立的网站的使用情况的开发者。

在过去的3年里,我负责Google Analytics,在那个时间我学习到远超过我预想的非常多的知识。我深深的着迷一些Google Analytics厉害的功能,同时我也遇到了一些令人苦恼的问题。

这篇文章是我三年学习的最种成果,并且是针对网站和APP开发者。因为这篇文章很长,我将其分割成几个关键的主题。

·     加载分析编程(analytics.js)

·        跟踪自定义数据

·        错误跟踪

·        性能跟踪

·        运用自动跟踪插件

·        测试实施

·        区分本地/垃圾邮件的数据

·        数据的汇报和可视化

加载分析编程(analytics.js)

我认为,降低用户体验水平是永远不能被接受的。换句话说,跟踪脚本应该经常不同时的被加载(包括数据库比如analytics.js和你自己的跟踪代码),并且你发送到数据服务器的数据不应该干扰到其他你的网络要求。

当目前你跟踪片段是正确的,这个就完全是好的。一个关于同步跟踪的片段问题是,这个仍旧将创建2个HTTP要求(一个是analytics.js,另个一个发送初始界面浏览量),会退回加载活动,这会影响到另一个加载度量,并且有可能推迟代码按规定在window加载后运行。

这里有2个当时去解决这个问题。第一个是等侯直到加载活动促发这个跟踪代码,但是这个不是最佳方法因为这个将会导致丢失用户早前的界面访问量。

第二个观点是运用信标传输机制beacon transport mechanism去传输所有的点击,这个是运用navigator.sendBeacon()。当点击发送到sendBeacon(),不会影响界面加载或非加载的状态。

以下是更正后的运用信标传输机制beacon transport mechanism的片段。

放置你的跟踪代码在不同的文件夹

这个错误跟踪片段介绍是建议添加这个代码放在所有页面的前面(<head> of all pages)。如果你恰好像这样运用编写你的片段,那是可行的。但是当我们添加更多的代码去跟踪传统的用户交互,把所有的编码放在<head>是个糟糕的注意。

我喜欢将全部的与分析有关的编码放在不同的文档里,以便在其他站点代码加载完成后不同时的加载。

如果您使用支持代码拆分的构建工具(如Webpack),则可以从脚本的主入口点延迟初始化跟踪代码,如下所示:

您的自定义跟踪代码将存在于其自己的模块中,并且可以通过其导出的init()函数进行初始化:

现在,您的模板文件只包含<script async>标记来加载analytics.js以及您网站的常规JavaScript代码:

请注意,如果您不使用具有代码拆分功能的构建系统,则可以通过分别编译跟踪代码并通过<script async>加载它,就像使用analytics.js一样加载它,从而获得相同的效果。[1] 另外请注意,您不必担心加载顺序; analytics.js专门用于处理首次加载,最后加载或根本不加载的情况(例如,在被扩展阻止的情况下):

跟踪自定义数据

Google Analytics中的维度是将您的使用情况数据细分为多个类别的一种方式。例如,报告中可用的一些内置维度包括浏览器,设备类别,语言,页面等。

虽然内置维度很好,但有很多维度非常有用,而analytics.js不会跟踪这些维度。幸运的是,Google Analytics有一个称为自定义维度的功能,因此您可以实现并跟踪所需的任何维度。

在本节的其余部分中,我将列出我在每个网站上跟踪的自定义维度,并解释我为什么使用它们。

跟踪版本

任何时候您对软件进行更改都必须对更改进行版本设置,以便将特定功能设置为特定版本号。分析实施与其他任何事情一样都是如此。

如果您更新分析实施以开始跟踪一系列新维度,或者如果您更改所收集数据的格式(无论出于何种原因),那么您可能只想报告正在运行的用户子集中的数据你最近的变化。

在Google Analytics中执行此操作的最简单方法是创建名为Tracking版本的自定义维度,并将其范围设置为“Hit”(因为它适用于所有匹配)。

在analytics.js中,您通过其索引来引用自定义维度,但是我认为在创建了一些自定义维度(我们将会)后会很快产生混淆,因此我总是创建一个将自定义维度名称映射到其自身维度的对象指数。

现在,如果您在跟踪器上设置了此自定义维度值,则会将该值与所有将来的匹配值一起发送。 如果这是您的第一个跟踪版本,请将其设置为'1'。

有了这个新的维度,任何时候您对跟踪实施进行重大更改都可以增加版本号。然后,在报告时间,您可以将报告细分为仅包含第一次点击包含匹配的跟踪版本的用户的会话。

以下是我使用的细分市场定义的样子(如您所见,我在版本13上):

客户端ID

Google Analytics使用客户端ID将个人点击与特定用户相关联。除非您定制了设置,否则analytics.js会自动为您生成此值,将其存储在浏览器的Cookie中,并将其全部发送。

Google Analytics内部使用此客户端ID,但不会在报告中提供给您。

幸运的是(正如您可能已经猜到的那样),您可以通过创建一个称为客户端ID的自定义维度来解决此限制,将其范围设置为“用户”,并将其指定为与由analytics.js创建的本机客户端ID相同的值。

截图快捷键又强健

要理解为什么这很有用,请考虑以下情况:假设您在报告中注意到点击的按钮不应该可见的页面中的一些点击事件。所以你问自己:我的网站怎么可能进入这个破碎的状态?

没有此客户ID维度,您只能汇总用户报告,这具有明显的局限性。

要在跟踪代码中获取由analytics.js创建的客户端ID值,请调用get()方法读取存储在跟踪器上的值。然后,您可以调用set()方法将该值分配给您新创建的自定义维度:

此代码通过将函数传递给ga()命令队列来工作,只要载入analytics.js,该命令就会使用默认跟踪器对象调用。

有时候,用户与您的网站进行交互,同时打开多个窗口或标签。 Google Analytics目前不收集特定于窗口/标签的数据,但您可以创建另一个名为Window ID的自定义维度,将其范围设置为“Hit”,并在页面加载时为其分配随机值。这样,从当前窗口上下文发送的每个命中可以稍后通过窗口ID维度与该窗口上下文相关联。

这对于单页面应用程序特别有用,其中用户可以有很多浏览量,而无需重新加载整页。

要创建一个唯一的值,你必须包含一个函数来生成它。我喜欢这个uuid()函数,因为它很短,但是你可以使用你喜欢的任何函数:

然后,在向Google Analytics发送任何数据之前,在您的跟踪器对象上设置WindowID值:

Google Analytics(分析)界面可让您轻松报告汇总数据,但如果您希望获得个人用户,会话或命中级别数据的访问权限,那么您几乎不走运。

有一项称为BigQuery Export的功能,允许您导出所有数据(这会为您提供命中级粒度),但仅适用于高级客户,因此绝大多数用户无法访问它。

我之前提到过,通过自定义维度跟踪客户端ID对调试意外的用户交互数据非常有用。这些命中级别的自定义维度使得它更加容易,因为它们允许您深入了解单个用户交互(当然是匿名),并查看这些用户正在做什么,何时以及以何种顺序进行操作。最终让您为每个人创造更好的网站。

要跟踪点击ID,点击时间和点击类型自定义维度,请先在Google Analytics中创建它们并将其范围设置为“点击”。然后,在您的跟踪代码中,覆盖buildHitTask并在模型上设置这些值,从而确保将它们应用于每个匹配:

点击ID维度被设置为调用我们的uuid()函数的结果(就像我们使用Window ID所做的那样),点击中时间维度被设置为当前时间戳,点击中类型维度被设置为已经存储在 跟踪器(跟客户端ID一样,由GA跟踪,但在报告中没有提供)。

错误跟踪

您是否确实知道您的代码是否按照预期(并且没有错误)为访问您网站的每个用户运行?即使您在发布代码之前进行了全面的跨浏览器/设备测试,仍然有可能出现问题,或者某些未测试的浏览器/设备组合会失败。

像Track:js和Rollbar这样的付费服务可以为您提供这种服务,但您可以通过Google Analytics免费获得许多免费服务。

我通过添加全局错误事件侦听器来追踪未处理的错误,作为页面<head>中的第一个<script>。 首先添加这一点非常重要,因此它会捕获所有错误:

此代码将任何未处理的错误存储在侦听器函数本身的数组中。然后,一旦分析代码的其余部分加载完毕,您可以使用以下功能报告这些错误:

有经验的Google Analytics(分析)用户可能会想知道为什么我会在事件发生时发送这些错误,而不是异常点击(专门为此目的而添加到Google Analytics中的功能)。

第一个谷歌浏览器同步书签程序主题!

简单的原因是异常点击并不出现在实时报告和事件点击中。这是一个耻辱,因为在你想要实时知道的所有击中类型中,异常命中显然位于该列表的顶部。

性能跟踪

几年前,Google Analytics推出了网站速度跟踪功能,允许您报告NavigationTiming API中的大部分指标。这是一个很好的初始步骤,但不幸的是(与异常点击类型一样),它有太多的限制。如果你真的关心这些指标,你可能想要自己跟踪它们。

Site Speed功能可以运行,因为analytics.js会自动为用户的1%的网页加载时间。问题是1%不是大多数站点特别有代表性的示例,并且无法增加此限制,因为采样在处理时在客户端和服务器上都强制执行。

另一个问题是定时点击在分段中不可用,这意味着您无法运行报告 - 例如 - 只包含页面加载时间超过10秒的用户。

自定义指标(类似于自定义维度)没有任何一个限制,所以这就是我用来执行所有性能跟踪的内容。

自定义性能指标

要了解如何通过自定义指标跟踪性能,请考虑Navigation Timing API中更常用的三个可用于衡量关键呈现路径的性能指标:

-responseEnd:服务器完成向浏览器发送响应的时间点。

-domContentLoadedEventStart:在DOM中处理并加载所有页面的内容,并且浏览器可以开始渲染页面。

-loadEventStart:加载所有页面的初始资源时。

一旦您在Google Analytics中创建了上述三个自定义指标(并将其范围设置为“Hit”,并将其格式设置为“Integer”),您可以使用以下代码来跟踪它们:

现在,您可以通过将响应结束时间,DOM负载时间和窗口负载时间的总计除以总事件度量值来获取平均负载时间值。

中位数与平均数

考试: 到 jquery ajax

我相信你们中许多人读到最后一句话,并且想:我不想知道平均数,我想知道中位数!

没有中位数值是Google Analytics的常见批评,并且有充分的理由。但是如果你已经实现了我上面提到的命中级别的自定义维度,那么你就可以自己计算中间值,因为你将拥有命中级别的粒度。更多信息请参见下面的报告部分。

使用autotrack插件

自从创建autotrack库以来,我显然有点偏见,但可能值得指出的是,我所做的主要原因是因为我发现自己在构建的每个站点上一遍又一遍地重复实现相同的功能。

自从我这样做以来,我知道其他人可能也是如此,我觉得没有更正式的方式来跟踪基本上每个人都想跟踪的事情,这似乎很疯狂。

我不会在这里详细讨论,因为你可以阅读关于这些插件在autotrack文档中做什么的全部内容,但是我想简要地提一下我在几乎每个站点上使用的插件:

outboundLinkTracker

自Google Analytics(分析)不会跟踪导航到外部域名以来,必须拥有这些内容。

cleanUrlTracker

讨厌在页面报告的URL中看到一堆营销参数?我也是。 这个插件以开发友好的方式解决了这个问题(而不是必须使用视图过滤器)。

maxScrollTracker

跟踪用户滚动页面的距离实际上是一个相当复杂的问题。 如果做得不好,意外地瘫痪用户的滚动体验也很容易。这个插件为你处理所有这些复杂问题。

pageVisibilityTracker

Google Analytics中的会话持续时间实际上是一个非常糟糕的指标。 它不会跟踪在会话的最后一页上花费的时间(意味着单页面访问的会话持续时间为0),并且它没有考虑页面打开时的时间,而是在后台选项卡中。 使用页面可见度是一种更好,更准确的方式来跟踪用户在您的网站上活跃的时间。

urlChangeTracker

显然不是每个网站都是单页面应用程序。 但是,如果你的是,包含这个插件要比试图手动跟踪动态网页浏览要容易得多。

测试你的实现

在创建autotrack时,我在公开发布之前对这些插件进行了大量实验和测试。任何时候,如果您在网站上实施新功能的跟踪,就会冒错误的风险,而且由于Google Analytics不允许您在发送后修改或修改数据,因此出错的代价可能很高。

为了解决这个问题,我几乎总是在我的网站上至少使用两个跟踪器。一个发送数据到我的产品属性,一个发送数据到我的测试属性。

我的测试跟踪器用于发送我正在测试的实验数据实现,以确保它们按预期工作。一旦我确信它的正确性,我就开始跟踪生产跟踪器的功能。

我在analyticsjs-boilerplate中包含了一个多重跟踪器示例,但您可以从下面的代码中获得它的工作原理。本质上,您为每个跟踪器分配一个不同的名称(和跟踪ID),然后将所有命令加上相应的名称:

过滤掉本地/垃圾邮件数据

有时垃圾邮件发送者会将假数据发送到您的GoogleAnalytics帐户,以宣传他们阴暗的业务。 如果你不相信我,只要搜索“Google Analytics垃圾邮件”,就会发现许多人抱怨问题并提出修复建议。

但是,有时发送的错误数据是您自己的错误 - 也许您运行了整个测试套件,但忘记禁用CI环境中的analytics.js。

对这两个问题都有一个简单的解决方案,那就是使用View Filters。 我在我的所有网站上使用以下两个过滤器:

-主机名过滤器(例如,只有URL主机名匹配philipwalton.com)

- Reg正则表达式匹配过滤器,用于特定于我的网站的自定义维度值(例如,跟踪版本或点击ID)

为了让Google Analytics处理点击,它必须通过所有视图过滤器。由于在本地运行站点时(或在临时服务器上)发送的匹配将与主机名不匹配,因此它们不会显示。即使垃圾邮件发送者足够精明,可以发送与主机名匹配的匹配字符,但他们也不太可能会匹配您的某个自定义维度。

根据我的经验,这两个过滤器可以100%有效地防止不需要的数据。

报告并可视化您的数据

如果您已遵循本文中的所有技术或在您的网站上实施了analyticsjs-boilerplate,我可以为您提供的报告数据的最重要的建议是了解这些功能:自定义报告,计算出的指标以及Google Analytics报告API。

自定义报告

Google Analytics中的标准报告很有用,但如果您已经做了任何自定义(例如,创建的自定义维度或自定义指标),则需要使用自定义报告来访问和可视化这些数据。

例如,在关于跟踪自定义数据的部分中,我提到用Client ID维度来隔离单个用户,并使用Window ID维度来单独加载页面。以下是一份报告,列出了特定用户第一次会话中的所有综合浏览量(按命中时间顺序),同时显示页面和窗口ID。

要创建此报告,我从我的其他报告中挑选了一个随机客户端ID和会话(我选择了包含多个独特浏览量的会话以使其更有趣)。 然后,我创建了一个自定义报告,仅过滤匹配客户端ID和会话计数维度的匹配:

计算的指标

通过计算的指标,您可以定义可从现有指标中派生出的新指标。

例如,autotrackmaxScrollTracker插件会跟踪给定会话中每个页面的最大滚动百分比。 但是,由于GoogleAnalytics只报告报表日期范围内所有会话的指标总计,因此,此数值本身并不特别有用。

但是,当您创建指标来计算会话中每个独特综合浏览量的平均最大滚动深度值时,您突然有一个非常有用的指标。

以下是我创建的自定义报告的屏幕截图,其中显示了过去7天内本网站上平均最高滚动比例最高的网页。

以下屏幕截图显示了如何配置此计算指标:

中位数,直方图和分布

我在上面提到过,您可以使用命中级自定义维度来计算中位数和其他分布数据。

作为分发数据有用的原因的示例,请考虑上面的最大滚动报告。 虽然显示的平均值是将一个维度与另一个维度进行比较的好方法,但它们并未显示用户通常在我的网站上滚动的完整图像。

下面的柱状图显示了过去几天滚动的所有用户的最大滚动百分比(每个会话)的分布情况。中位值为80%。

要创建上述直方图,您需要使用GoogleAnalytics报告API来获取数据,然后使用可视化库(上面的示例使用Google图表)创建图表,因此它比使用Google稍微复杂一些Analytics UI,但对于更高级的报告需求,绝对值得投资学习这些工具以充分利用数据。

将命中级度量分布可视化的另一个很好的例子是我们在去年的Google I / O webapp中测量的性能数据。我们创建了一个自定义维度,用于指示浏览器是否通过Service Worker加载页面,并且我们创建了一个度量标准来跟踪第一次绘制的时间。根据这些数据,我们可以看到服务人员使用情况如何影响桌面和移动设备的加载时间。

在桌面上,第一次绘制的中间时间是由服务工作者控制的583毫秒,而未控制时为912毫秒。

移动时,服务人员控制的中位数为1634毫秒,未控制时为1933毫秒。

开发人员希望Google Analytics不会默认跟踪很多功能。 但是,只需要一点配置和额外的代码,就可以使用Google Analytics现有的可扩展性功能,几乎满足您的任何需求。

本文简要介绍了在我的“样板”analytics.js实现中包含大量这些功能的基本原理。 如果您想了解最佳实践的最新状态,则应遵循Github上的analyticsjs-boilerplate回购协议。 随着新的跟踪技术和最佳实践的出现,我们应该持续更新。

DTalk创办人顾青老师的观点:Google Analytics的价值和局限

Google Analytics的确是一个非常有价值的数据产品,特别是在谷歌主导的全球市场上,通过和各广告平台系统和第三方SAAS的数据合作,可以承担非常丰富的数据分析任务。

另外,我们在中也会讲授如何利用Google Analytics提供的一些用户兴趣标签,完善补充企业自己数据产品的画像标签。

但是任何全球流行的软件产品进入中国市场,都会遇到问题,GA也不例外。

1. 由于防火墙的关系,访问不稳定,分析人员使用不便(VPN可以解决)

2. 由于防火墙的关系,数据丢失的比例相比国内产品或自建都要多,具体比例不好估计,每家情况不同(最好是做海外服务器转发)

3. 无法定制实时数据

4. 数据打通很难,即便去做,难度并不亚于自己做数据采集和整合

关键是:如果不做数据打通,没有实时数据应用需求。那GA也就只是个采集观测的数据工具了,除了辅助网站和APP的交互优化和渠道监测外,对于业务提升的能力有限,比如无法支持数据驱动自动化运营和数据挖掘赋能产品(比如个性化推荐和千人千面)。

如果你的团队在通过GA做数据监测和规划自定义数据产品的问题上遇到了诸如这些方面的困难:

▪ 前后端埋点策略

▪ 数据整合及数据清洗

▪ 数据分析和数据挖掘

欢迎与我交流。

我会出席,并分享企业如何获得快速迭代、流量变现、数据驱动的能力。通过建立完善的数据和自动运营能力,企业是有可能在外部环境不断变化,用户不断变化的当下,设计出一条可以健康增长的道路,核心能力是正确的数据驱动职能和认知体系、以及符合业务增长需求的数据产品系统。通过在线旅游、互联网金融和互联网教育行业的不同案例来说明数据驱动业务优化是如何发生的,并公布DTalk有关数据和智能驱动能力的核心知识大纲。

E-Bizcamp CEO 、DTalk创办人

E-Bizcamp CEO,"互联网数据分析及业务优化增长集训营”出品人及核心讲师,曾负责过SiteSell和携程网的搜索、数据分析和产品管理工作。

2018年10月13-14日,DTalk将举办北京站活动。此次大会我们邀请了以下平均在互联网、大数据和人工智能行业从业超过十年的专家云集北京,共同探讨“智能驱动业务增长实践相关内容,将有来自DTalk、百度、HashData、宜人贷、搜狗、吆喝科技、网易等各大公司此方面领域的专家分享工作中的实战经验。

“DTalk智能驱动业务增长实践大会”

“DTalk数据和用户画像驱动产品运营集训营北京站”

大会活动咨询: