四個步驟實現(xiàn)層級清晰的導航欄

【編者按】本文作者為 Wes McDowell,主要介紹通過四個步驟實現(xiàn)層級清晰的導航欄,進而提高網站的轉化率。文章系國內 ITOM 管理平臺 OneAPM 編譯呈現(xiàn)。

精心規(guī)劃的導航策略可以成就一個網站,反之,則可能毀了一個。規(guī)劃得好,網站訪客就會順著你安排的路徑走下去,要么購買你的商品、成為你的潛在客戶,要么填完網站咨詢表單。

規(guī)劃得不好,訪客們就會在網站上隨意游蕩。他們有可能達成你的目的,也可能不會。何必冒險呢?

出色的用戶體驗是不應該如此隨意地對待客戶轉化問題的——我們應當手把手地指導用戶,給出能吸引他們注意的、明確的提示。這樣,他們才能找到自己想找的東西,同時你也能獲得自己想要的東西——客戶轉化。

在本文中,筆者將向你介紹一個簡單的、提升轉化率的策略,它適用于所有網站。

只要使用得當,你交付的網站不僅美觀大方,還能幫客戶實現(xiàn)他們的商業(yè)目標。

也就是說,你是他們的大英雄。

第一步:著陸頁策略

我們知道對2016年的網絡營銷來說,每個網站都應當配有著陸頁,這是轉化策略的一部分。如果你打算重新設計你的網站,這一步并不要求你刪掉已有的頁面,而是增加一些內容。

你需要建立一個信息齊全的頁面,這個頁面應當囊括了刺激轉化所需的所有內容。著陸頁的數量不定,取決于具體的業(yè)務和目標。為了簡便,我們用私人作品網站為例。

假設你提供網頁設計和商標設計兩種服務,那么在你的作品網站上,除了簡單的作品集頁面,還應當建立兩個全新的著陸頁——每一個著陸頁對應一種業(yè)務。在各個著陸頁上,你可以放上重點作品、有說服力的銷售文案、服務特點列表、客戶推薦信、以及清晰的行為召喚(CTA)按鈕。

著陸頁存在的原因是:客戶無需在不同頁面之間來回切換,而可以在一個頁面上看到所有信息。如此一來,你的銷售漏斗將更加成功,同時,因為省去了切換環(huán)節(jié),客戶也不會再半途放棄。

第二步:重點放在可以“生利”的頁面

除了著陸頁以外,是否還需要一些別的頁面來刺激轉化?例如一個專門放客戶推薦信的頁面?或者是其他服務項目的介紹?

如果你覺得需要的話,那么你有以下幾種選擇:

相關鏈接

在著陸頁的正文中插入鏈接,可以有效地引導客戶走向預設的方向。假設你的著陸頁上有一些案例分析,那么可以在案例的下方加入相關鏈接,引導客戶前往查看更多案例。

精簡的標題導航欄

另一個方案是,做一個精簡的標題導航欄,指向兩三個最常用的頁面。還是以作品網站為例,你可以把那兩個著陸頁都放到標題導航欄里,這樣訪客就可以在不同服務之間來回切換。

理想狀態(tài)下,標題欄應當是“靜止的”,即使用戶滾動頁面,標題欄仍會保持原位。

第三步:弱化其它內容

你聽說過“選擇疲勞”嗎?它的意思是,當人們面臨太多選擇時,往往更不可能采取任何行動。有個著名的果醬試驗闡釋了這一概念。

研究人員在一家食品店的小貨架上放了五種果醬。路過的人們會停下來看一眼,其中大部分人會購買一種果醬。之后,研究人員不斷增加果醬的品種,直至三十種之多。人們還是會停下看看,折服于如此之多的選擇,然后就走開了。

我們不想這種情況出現(xiàn)在網站上。如果導航欄有太多的選擇,訪客們就沒有一條清晰的路徑,于是干脆離開。我們可以這樣解決這個問題:

所有其它頁面的鏈接都不應出現(xiàn)在主要選項中。 我們可以把它們放在次級導航中。

你可以隨意處理次級導航。既可以把它們放在不那么重要的位置,(例如頁腳上方,)或者把它們放在一個會自動隱藏的側邊欄菜單中,訪客可以點擊菜單按鈕來訪問。

是的,我知道這個問題是用戶體驗專家們爭論的焦點。有很多人非常討厭隱藏式導航,認為它為用戶的使用創(chuàng)造了一個障礙。但是請記?。耗愕闹戫撘约爸饕膶Ш巾?,應當足以刺激轉化了。次級頁面只是為那些想要尋找它們的訪客而準備的。

消除了那些不重要的選項,(或者至少弱化了它們),訪客們將會擁有一條更為清晰的路徑。從任何角度來說,這都是不錯的用戶體驗。

第四步:設置你的CTA(行為召喚)按鈕

清晰、明確的CTA代表著網站的所有目的。

還是以作品網站為例,假設你的最終目標是讓潛在客戶填寫一份表格,定下一個咨詢時間。一旦想清楚了這一點,你一定會想把這個鏈接放在最顯眼的地方。

除了放在著陸頁的正文位置,筆者建議還可以在標題導航欄再放一個。

但是,為了使它有別于其他導航選項,你可以把它做成一個按鈕。這樣更具視覺沖擊。如果它的顏色是亮麗的流行色系,那突出效果將更佳。

整體效果

一旦完成了上述步驟,你就完成了層次清晰的導航設計,你的導航就會變得非常有層級:

  1. 最重要的:CTA按鈕

  2. 第二重要的:主導航欄選項

  3. 不太重要的:隱藏的或弱化的次級導航選項

一旦建立了這樣的層級關系,由于突出了CTA,并且輔以其他的主要導航選項,網站的轉化率將會全面提升。

其他的那些對于轉化幫助不大的元素都可以隱藏起來,以免訪客分心。

總結

作為一名網頁設計師,我們的首要任務就是幫助客戶最大化他們的營銷工具——網站——可能帶來的優(yōu)勢。當我們的網站擁有一條明晰的路徑,直通更高的轉化率,就能夠促成客戶的成功。這種附加價值往往會讓我們從其他設計師中脫穎而出,進而找到更優(yōu)質、愿意投入更多經費的客戶。

網站的美觀固然重要,但畢竟,能帶來更高的轉化率,才是決勝的大必殺。

本文系 OneAPM 工程師編譯整理。OneAPM Browser Insight 是一個基于真實用戶的 Web 前端性能監(jiān)控平臺,能幫助大家定位網站性能瓶頸,實現(xiàn)網站加速效果可視化;支持瀏覽器、微信、App 瀏覽 HTML 和 HTML5 頁面。想閱讀更多技術文章,請訪問 OneAPM 官方技術博客。

本文轉自 OneAPM 官方博客

原文地址:https://www.sitepoint.com/how-to-boost-conversions-with-prioritized-navigation/

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯(lián)系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發(fā)布,文章內容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務。

推薦閱讀更多精彩內容

  • 中國互聯(lián)網用戶群已經成為世界最大的互聯(lián)網群體。與此同時,中國互聯(lián)網網站的發(fā)展也歷經了幾個階段,從單純的網絡媒體到現(xiàn)...
    零一間閱讀 4,328評論 1 41
  • Android 自定義View的各種姿勢1 Activity的顯示之ViewRootImpl詳解 Activity...
    passiontim閱讀 173,098評論 25 708
  • 頸椎不舒服,早早回來,一覺睡到現(xiàn)在,天竟已黑了,大豬也不在家,沒有什么事情在計劃中必須干,索性就這么躺著,真是無...
    豆子之不愛那么多閱讀 423評論 1 2
  • 月光下的躑躅 踮起腳尖 心跳為奏 想成一位 粉紅的少女 沒有鮮花簇擁 只作孤高的野草 走向陽光 ...
    沉默功夫閱讀 223評論 0 1
  • 文 | 廈九九 01 越長大越孤單,誰長大誰知道。很多事沒有來日方長,很多人只會乍然離場。 相遇怎樣都美好,時光和...
    廈九九閱讀 4,289評論 7 16