Google Optimize A/B Testing 使用筆記

Google Optimize A/B Testing 使用筆記

2020.09.15更新:實驗結束,報表出來了,今天新增最後一段的報表部份。

本篇要解決的問題

最近想對本站的右側版面做些排列上的修改,很好奇像「最新文章」、「大家都在看」……之類的是不是真的有擺的需要?而點擊「請喝咖啡」的比例偏低,如果移上去是不是成效會比較好?

這時候就想到了 A/B Test,比較改變前、後的成效有沒有差,看完成效後再決定要不要變動。

之前有用過 Google Optimize,他可以直接在頁面上移動或修改 UI,覺得方便,因此這次就還是用這套。

這篇就是把使用的過程給整理起來,如果看到這篇的你有興趣的話,那這篇就是一篇參考的筆記文。沒興趣的話也可以看一下 Optimize 有哪些使用上的流程,因為 A/B Test 會有用到的一天。


選用 A/B 版本測試

先登入好 Google 帳號,進到 Optimize 的頁面:https://optimize.google.com/

頁面上如果之前有設定過測試了,就會看見列表,如果是第一次進來,就會看見歡迎的卡片:

Google Optimize 首頁
Google Optimize 首頁

點擊「開始」就會進入設定。

首先要填寫的是這次測試的主題名稱、網域,以及選擇執行哪一項測試:

建立體驗表單
建立體驗表單

Augustus 填寫了針對「請喝咖啡」按鈕移動的測試:

填寫完建立體驗的表單
填寫完建立體驗的表單

網址欄的部份之後會有額外設定,這邊先填主要網域,在下一步我們要設定變化版本時,就會是開啟這邊的網址來做變化。

體驗的類型 Optimize 提供了 5 種,這次要測試的變數只有一個,就是「請喝咖啡」往上移,因此就選用第一個「A/B 版本測試」。

填完並按下「建立」,下一步是要新增一個變化版本:

新增變化版本
新增變化版本

點下「新增變化版本」後,就是要取一個名稱,填完後會看見一張很長的表,表上有很多欄位需要填寫及設定,這邊就填寫幾個必要的。


設定 A/B 版

這一步是最重要的一步,建立一個變化版本。

原版的我們叫 A 版,變化過的我們叫 B 版,A/B Test 就是在測這二版對我們的目標哪一個影響比較大?

之所以會選用 Optimize 的原因,就在於它 免費 在設定變化版本上,可以直接在頁面上做變動,不用去寫程式碼。

第一張卡片會看到「指定目標如子類」,點擊「編輯」:

點擊編輯
點擊編輯

接著會出現一個提示框,提示要安裝擴充功能:

安裝擴充功能的提示框
安裝擴充功能的提示框

點了「查看擴充功能」,在 Chrome 上就可以直接安裝,安裝完後重整頁面再點一次編輯,就會開啟我們在第一步中填寫的網址:

開啟我們指定的網址
開啟我們指定的網址

接下來就是直接在頁面上改我們要的東西啦~

Optimize 提供的介面,可以改變元素,也可以直接拖拉區塊,真心覺得這功能很厲害又實用。

這邊我們把請喝咖啡的 <section> 給移到上面,就完成了:

移動要測試成效的區塊
移動要測試成效的區塊

改完後按下「儲存」,因為本站有設定從 http 開的話會強制轉到 https,而一開始填網址時沒指定是 http 還是 https,Optimize 就預設成 http(嗯?Google 不是自己都在推 https 嗎?),所以有出現一個錯誤的提示框,寫說填寫的網址跟改變的網址不同,問說要不要更新:

網址不同的錯誤訊息框
網址不同的錯誤訊息框

按下「更新網址」,就會幫我們自動更新了。


要執行測試的網址規則

「指定網頁」的設定,是指使用者到哪些頁面就要執行。

這次的測試是全站性質的,因為 Let’s Write 全站都有側邊欄,因此設定上要是全部的網址都要。

預設是「當網址符合」,這樣就會變成只有首頁才會執行,必須要修改,點擊鉛筆的 icon:

點擊鉛筆 icon 來修改網址規則
點擊鉛筆 icon 來修改網址規則

可以選擇的規則有多種,就看自己想要執行測試的網址要怎麼判斷:

選擇網址規則
選擇網址規則

因為本站是全部頁面都要執行測試,就選擇「開頭是」。

Optimize 還可以立即測試,看自己寫的規則對不對:

立即測試網址規則
立即測試網址規則

連結 GA 並設定目標

要看 A/B 的成效,就是看目標的轉換率,這一張卡片就是設定連結 GA 以及 GA 中設定的目標。

評估與目標
評估與目標

一開始先設定要連結到哪一組 GA 上,Optimize 的資料最後會入到 GA 中。

連結完 GA 後,下一步就是設定要拿什麼目標來當作這次 A/B Test 的檢測成效。

建議是在 GA 上設定目標後,再來 Optimize 中選擇目標。畢竟目標不會只是為了這次測試而生,而是長期要去看的。

因為 Let’s Write 的 GA 已經有設定好目標,選目標的部份就直接選用,這步很快速地便設定完成。

選好實驗目標
選好實驗目標

埋程式碼

這一步雖然有「程式碼」三個字,但很簡單,就跟 GA 一樣,要埋的碼 Google 都會提供,複製貼上就好。

在未埋碼的時候,卡片上會顯示有錯誤,點擊「檢查安裝狀態」:

點擊檢查安裝狀態
點擊檢查安裝狀態

點擊了以後就會出現要安裝的程式碼:

出現要安裝的程式碼
出現要安裝的程式碼

埋碼的部份,Let’s Write 是用 GTM 埋,GTM 埋完後,因為頁面有快取的關係,需要先到測試的網站,清完快取後再回到 Optimize 按下「檢查安裝狀態」,不然會因為快取關係一直顯示未安裝的錯誤。

埋完碼並驗證成功後,就會看到正確安裝的訊息:

正確安裝的訊息
正確安裝的訊息

建議要埋在 <head> 的部份,是為了防止頁面閃爍,不在 <head> 裡也沒關係 閃就閃沒在怕的

埋完程式碼以後,「電子郵件通知」記得開起來,實驗上有什麼重要訊息才不會漏掉:

開啟電子郵件通知
開啟電子郵件通知

執行測試

以上,A/B Test 就設定完了,最後就是開始執行。

滑到頁面的最上方,會看見一個「開始」的按鈕:

開始按鈕
開始按鈕

勇敢的按下開始,就會出現再次確認的訊息框:

再次確認
再次確認

再勇敢的按下開始,就真的開始了:

開始執行 A/B Test
開始執行 A/B Test

接著就是等待實驗結束看報表,由於執行實驗的時間比較久,就等實驗結果出來再來補充報表的部份囉~


結果報表

這次時間設定17天,約2.5周,因為在設實驗時有開啟 email 通知,因此快結束跟結束都有收到信件通知。

打開來 Optimize 的後台,切到「報表」後,看到實驗結果就笑了:

找不到勝出版本
找不到勝出版本

竟然直接就找不到勝出版本啊~

收集的工作階段數都到快7600了,到底要多少才夠呢?

點了 Learn more 後,看到文件上說:「收集的數據不足以提供足夠的信心來宣布結果,因此需要更多數據。如果實驗仍在運行,您可能需要使其運行更長的時間。」

雖然結果是寫找不到 A、B 版哪一個好,但報表頁中還是有提供這個期間的實驗數據。

Optimize 提供的報表(點擊看原圖)
Optimize 提供的報表(點擊看原圖)

看數字看得出勝出的是 B 版,就是把「請喝咖啡」區塊整個往上移的。

之所以會無法判斷,是因為信賴區間不足,但……這種統計學的東西早就還給大學教授啦~XD。

報表上有一項「成為最佳組合的機率」是 28%比72%,至少可以拿這項當依據,說 B 版的結果比較好。

因為在設定時有設連到 GA 中,因此點擊「在 Analytics(分析)中查看」,就會直接進到 GA 報表中:

進到 GA 中
進到 GA 中

進到的第一頁,可以看到的數據就跟在 Optimize 相同,但不一樣的是上面的頁籤還可以切換。

切到「網站使用情況」,可以看到 A、B 二版的單次工作階段頁數、平均工作階段時間長度、新工作階段百分比、跳出率:

在 GA 中還可以看到的數據
在 GA 中還可以看到的數據

如果再最上面的指標那邊,切成網頁指標,又可以再看到其他的:

切成「網頁指標」
切成「網頁指標」

切成網頁指標後,可以再看到二版的不重複網頁瀏覽量、平均網頁停留時間、入站、跳出率、離開百分比、網頁價值:

網頁指標的數據
網頁指標的數據

可以看到這些數據蠻好的,比方說在 Optimize 上看到的最佳組合會是 B 版,但它是以「目標」來當作判斷依據。

如果 B 版達成的目標數高,但會造成高跳出率呢?或是停留時間減少呢?

這些也都是 A、B 版最後決定要考慮的事情。

以上,就是報表的部份,懂統計學的人會看得出更多資訊吧?

另外因為本站有預訂了第二個實驗,因此這個實驗就沒再拉長。

至於 A、B 版的結論,目前是 B 版勝出,等第二批實驗結束,就會將請喝咖啡移到上面了。

Summary
Google Optimize A/B Testing 使用筆記
Article Name
Google Optimize A/B Testing 使用筆記
Description
本篇大綱:本篇要解決的問題。選用 A/B 版本測試。設定 A/B 版。要執行測試的網址規則。連結 GA 並設定目標。埋程式碼。執行測試。結果報表。最近想對本站的右側版面做些排列上的修改,很好奇「請喝咖啡」的區塊移上去,是不是成效會比較好?
Augustus
Let's Write
Let's Write
https://letswrite.tw/wp-content/uploads/2020/08/logo_512.jpg
訂閱
通知
guest
0 Comments
Inline Feedbacks
看所有留言