監(jiān)控你的轉(zhuǎn)化率是建立一個(gè)盈利的電子商務(wù)業(yè)務(wù)的關(guān)鍵。大多數(shù)分析工具可以幫助您測(cè)量這些數(shù)據(jù)。

你的轉(zhuǎn)化率是通過簡單地用期望的行動(dòng)數(shù)量除以給定時(shí)期的網(wǎng)站訪問者數(shù)量來計(jì)算的。例如，如果你的網(wǎng)站每5000個(gè)訪問者就有50次轉(zhuǎn)化率，那么轉(zhuǎn)化率就是1%。

根據(jù)您運(yùn)行的具體在線業(yè)務(wù)類型，您的轉(zhuǎn)換可能包括在線銷售、電子郵件注冊(cè)、添加到購物車或您希望衡量的任何其他KPI。但在電子商務(wù)商店，你的主要焦點(diǎn)應(yīng)該是你的購買轉(zhuǎn)化率。

平均而言，電子商務(wù)商店的購買轉(zhuǎn)化率為1% - 2%。更重要的是，專家說好的轉(zhuǎn)化率在2%到5%之間。這應(yīng)該是你衡量網(wǎng)店成功與否的基準(zhǔn)。

轉(zhuǎn)換的結(jié)果，我的最后一個(gè)網(wǎng)站重新設(shè)計(jì)

在我們深入了解我是如何提高我的轉(zhuǎn)化率的細(xì)節(jié)之前，這里是我的總體結(jié)果以及我是如何進(jìn)行我的實(shí)驗(yàn)的。

首先，我經(jīng)營著一家名為Bumblebee Linens的電子商務(wù)商店，在網(wǎng)上銷售手帕。

因?yàn)槲业木W(wǎng)站從不能直接轉(zhuǎn)化為銷售的內(nèi)容頁面獲得大量流量，所以我根據(jù)最可預(yù)測(cè)的流量來源來衡量轉(zhuǎn)化率。

因此，我所有的轉(zhuǎn)換數(shù)據(jù)都來自于目標(biāo)PPC廣告流量來源，如谷歌Shopping和谷歌Adwords。畢竟，我的谷歌廣告流量是非常穩(wěn)定的，總是轉(zhuǎn)換在一個(gè)一致的百分比。

在我重新設(shè)計(jì)我的網(wǎng)站之前，我的電子商務(wù)商店的轉(zhuǎn)化率徘徊在3%左右，高于平均水平。但是網(wǎng)站的外觀和感覺已經(jīng)過時(shí)，迫切需要更新?？偟膩碚f，整個(gè)重新設(shè)計(jì)花了大約7周時(shí)間，花費(fèi)了我大約1840美元。

以下是我更新后的設(shè)計(jì)與原設(shè)計(jì)的對(duì)比結(jié)果:

桌面轉(zhuǎn)化率提高了46%

手機(jī)轉(zhuǎn)化率上升了26%

平板電腦轉(zhuǎn)化率提高了32%

這篇文章的其余部分將重點(diǎn)介紹導(dǎo)致這些增長的重新設(shè)計(jì)的具體因素。(注意:我同時(shí)進(jìn)行了所有的重新設(shè)計(jì)更改，因此很難確定哪個(gè)特定的優(yōu)化貢獻(xiàn)最大。)

8個(gè)電子商務(wù)設(shè)計(jì)技巧，以優(yōu)化您的轉(zhuǎn)化率

如果你的電子商務(wù)商店表現(xiàn)不佳，用戶體驗(yàn)的許多方面可能會(huì)對(duì)銷售產(chǎn)生負(fù)面影響。即使是看起來無關(guān)緊要的設(shè)計(jì)選擇，比如字體大小或按鈕的顏色，也會(huì)對(duì)整體轉(zhuǎn)化率產(chǎn)生重大影響。

如果你想系統(tǒng)地提高你的電子商務(wù)商店的轉(zhuǎn)化率，你應(yīng)該遵循這8個(gè)設(shè)計(jì)步驟。

1. 使用一致和互補(bǔ)的配色方案

在重新設(shè)計(jì)網(wǎng)站時(shí)，使用color.adobe.com選擇互補(bǔ)色。

一個(gè)精心選擇的配色方案可以瞬間吸引顧客的注意力，喚起顧客的情感，促使他們采取行動(dòng)。畢竟，顧客對(duì)你網(wǎng)站的感覺是決定你結(jié)賬還是退貨的關(guān)鍵因素。

一個(gè)設(shè)計(jì)良好的電子商務(wù)商店應(yīng)該使用至少三種互補(bǔ)的顏色，在你的網(wǎng)站的每個(gè)頁面上一致地應(yīng)用。

如果你對(duì)顏色沒有很好的眼力，你可以使用免費(fèi)的工具，如color.adobe.com，它可以幫助你混合和搭配不同的顏色，使它們搭配得很好。

在我的網(wǎng)站重新設(shè)計(jì)中，我想要一種現(xiàn)代的感覺，所以我選擇了青色、亮粉色和黃色作為我的調(diào)色板。

我還在我的網(wǎng)站上為每種顏色指定了特定的用途:

青色的應(yīng)用給場(chǎng)地一個(gè)明亮的，整體的顏色，年輕和時(shí)尚的感覺;

黃色用來吸引人們對(duì)免費(fèi)航運(yùn)和特價(jià)等營銷元素的注意;

網(wǎng)站上的所有動(dòng)作按鈕都使用了亮粉色。

總的來說，你的電子商務(wù)商店的每一個(gè)頁面都應(yīng)該有一個(gè)主要的行動(dòng)號(hào)召(使用明亮的顏色，比如亮粉色)，引導(dǎo)顧客離結(jié)賬更近。

例如，在我的首頁上，亮粉色的按鈕“購買我們的個(gè)性化收藏”彈出頁面，立刻吸引了用戶的注意力。我們希望訪客購買我們的個(gè)性化產(chǎn)品，因?yàn)槲覀兊膫€(gè)性化產(chǎn)品是我們店里利潤最高的產(chǎn)品。

2. 簡化你的導(dǎo)航

你的菜單太復(fù)雜了嗎?導(dǎo)航條占用了太多屏幕空間嗎?

對(duì)于電子商務(wù)商店來說，一個(gè)好的經(jīng)驗(yàn)法則是盡量減少顧客點(diǎn)擊購物車的次數(shù)。因此，您應(yīng)該避免將產(chǎn)品類別嵌套在超過一個(gè)層次結(jié)構(gòu)級(jí)別中。

如果你的商店里有太多的分類，不能一次全部顯示，選擇你的最佳銷售分類為你的主菜單，并把你的流量較少的分類合并在一個(gè)單獨(dú)的標(biāo)簽。

對(duì)于我的商店，我決定使用一個(gè)頂級(jí)的懸停樣式下拉菜單，如下圖所示。

頂級(jí)導(dǎo)航是組織和顯示產(chǎn)品類別的一種方法。

我以前的設(shè)計(jì)使用了左手式的導(dǎo)航，占用了太多的屏幕空間。騰出多余的空間讓我可以把我的分類和產(chǎn)品圖片放大300%。有了我的新導(dǎo)航菜單，每個(gè)訪問者可以添加到購物車只需三次點(diǎn)擊:一次點(diǎn)擊找到一個(gè)產(chǎn)品類別;一鍵查看產(chǎn)品說明;一鍵添加到購物車。

一旦你設(shè)計(jì)好你的菜單，假裝你是一個(gè)顧客，嘗試在你的網(wǎng)站上購物。內(nèi)容是否容易閱讀?重要的元素會(huì)跳出來嗎?你能馬上找到你需要的信息嗎?從客戶的角度分析你的網(wǎng)站將幫助你改善用戶的購物體驗(yàn)。

3.在每個(gè)頁面上顯示信任因素

免費(fèi)送貨、輕松退貨和信任是推動(dòng)轉(zhuǎn)化率的關(guān)鍵。

信任是你必須與客戶建立的最重要的價(jià)值。

除非你是亞馬遜或大型商店，否則人們可能從未聽說過你的品牌，你必須向他們保證，從你的商店購買是安全的。

由于亞馬遜在電子商務(wù)領(lǐng)域的影響力，大多數(shù)客戶在第一次在網(wǎng)上精品店購物時(shí)會(huì)尋找3樣?xùn)|西:

快速免費(fèi)送貨;

簡單的回報(bào);

一種獲得客戶支持的方法。

顯示你的電話號(hào)碼和電子郵件地址是非常重要的!增加你的營業(yè)時(shí)間也有助于使你的網(wǎng)站看起來合法的新訪客。如果你沒有一個(gè)可識(shí)別的品牌，客戶會(huì)想知道在遇到問題或問題時(shí)，他們能接觸到一個(gè)真實(shí)的人。

在上面的圖片中，你會(huì)注意到我把我的信任因素放在了頁眉，所以它們可以在每一個(gè)頁面的折疊上方看到。我們還上了《今日秀》和一些雜志。所以我確保在每一頁的底部顯示這個(gè)社會(huì)證明。

不要猶豫炫耀你的成就來加強(qiáng)信任。

此外，客戶的評(píng)價(jià)為你的網(wǎng)站提供了社會(huì)證明和可信度。因此，定期接觸滿意的客戶，獲得推薦和認(rèn)可是很重要的。在我們重新設(shè)計(jì)的網(wǎng)站上，你會(huì)發(fā)現(xiàn)推薦部分就在我們的媒體報(bào)道下面。

推薦可以為你的網(wǎng)站提供社會(huì)證明和可信度。

記住，作為一個(gè)不知名的商店或品牌，要產(chǎn)生轉(zhuǎn)化率，你首先必須獲得客戶的信任。如果他們購買的東西有任何問題，讓他們聯(lián)系你或者獲得全額退款很容易。通過表現(xiàn)出對(duì)客戶滿意度的真誠關(guān)心，隨著時(shí)間的推移，你將能夠建立穩(wěn)固的聲譽(yù)。

4. 強(qiáng)調(diào)你獨(dú)特的價(jià)值主張

用戶平均花5.59秒看你網(wǎng)站的文字內(nèi)容。在這5.59秒內(nèi)，你必須抓住他們的興趣，否則他們會(huì)從你的頁面跳出來。你必須立刻告訴用戶你賣什么，為什么他們應(yīng)該從你的商店而不是競爭對(duì)手那里購買。

更重要的是，你網(wǎng)站上的每一個(gè)頁面都應(yīng)該傳達(dá)你獨(dú)特的價(jià)值主張。一個(gè)獨(dú)特的價(jià)值主張是一個(gè)簡明的陳述，描述什么使你的業(yè)務(wù)特別和概述你的商店比任何人做得更好。展示你獨(dú)特價(jià)值主張的最好方法是使用引人注目的圖片和引人注目的文案。

例如，這是用戶在我的主頁上看到的第一件事:

用戶馬上就會(huì)看到我們最暢銷的個(gè)性化手帕的大圖片。在這張圖片的旁邊是一個(gè)清晰而簡潔的價(jià)值主張，接著是一個(gè)在我們店購物的行動(dòng)號(hào)召。

展示你的價(jià)值主張不應(yīng)該局限于你的主頁。我們還包括我們獨(dú)特的價(jià)值主張，在每個(gè)類別頁以及?？偟膩碚f，你應(yīng)該在你網(wǎng)站的每個(gè)登陸頁面上包含你的價(jià)值主張。

5. 優(yōu)化產(chǎn)品頁面的視覺層次結(jié)構(gòu)

網(wǎng)站上的每個(gè)頁面都應(yīng)該有一個(gè)單一的目標(biāo)。對(duì)于你的產(chǎn)品頁面，你的目標(biāo)是讓顧客加入購物車。

在設(shè)計(jì)產(chǎn)品頁面時(shí)，必須將邏輯視覺層次結(jié)構(gòu)應(yīng)用于設(shè)計(jì)。視覺層次結(jié)構(gòu)是用戶在頁面上處理信息的順序，對(duì)于產(chǎn)品頁面，必須有一個(gè)清晰的路徑以盡可能少的干擾添加到購物車按鈕。

這是我以前的產(chǎn)品頁面的截圖:

正如你所看到的，我的舊產(chǎn)品頁面是壓倒性的。所有的設(shè)計(jì)元素都試圖同時(shí)吸引你的注意力，許多不同的行動(dòng)呼吁融合在一起。為了改進(jìn)我的產(chǎn)品描述，我更新了配色方案，并將我的產(chǎn)品圖像放大了266%。我還更改了按鈕在更符合邏輯的流程中的位置。

這是重新設(shè)計(jì)的產(chǎn)品頁面今天的樣子:

通過調(diào)整頁面元素的大小、顏色、對(duì)比度和對(duì)齊方式，我現(xiàn)在迫使客戶以設(shè)置的路徑處理我的產(chǎn)品信息，該路徑直接引導(dǎo)我的主要行動(dòng)調(diào)用。例如，亮粉色將人們的注意力吸引到“加入購物車”按鈕上，而不是“評(píng)論”按鈕上。此外，通過使用藍(lán)色文字顏色和藍(lán)綠色背景，我向顧客保證與我們一起購物是安全和無風(fēng)險(xiǎn)的。

總的來說，以這種方式重新排列設(shè)計(jì)元素幾乎使我的添加到購物車的比例增加了一倍。

6. 簡化結(jié)帳過程

使用我們以前的網(wǎng)站設(shè)計(jì)，我們會(huì)定期收到來自困惑的客戶的反饋，他們不確定是否需要一個(gè)帳戶來購買我們的產(chǎn)品。

下面是我們以前的結(jié)帳頁面:

正如你所看到的，有太多的選擇。畢竟，顧客不需要三種結(jié)賬方式，而且選擇也有點(diǎn)多。

結(jié)帳頁面現(xiàn)在是這樣的:

我沒有提供3個(gè)獨(dú)立的付款選項(xiàng)，而是將它們合并到一個(gè)，并添加了一個(gè)單獨(dú)的Paypal選項(xiàng)(稍后會(huì)有更多介紹)。首先，只有不到6%的客戶創(chuàng)建了一個(gè)賬戶，所以沒有理由將創(chuàng)建賬戶作為一個(gè)單獨(dú)的選擇。此外，顯示登錄表單會(huì)帶來更多麻煩，因?yàn)榇蠖鄶?shù)客戶甚至沒有帳戶。因此，我決定在默認(rèn)情況下完全隱藏表單。

總的來說，當(dāng)您設(shè)計(jì)結(jié)帳過程時(shí)，請(qǐng)記住這些優(yōu)化原則。

原則#1:刪除頁面中所有不必要的元素。不要讓客戶思考和隱藏所有不經(jīng)常使用的元素。

原則#2:展示信任標(biāo)志，以確?？蛻舻陌踩Y(jié)帳。在上面的圖片中，你可以在付款頁面的右邊找到信任的標(biāo)志。

7. 為移動(dòng)用戶優(yōu)化結(jié)帳過程

十分之四的手機(jī)用戶如果在輸入個(gè)人信息時(shí)遇到困難，就會(huì)放棄購物車。人們不喜歡用一個(gè)小小的鍵盤輸入他們的聯(lián)系方式和信用卡信息。更重要的是，小按鈕和太多的表單字段讓移動(dòng)用戶望而卻步。79%的智能手機(jī)用戶通過移動(dòng)設(shè)備在線購物，這就是為什么你應(yīng)該優(yōu)化移動(dòng)設(shè)備。

如今，響應(yīng)式設(shè)計(jì)是很常見的，但如果不小心，仍然可能會(huì)把事情搞砸。下面是我的結(jié)帳流程在桌面上的樣子:

下面是結(jié)帳頁面在移動(dòng)設(shè)備上的樣子:

在移動(dòng)設(shè)備上，用戶的購物車內(nèi)容是折疊的，這樣它就不會(huì)占據(jù)整個(gè)屏幕?？偟膩碚f，以下是我對(duì)checkout所做的移動(dòng)優(yōu)化:

優(yōu)化#1:保持你的付款表單簡短和甜蜜

移動(dòng)用戶應(yīng)該能夠點(diǎn)擊結(jié)帳頁面上的按鈕而不意外地點(diǎn)擊其他選項(xiàng)。此外，按鈕應(yīng)該大到足以在移動(dòng)設(shè)備上點(diǎn)擊。

考慮到手機(jī)的屏幕尺寸更小，讓你的結(jié)賬表格簡短而又甜蜜，沒有額外的選擇。另外，確保您關(guān)閉了表單字段的自動(dòng)更正功能。否則，當(dāng)用戶試圖輸入地址時(shí)，手機(jī)的自動(dòng)更正功能可能會(huì)讓他們感到沮喪。事實(shí)上，我們?cè)?jīng)有一位顧客在iPhone上輸入他們的城市時(shí)非常沮喪，以至于他們打電話給我們，很沮喪地抱怨。

要解決這個(gè)問題，只需向所有文本輸入字段添加以下標(biāo)記。

此外，在輸入電話號(hào)碼時(shí)，您應(yīng)該始終顯示一個(gè)數(shù)字鍵盤，而不是常規(guī)鍵盤:

優(yōu)化#2:在可能的情況下自動(dòng)導(dǎo)入客戶數(shù)據(jù)

手機(jī)用戶輸入的信息越少越好。支付方式如Paypal Express和亞馬遜支付可以簡化結(jié)賬過程。這些第三方支付處理程序自動(dòng)填寫客戶的賬單和運(yùn)輸信息，這減少了打字，提高了轉(zhuǎn)化率。

為了提供更方便的結(jié)賬方式，我實(shí)施了PayPal的One Touch操作，這一操作使我的手機(jī)轉(zhuǎn)化率提高了31%。

這里有一個(gè)實(shí)現(xiàn)Paypal的小竅門:確保在用戶輸入信息之前，在付款過程中顯示Paypal按鈕。否則，就會(huì)破壞導(dǎo)入他們信息的目的!在我的付款過程的第一步，我解釋每一個(gè)支付選項(xiàng)深入。

這些簡單的改變讓我的轉(zhuǎn)化率有了很大的改變。我網(wǎng)站上的PayPal用戶幾乎翻了一番，從13%增長到23%!

8. 增加緊迫感

大多數(shù)顧客喜歡逛櫥窗，讓顧客行動(dòng)起來的最好方法就是營造一種緊迫感。

每當(dāng)我進(jìn)行銷售，一個(gè)巨大的黃色倒計(jì)時(shí)計(jì)時(shí)器顯示在網(wǎng)站的每個(gè)頁面。

注意:需要注意的是，我們只在實(shí)際進(jìn)行銷售時(shí)使用這個(gè)計(jì)時(shí)器。否則，你就會(huì)冒著讓客戶麻木或失去信任的風(fēng)險(xiǎn)。

另外，我還在結(jié)賬頁面上顯示了倒數(shù)計(jì)時(shí)器，給人一種完成支付過程的緊迫感:

這些額外的設(shè)計(jì)元素迫使客戶盡早采取行動(dòng)。

最終的想法

優(yōu)化你的轉(zhuǎn)化率是一個(gè)持續(xù)的過程。測(cè)試你的結(jié)果是追蹤你改進(jìn)的唯一方法。

永遠(yuǎn)不要跟隨你的直覺，總是聽數(shù)據(jù)。畢竟，有時(shí)候一個(gè)丑陋的網(wǎng)站可以轉(zhuǎn)化為一個(gè)美麗的網(wǎng)站。

無論如何，我上面演示的設(shè)計(jì)技巧將為您提供一個(gè)堅(jiān)實(shí)的基礎(chǔ)。從那里，你可以進(jìn)一步改善你的網(wǎng)站，并通過反復(fù)測(cè)試和調(diào)整優(yōu)化你的轉(zhuǎn)化率。好運(yùn)！