您應該使用什麼顏色來增加銷售額?

已發表: 2021-05-13

A/B 測試再次向我們表明,我們的品味和顏色偏好並不總是與訪客的一致。 或者更確切地說,您在網站上展示的顏色雖然可能很有吸引力,但不一定會為您帶來最多的銷售額。 事實上,你會發現很多關於色彩心理學的文章,這些文章研究了每種顏色如何引發不同的情緒反應,以及這些如何以不同的方式說服你的觀眾。

色彩傳達的情感指南以及在徽標中使用它們的品牌
色彩傳達的情感指南,以及在徽標中使用它們的品牌(來源:The Logo Company)。

本月,當我們最近更改了 Nelio Content 產品計劃和定價頁面設計時,我們認為這是一個絕佳的機會來分析我們的每個計劃中應該顯示哪些顏色以獲得更多銷售。

在原始頁面的設計中,作為藍色的粉絲,我們提出了以下 Nelio 內容計劃頁面的設計:

在為其創建 A/B 測試之前,Nelio Content 的計劃和價格頁面的屏幕截圖
在為其創建 A/B 測試之前,Nelio 內容計劃和定價頁面的屏幕截圖。

很酷,對吧? 但是,如果您一直在閱讀我們每個月進行測試的經驗,您就會知道,在製定業務決策時,您不應只關注自己的品味,而應獲取真實數據,因為這才是真正能告訴您的什麼對你的底線影響最大。

因此,本月的 Nelio A/B 測試測試分析了我們定價頁面上的哪種配色方案將產生更多收入。

以藍色變化顯示的 Nelio Content 計劃的屏幕截圖
我們 A/B 測試的原始版本:Nelio Content 計劃以藍色變體顯示。

創建定價頁面的測試

在為網站的任何元素創建 A/B 測試之前,我們始終建議您對網站上的工作進行分析,您在哪些方面存在更多摩擦和問題,並就您可以改進的地方提出假設。 從您生成的假設列表中,優先考慮那些將對您的目標產生最大影響的假設。 也就是說,登陸頁面和定價頁面可能比博客文章對增加銷售額的影響更大。

在這種情況下,我們創建此測試的主要動機是:由於我們正在更改 Nelio Content 計劃並重新設計了整個定價頁面,因此我們藉此機會確保新設計盡可能使用最佳配色方案

除了原始版本之外,我們決定使用這些顏色組合創建另外兩個變體:

A/B 測試的第一個變體中顯示的 Nelio 內容計劃的屏幕截圖
A/B 測試的第一個變體中顯示的 Nelio 內容計劃的屏幕截圖。

在第一個變體中,我們決定以今年非常流行的柔和色彩來展示計劃。

Nelio Content 的第二個 A/B 測試變體計劃的屏幕截圖
A/B 測試的第二個變體中顯示的 Nelio 內容計劃的屏幕截圖。

我們創建了第二個變體,如上圖所示,我們只想用紫紅色突出標準計劃,而其他兩個計劃用最深的藍色背景和綠色按鈕顯示它們。

一般來說,我們可以選擇其他顏色,甚至創建其他配色方案,但創建許多替代方案的問題在於,要獲得具有統計意義的結果,您需要進行更多訪問。

創建 A/B 測試

為了創建 A/B 測試,我們一如既往地使用我們自己的插件 Nelio A/B 測試。 只需從官方 WordPress 插件目錄下載它並將其安裝在您的網站上即可創建這樣的測試。 如果您仍然對使用哪個 A/B 測試插件在您的網站上創建測試有疑問,我建議您閱讀我們對 WordPress 的 A/B 測試插件的比較。

Nelio A/B 測試非常通用,因為它允許您創建任何 WordPress 元素的 A/B 測試。 在這種情況下,我們創建頁面的 A/B 測試。 這種類型的測試允許您通過將原始頁面複製到新的替代頁面中來創建新的變體。 在我們的測試中,我們只是簡單地改變了每個計劃的背景顏色,如上所述。 如果您想更改您使用的頁面模板的一部分,您可以通過創建替代模板並運行頁面模板的 A/B 測試來實現。

在以下屏幕截圖中,您可以看到測試的定義:

Nelio Content 計劃的 A/B 測試定義的屏幕截圖
Nelio 內容計劃頁面上的 A/B 測試定義的屏幕截圖。

接下來,在創建任何 A/B 測試時,您必須設置要在測試中衡量的目標,以確定最有效的目標。 在這種情況下,我們定義了要在測試中測量的 4 個目標:

  • 點擊任何計劃的按鈕
  • 單擊基本計劃按鈕
  • 單擊標準計劃按鈕
  • 點擊 Plus 計劃的按鈕

創建所有這些後,我們所要做的就是開始測試並等待結果。 Nelio A/B 測試負責將流量分成三個隨機組,以便每個組只能看到一個定義的變體,並跟踪每個變體和目標獲得的轉化。

A/B 測試結果分析

經過一個月零九天的測試,我們以幾乎 100% 的置信度獲得了具有統計意義的結果。 讓我們詳細分析每個目標以及我們能夠從測試中得出的結論。

第一個目標是衡量對任何定價表計劃按鈕的點擊次數(該表在頁面上顯示兩次)。

分析執行的 A/B 測試的第一個目標的結果
分析執行的 A/B 測試的第一個目標的結果。

在這種情況下,結果顯示第二個變體,即替代 C,是比原始版本獲得近 130%(準確地說是 129.6%)點擊次數的變體。 相比之下,以柔和顏色顯示計劃的變體要差 25.5%。 如果我們只有這個測試目標,備選方案 C 將取得壓倒性的結果。

我們的第二個目標集中在基本計劃按鈕收到的點擊次數上。 讓我們看看結果如何變化:

執行的 A/B 測試的第二個目標的結果分析截圖
分析執行的 A/B 測試的第二個目標的結果。

請注意,如果我們只關注基本計劃的點擊次數,第三個變體與原始版本的差異雖然仍然相當大,即提高了 73.7%,但不如我們分析所有點擊次數那麼大。 而在柔和色變體的情況下,與前一種情況一樣,它也比原來的差,但差異為 12.3%。 如果您考慮一下,這可能是有道理的,因為變體並不專注於特別突出基本計劃。

現在讓我們看看我們在想要衡量標準計劃點擊次數的結果中獲得的結果。

執行的 A/B 測試的第三個目標的結果分析截圖
分析執行的 A/B 測試的第三個目標的結果。

在這種情況下,第三個變體的改進,也就是計劃中以更醒目的顏色脫穎而出的變體,甚至比原始版本多實現了 228.1% 的點擊量。 因此,如果您對突出顯示任何計劃是否有任何影響有任何疑問,那麼從這個測試中可以清楚地看出,人們會被最引人注目的元素所吸引。

最後,讓我們看看最新的計劃會發生什麼:

執行的 A/B 測試的第四個目標的結果分析截圖
分析執行的 A/B 測試的第四個目標的結果。

在這種情況下,與原始 C 相比,替代 C 的改進幾乎是 3%,置信度為 95.7%。 無論如何,在所有替代方案中,Plus 計劃的轉換很少。 事實上,我們的大多數客戶一開始更願意選擇較低的計劃,然後再切換到不同的計劃。

結論

考慮到我們從 A/B 測試中獲得的結果,我們得出的結論是,標準計劃以紫紅色脫穎而出的版本比任何其他變體都好得多。 因此,最好將其作為我們網站上的最終版本應用。

應用 A/B 測試的獲勝變體的屏幕截圖
最終應用 A/B 測試的獲勝變體的屏幕截圖。

如您所見,只需單擊一下,Nelio Content 定價頁面的最終版本就會成為通過測試的版本。 當然,起初我們可能認為藍色配色方案是一個不錯的選擇,但我們的喜好和品味對於增加銷量並沒有多大用處。 A/B 測試是那些用真實數據向我們證明什麼是真正有效的測試。 您還在等什麼來創建您的 A/B 測試以提高您網站的轉化率?

Baher Khairy 在 Unsplash 上的精選圖片。