你的网站访问量,用户数是否已经初具规模?你是否面临KPI增长压力?是时候集成Google Optimize(谷歌优化工具)进行AB测试了。
创建实验容器
第一步是创建一个Optimize的账号,建议GA、GTM和Optimize的账号都是同一个,方便Google校验,省去很多麻烦。
https://optimize.google.com我们来到优化工具首页,登录号谷歌账号,点击Get Started,选择一些邮箱订阅功能和同意谷歌的条款即可成功创建容器。
准备工作
- GA Tracking ID
- GTM 容器ID
- Optimize ID
- Chrome浏览器
- 安装Optimize的插件
开始创建实验

点击创建实验之后,首页需要命名实验并且填写做AB测试的页面。
例如我这里要测试我的搜索CTA的文案Go和Search哪一个的点击率高,命名为Go VS Search,网址就填写我的博客首页damonanalytics.com,点击创建。
创建变体

Google的UI还是很人性化的,按照提示步骤一步一步来即可,做AB测试就跟做物理实验一样需要一个对照组和实验组,改变某个变量看对结果的影响。
点击添加变体,将其命名为Search(随意命名,自己区分即可)。

添加变体表示可以添加更多的实验组达到一举多得的效果,权重占比表示实验的流量占比,比如目前版本的转化率已经达到一个较高的水准,那么可以把权重占比调高,这样不至于影响整体的数据。
点击修改,开始进行改变变量。如果你做好了准备工作(Chrome安装好了Optimize插件),那么应该可以看到:

我们右键选中Go按钮,选择编辑HTML,然后把Value属性改成Search创建变体,然后右上角点击“完成”即可。
网页定位
网页定位表示要做AB测试的页面,例如我这个实验在所有页面都有这个搜索框,因此我把条件设置为“网页包含damonanalytics”。
如果在测试某个购物车页面的Checkout点击率,可以把条件设置成包含cart,毕竟这个实验容器会占用一部分带宽资源,因此越精准越好。
在受众群体定位栏中,还能针对不同的设备、人群等进行定位实验。
关联GA并设置目标
选择实验网站的对应媒体资源与数据视图,下一步就可以开始利用GTM集成Optimize。
打开GTM后台新建代码,代码类型选择Google Optimize。

这里Optimize Container ID就填写优化工具容器ID,GA分析设置就填写一如既往的Setting变量。
我们先保存这个代码,不填写触发器,再到页面浏览的代码中做高阶设置。

注意:触发选择每个页面一次(Once per page)。配置完成后发布该版本。
安装防闪烁代码段
防闪烁的代码的安装是为了防止多个版本前后出现,造成屏幕闪烁的不良用户体验。
谷歌推荐把防闪烁代码段放在紧挨<Head>标签后。
1 2 3 4 5 6 7 8 9 |
<!-- Anti-flicker snippet (recommended) --> <style>.async-hide { opacity: 0 !important} </style> <script> window.dataLayer = window.dataLayer || []; (function(a,s,y,n,c,h,i,d,e){s.className+=' '+y;h.start=1*new Date; h.end=i=function(){s.className=s.className.replace(RegExp(' ?'+y),'')}; (a[n]=a[n]||[]).hide=h;setTimeout(function(){i();h.end=null},c);h.timeout=c; })(window,document.documentElement,'async-hide','dataLayer',4000, {'OPT_CONTAINER_ID':true});</script> |
注意这里的dataLayer初始化代码以及把OPT_CONTAINER_ID换成GTM ID。 把OPT_CONTAINER_ID换成GTM ID。 把OPT_CONTAINER_ID换成GTM ID。
这之后我们运行诊断工具看是否安装成功:

配置目标
配置目标主要是从GA和GTM的目标列表中进行配置,选择其中的一到多个都可以作为测试对象,测试的结果以设置的目标进行衡量。
安排时间
实验的时间可以自定义,一般是一周时间,如果流量很大,三到五天也可以,可以选择勾选邮件通知,来提醒重大的变动。
Final Words
利用GTM部署Optimize优化工具十分便捷,如果诊断无法通过,请按照步骤再排查一遍, 有问题请留言。另外,如果改动较大,例如button的大小,button的位置,建议用预览工具看改动是否会影响用户UI。

Be First to Comment