如何優化網頁轉化率?(上篇)

微博UDC發表於2013-09-23

提要:千萬不要將所有建議照單全收,做出一個四不像網站。你應該將此看作測試網站的技巧工具箱,瞭解對你的產品與使用者而言使用這些技巧的優點與缺點何在,以及如何使它們符合你的巨集觀產品願景。

zhl00

“優化註冊轉化率”這個話題可以扯出一本百科全書的篇幅來。因此我會花大量筆墨來闡述。在此先提醒你們,這將是一篇長文。。(譯者注:差不多等於一章書了,所以拆分成上中下三篇)

我認為優化註冊轉化率的方法概括起來主要就是兩大類:

第一大類,站內優化。包括網頁設計/文案/佈局等。這是個值得深入探討的話題,這也是後面一類方法的基礎。

第二大類,訪問來源優化。有許多種方法可以提升訪問來源的轉化效果(比如SEO,郵件,社交網路,等等),對此我不會太多展開。但從“訪問來源→使用者最終轉化頁”之間的過程優化同樣很重要。討論站內轉化率優化不可能拋開訪問來源。因為早在使用者進入落地頁之前就已經要開始優化轉化率了。

站內轉化率優化

定義:改善網頁的設計與功能,提高使用者在頁面上執行關鍵行為的可能性。

轉化節點:最常見的轉化節點包括:註冊、登入、購買、訂閱、分享等(社交媒體增長帶來的結果)。還有其他更加細化的轉化節點,但我主要關注這幾個核心的指標,因為優化的方法可以適用到其他轉化節點上。

1. 按鈕vs. 文字連結

按鈕比文字連結能獲取更多的點選率,原因很簡單,因為“更顯眼”。當你需要用文字連結的地方,嘗試用按鈕去代替。因為已經有無數的測試證明了少用文字連結能讓CTR提升 20%-200%。

這裡插一個有趣的題外話:不要期望一個按鈕的A/B測試效果能在數週內保持平穩,尤其是郵件營銷。因為你通常是向一個比較固定的群體發郵件(比如新聞提醒),而按鈕容易會出現“點選疲勞”的現象——使用者已經習慣了你的設計,很可能意識到了郵件中的文字和按鈕都能連結到同一個地方。因為點選任何文字或按鈕的超連結,都可以達到目的地。(延伸閱讀文章:按鈕vs.文字連結http://www.aweber.com/blog/case-studies/buttons-vs-text-links.htm

不過一般情況下,按鈕還是比文字連結強,因為儘管數週後CTR增長放緩,按鈕還是提升了CTR。CTR增長的絕對值不一定能夠長期保持在30%,但至少你可以期望增長趨勢能夠持續數週甚至數月。

這並不是說同一個按鈕不可能帶來CTR的持續增長。因為按鈕點選行為在網頁上和郵件中的表現可能有很大的差別。網頁上的按鈕不太容易產生點選疲勞。如果你針對網頁按鈕做A/B測試時發現了資料的增長,那麼這個增長通常是穩定的。

2. 按鈕位置

第一屏的位置優於其他位置。例如,Chitika 做了一個對比廣告在第一屏與下面位置的CTR的研究,發現廣告在首屏時能達到36%的CTR增長。同樣的道理適用於任何首屏的可點選動作。一些市場研究者也做了個有趣的研究,在首屏呈現較少的資訊,鼓勵使用者翻頁去發現更多內容,併產生轉化點選的效果。他們的發現是:你完全可以鼓勵使用者去翻頁,並點選首屏之下的內容。

看看這個布裡斯托爾機場網站的眼動熱點圖。這張圖表明,首屏只展現少量內容可以引導更多使用者往下瀏覽及點選。

zhl01

從使用者的角度看來,省事才是王道。如果你有把握傳遞足夠的資訊和價值,使使用者點選首屏的按鈕,就應該這麼做,而不要故意縮減頁面頭部並使資訊堆積在頁面下方。

3. 操作按鈕的尺寸,顏色,對比

操作按鈕應該顯眼而不突兀。Square在這方面做得很好。按鈕的顏色同全屏出血的背景圖及其他頁面元素形成了很好的對比。按鈕很大,但不會大得嚇人,並且按鈕旁邊搭配有很多呼喚使用者點選的元素)。

如果你想看看更多行為呼喚的樣式與型別,請戳這裡http://www.webanddesigners.com/35-creative-call-to-action-buttons-for-inspiration/

4. 提升網頁載入速度

落地網頁的速度通常是轉化率優化中容易被忽視但卻非常重要的一個環節。許多測試資料表明網站速度是至關重要的。例如,2007年亞馬遜釋出的一個研究顯示網站每100ms的載入延遲就會導致銷售額下降1%。戳這裡看更多關於網站速度的研究:http://www.conversionmedic.com/website-performance-optimization/。想辦法降低(尤其是關鍵頁面)載入時間,例如可以減少圖片/CSS/ JavaScript等等的負載。或者想辦法切分頁面不同的載入項,讓關鍵元素優先載入。通過在Facebook 和 Twitter參加過的許多測試,我親身看見了速度提升能夠如何顯著地提高轉化率。我真心認為糟糕的網站速度是導致MySpace沒落的原因。想想看,一個速度慢的網站意味著更少的朋友請求,更少的狀態更新,更少的圖片上傳,更少的廣告點選,更少的邀請傳送,等等,等等。所有這些操作都是形成社交網路效應的積累基礎。網站速度阻止了網路效應的飛速勢頭,由此導致了越來越少的增長,而增長的減少意味著失敗的風險增加。Facebook來了,它更快,更簡單,而且有了更好的網路效應。通過專注於改進網站速度等關鍵要素,Facebook打下成功的基石。

谷歌提供了一個很好的網頁速度測試工具,任何人都可以使用:http://developers.google.com/speed/pagespeed/insights/。它可以生成詳細的報告,給出具體的網速建議。YSlow也是發現網速問題的很好的工具。

如果你是一個WordPress網站站主,網速是個現實存在的問題(特別是對外掛重度使用使用者)。你可以嘗試使用Plugin Performance Profiler來查詢外掛對個人站點網速的影響。它可以生成如下的報告,幫助你診斷每個外掛對延遲的影響。

zhl02

謝謝unbounce.com提供上述網站速度分析工具。(http://unbounce.com/conversion-rate-optimization/how-to-improve-conversions-by-increasing-page-speed-tips-tools/).

5. 標題,子標題,正文文案

能夠向使用者傳達核心價值觀的突出標題很重要。我可以想象如果Square, Inc.去掉了登錄檔單上的“馬上開始繫結信用卡”(Start accepting credit cards today),註冊轉化率會立馬下降。

zhl03

嘗試在你的頭條裡使用其他文案,看看有什麼反響。如果你還沒有積累足夠的使用者量來支援網站的快速A/B測試,那就試試使用Google AdWords 或者 Facebook Ads 作為測試文案的平臺,找到使用者反響最好的那一個(因為你能相對快速地獲得大量點選,尤其是Facebook Ad)。得到最高CTR的Facebook Ad頭條可能是你網站主頁的理想文案。說到正文文案,原則是:少即是多。不要讓讀者面對滿屏密集的文字。

我在谷歌搜尋了“小型商業網站”並且點選了幾條廣告,看看他們落地頁是什麼樣子。其中一個是下圖的樣子,有清晰的行為呼喚,不太擁擠,少量供閱讀的文字,以及一些使用者的證詞,甚至還有一個產品的視訊介紹,是一個很不錯的頁面:

zhl04

來源: http://www.volusion.com/

但另外一個廣告讓我看到了下面的落地頁。我的第一反應就是想馬上離開,因為這看起來太複雜了!當我看到撲面而來都是文字,或者看不到資料、圖表、要點列表等有價值資訊的部落格或郵件的時候,都會有同樣的想法。這個網頁對比用得很爛。“訪談網站”的關鍵動作連結不如上面網站“14天免費試用”的黃色動作按鈕明顯:

zhl05

來源:http://www.webhostingfreereviews.com/

當然,這個頁面呈現了一些行為呼喚元素。因為他們在對一個昂貴的關鍵詞進行競價,肯定期望得到儘可能高的投資回報率。但是看到這麼密集的文字,我確信他們的轉化率一定受到了影響。大多數情況下,對於使用者而言,少即是多。記住,你應該向快餐品牌(In-n-Out)學習簡便快捷,展示價值明確的少量優秀產品,而不是一大堆連你都難以消化的垃圾。

想想顏色如何影響心境,情緒與決策

正如Colm Tuite在“配色有科學依據嗎?還是純粹主觀的?”問題裡的回答,網站配色的運用可以定下驅動轉化的基調。下面是西方國家使用者眼中顏色的含義:

zhl06

藍色:安全,正直,或者安靜,平和

綠色:新鮮,環保

黃色:能量,快活,或者警告

紫色:靈性,奢侈

粉色:浪漫,美麗,愛情,敏感

看看這些闡釋,想想你的網站配色將會如何影響轉化率,然後試試看是否適用。

相關文章