如何設計網(wǎng)站的落地頁提高轉(zhuǎn)化率?

如果你想要轉(zhuǎn)化更多的潛在客戶或是增加銷售額,那么你需要的是一個高轉(zhuǎn)化率的落地頁 (Landing Page)。根據(jù) Hubspot 的數(shù)據(jù)[1],擁有超過 30 個落地頁的公司所獲取的客戶轉(zhuǎn)化率,是少于 10 個落地頁的公司的 7 倍。



Hubspot 關于落地頁與用戶流量的數(shù)據(jù)


落地頁是獨立的網(wǎng)頁,專為特定的市場營銷活動或搜索廣告而設計。當用戶點擊搜索結(jié)果、電子郵件或廣告中的鏈接時,落地頁就是用戶“落地”的地方。


與通常具有許多目標并鼓勵探索的網(wǎng)頁不同,落地頁通常會引導用戶完成明確的行為召喚 (Call to Action),例如購買、訂閱資訊或是取得聯(lián)絡。



首頁和落地頁之間主要的區(qū)別


首先我們要明確首頁(Homepage)與落地頁之間的區(qū)別是什么。從 unbounce [2] 給出的示例圖我們可以看到首頁和落地頁明顯不同的布局,首頁有許多鏈接,而落地頁只有一個。


unbounce 對首頁和落地頁之間區(qū)別示例


首頁通常會有許多潛在的干擾因素,落地頁卻非常聚焦。落地頁上的鏈接越少,轉(zhuǎn)化率就越高,這就是為什么專業(yè)營銷人員總會使用落地頁來作為其流量的目的地。


那么,我們要如何創(chuàng)建落地頁面來引導用戶,又不借助操控技巧或灰色策略 (Dark Pattern) 呢?關鍵在于明確的焦點、有說服力的宣傳說明、經(jīng)過深思熟慮的設計和持續(xù)的測試驗證。


開始設計之前,我們必須要有一個明確的焦點,即清晰地定義我們的價值主張 (Value Proposition)



清晰地定義我們的主張


當用戶訪問落地頁時,你只有不到 8 秒的時間來吸引他們的注意力[3]。創(chuàng)建落地頁的第一步,是明確這個頁面是用來做什么的,并盡可能簡明有效地傳遞這個信息。這個信息通常被稱為“價值主張”。


我們可以通過一句話來向用戶傳遞價值主張。這句話由兩個部分組成:你能解決什么問題 (或者提供什么服務) ?你將如何做到?


例如 Skype 的價值主張是:


“Skype 可讓你輕松保持聯(lián)系,通話、聊天和協(xié)作?!?/span>


第一部分概述了它提供的服務,第二部分則說明了服務的具體方式。


Skype 的價值主張同時體現(xiàn)了所提供的服務和服務方式


但要注意,你的價值主張很容易變得毫無意義。例如“一流”、“友好”等修飾詞是任何公司都可以拿來套用的。為了避免言之無物,審視一下你的價值主張的對立面是否依然能闡述有效的立場。例如,如果你的價值主張是:


“我們以合理的價格提供高質(zhì)量的產(chǎn)品?!?/span>


那它的對立面將變得毫不可取:


“我們以天價提供劣質(zhì)產(chǎn)品?!?/span>


這就體現(xiàn)出你的價值主張言之無物了。

但如果你的價值主張是:


“我們向獨具慧眼的買家提供手工產(chǎn)品?!?/span>


那它的對立面將同樣有效:


“我們向大眾市場提供工廠制造的產(chǎn)品?!?/span>


當然,你的價值主張不必局限于這一句話。你可以羅列出你能夠提供的所有優(yōu)勢和特點并加以描述。


Pipedrive 很好地羅列出了產(chǎn)品的服務特點


表明了價值主張后,接下來就該考慮你的行為召喚 (Call to Action) 了。



明確你的的行為召喚


每個落地頁都需要明確的行為召喚:你希望用戶做什么?


為了讓你的落地頁聚焦,提升用戶操作的幾率,你要克制住設置過多行為召喚的沖動。比如,引導用戶在社交媒體上關注你的同時,也會分散他們完成主行為召喚的注意力。 


通常設置一主一次兩個行為召喚是合適的。當主行為召喚是“取得聯(lián)絡”或者“購買”時,次行為召喚就可以是“訂閱資訊”,這為沒有選擇主行為召喚的用戶提供了一個合適的備選。 


次行為召喚的設計相對而言不用過于突出,可以展示在頁面下方,甚至在退出頁面時的浮層上。不過,部分用戶對彈窗非常抵觸,所以要謹慎使用彈窗。


盡管彈窗有時候挺煩人的,這仍是個不錯的在退出時喚起次行為召喚的彈窗應用案例


但即使你能順利地引導用戶達成行為召喚,有時也仍然避免不了其他因素使他們失望。為了應對這種情況,你需要了解問題所在并找到解決方法,這就是我們通常說的異議處理 (Objection Handling) 。



理解用戶異議


阻止用戶在落地頁上操作的原因是什么?是因為要收取運費,或者是擔心隱私問題?相比競對,你的商品看起來過于昂貴?


如果你不能輕松地羅列出用戶可能提出的反對意見,你可能需要通過用研來找到答案。


不必擔心這會花費很多精力,只需在落地頁加上一個單問題調(diào)查即可。你可以在用戶沒有進行任何操作就離開網(wǎng)頁時,向他們提出一個問題:


“決定離開了嗎?請告訴我們不注冊的原因吧,那將會很有幫助?!?/span>


你可以向用戶列出一些可能的選項,或者讓用戶自行補充。


單問題調(diào)查可以幫你知道為什么用戶不進行操作


一旦了解到原因,你就可以開始著手解決它們了。


理想情況下,這意味著你得消除障礙,例如提供免費送貨或退款保證。如果無法消除,也要盡可能在頁面的文案中有相應的反饋。對于異議,解決總是好過忽略的。


例如,麥當勞知道許多人聲稱他們的雞肉來自禽類肉質(zhì)較差的部位。麥當勞沒有無視這些顧慮,而是直接通過他們的網(wǎng)站主動澄清。


麥當勞直面用戶的擔憂


隱私安全就是一個很好的例子。人們在閱讀隱私條例時不會擔心相關問題,但在要提交郵件地址時就會開始有所顧慮。這就是為什么在用戶錄入表單時,展示數(shù)據(jù)保護和隱私安全很有必要。用戶通常不會主動在你的網(wǎng)站上搜索答案,他們只會自覺聯(lián)想到最壞的情況。


將隱私條例與訂閱資訊的表單緊密地排版在一起,這通常會增加轉(zhuǎn)化率


價值主張、行為召喚、異議處理,完成了這些理性工作后,接下來該給用戶帶來更感性的一面了。



塑造你的個性


我們的行為經(jīng)常取決于潛意識層面。根據(jù)發(fā)表在《行為與信息技術》雜志上的研究[4],人們在 50 毫秒內(nèi)就對一個網(wǎng)站產(chǎn)生了初步印象。由于光環(huán)效應 (Halo Effectt),這些初始印象會一直持續(xù)。


換句話說,盡管兩者之間沒有直接的因果關系,網(wǎng)站的品牌和風格塑造了我們對實際產(chǎn)品的印象。這說明了風格的重要性,但更重要的是,我們要清楚地意識到我們想傳達的第一印象是什么,然后確保我們的設計能夠做到這一點。



確定你想要傳達什么


你可以通過創(chuàng)建一個簡短的關鍵詞列表來著手,以此傳達你希望用戶在訪問網(wǎng)站時獲得的印象。


有些關鍵詞非常通用,比如你希望你的落地頁能傳達“可信賴的”。但大部分的關鍵詞還得取決于你的受眾和產(chǎn)品特點。


一旦有了關鍵詞列表,設計師就會基于這些關鍵詞去完成設計,下一步就是測試。



測試你的設計風格


如果設計師提供了多個方案,那么簡單的偏好測試就可以幫你做出選自。你可以詢問用戶哪種設計更“合適”。


簡單的偏好測試通常是確定最佳設計方案的最佳方法


如果只有一個設計方案,則可以進行語義差異調(diào)查[5],讓用戶基于你的關鍵字對網(wǎng)站進行評級。


通過調(diào)查可以確定設計是否使用戶產(chǎn)生了正確的感知


當然,風格并不是設計的唯一考慮因素,視覺層級也得是清晰正確的。



創(chuàng)建你的視覺層級


為落地頁建立清晰的視覺層級可以確保用戶在正確的時機看到正確的信息,并且不會因無關或次要的內(nèi)容而分心。



在正確的時機回答正確的問題


首先,確保你在正確的頁面位置向用戶提供正確的信息。為此,你需要了解人們在看你的落地頁時的思考過程。


當然,我們不能做到百分百確定,因為每個人都是不一樣的。可用性測試也只能是給我們提供一個參考,但我們?nèi)阅苓M行一些有根據(jù)的推測。


通常來說,用戶在查看落地頁時會下意識地提出一系列問題。這些問題依次為:


  • 這個頁面提供了什么?(價值主張)

  • 那對我有什么幫助?(優(yōu)勢)

  • 產(chǎn)品如何運作?(特點)

  • 為什么我要信任此頁面?(社會認同)

  • 接下來我該怎么辦?(行為召喚)


因此,頁面的視覺層級在一定程度上能夠映射用戶提出的這些問題的順序是至關重要的。


例如,典型的落地頁層級可能如下所示:

一個落地頁需要承載價值主張、優(yōu)勢、特點和社會認同


頁面內(nèi)容以正確的結(jié)構順序展示只完成了有效視覺層級的一半,另一個挑戰(zhàn)是確保用戶看到最關鍵的屏幕元素。


我們有多種方式來吸引用戶的注意力,包括但不限于:


  • 定位

  • 顏色

  • 尺寸

  • 意象

  • 動畫

  • 負空間


不過,最有效的技巧可能是最小化頁面上的其他干擾。



簡化你的界面


我們可以通過三個問題系統(tǒng)地檢查落地頁上的每個元素。


簡化落地頁的過程


第一個問題:是否可以刪除這個元素?如果刪除它,后果是什么?這些后果是否會比其他元素造成的認知負擔更具破壞性?


如果不會,那最好將它刪除。如果你覺得這個元素非常有價值無法刪除,那么第二個問題是:我可以隱藏這個元素嗎?我能不能把它放在子頁面、標簽下或者折疊面板中?


Vibecast 將次要內(nèi)容收在了折疊面板內(nèi)


這種方法適用于次要內(nèi)容,盡管部分用戶會想獲得更多詳細信息,大多數(shù)人是不會太感興趣的。


最后,如果這個元素用戶必須知曉、無法隱藏,那么,是否可以縮小這個元素呢?比如人們可能很想知道你的退貨政策,但這個信息并沒有你的產(chǎn)品功能或者優(yōu)勢那么重要。我們可以在視覺上進行適當?shù)娜趸?,讓它不過于搶眼。 


通過這種簡單的方法以及其他設計技巧,你可以創(chuàng)建有效的視覺層級來將用戶的注意力吸引到最關鍵的屏幕元素上,例如行為召喚。但為了確保萬無一失,你還要進行驗證。



測試你的視覺層級


幸運的是,有一種便捷的方法可以測試用戶是否看到了必要的屏幕元素。這種方法叫“五秒測試”。


顧名思義,測試過程是向用戶展示你的設計,五秒鐘后讓用戶回憶他們記住了什么元素。


Usability Hub 提供了便捷的五秒測試


根據(jù)用戶記住的內(nèi)容以及他們回憶的順序,你能更好地了解到頁面層級對吸引注意力到最重要的元素上的有效性。


在設計出色的落地頁時,即使是上線后,驗證也至關重要。



監(jiān)控、迭代和測試


沒有團隊可以在創(chuàng)建落地頁時一步到位,總會有改進的余地。對于落地頁上線后的打磨優(yōu)化,測試是非常重要的一環(huán)。


一旦你的新落地頁上線,必須使用類似 Hotjar 或 Fullstory 之類的用戶行為監(jiān)測工具仔細監(jiān)控。這些工具可以讓你觀察頁面上的用戶行為,從而提出改進建議。 


你可以使用 A/B 測試來對文案、圖像和色彩進行較小的改進,較大的改動可以通過可用性測試來驗證設計原型。 


無論采用哪種方法,最終都會形成一個監(jiān)控、迭代和測試的周期,這將確保任何落地頁的長期有效運作。






附錄:
[1]https://blog.hubspot.com/blog/tabid/6307/bid/15424/the-key-to-more-leads-create-more-targeted-conversion-opportunities-data.aspx
[2]https://unbounce.com/landing-page-articles/what-is-a-landing-page/
[3]https://informatix.com.au/blog/3-ways-to-captivate-your-audience/
[4]http://news.bbc.co.uk/2/hi/technology/4616700.stm
[5]https://www.surveygizmo.com/resources/blog/how-to-measure-attitudes-with-semantic-differential-questions/


原文:Paul Boag , How To Create A Compelling Landing Page, https://www.smashingmagazine.com/2020/04/landing-page-design/

編譯:王佳樂


每天更新,
全站高品質(zhì)素材免費下載!