當前位置:首頁 >  站長 >  網站運營 >  正文

漲姿勢!10個不可錯過的導航菜單欄設計技巧

 2017-12-21 16:51  來源: A5企業(yè)專欄   我來投稿 撤稿糾錯

  域名預訂/競價,好“米”不錯過

不少站長在進行網站搭建時常常會輕視導航菜單的設計。導航菜單作為網站設計中的一個基礎組成部分,直接決定著用戶的瀏覽體驗順暢與否,對整個網站具有舉足輕重的影響。如果導航菜單不夠靈敏、可用性差,這會有損網站的專業(yè)形象,妨礙用戶與網站進行互動,因而影響網站流量、銷售額等的提升。那么,怎樣才能設計出一款兼具可用性和美觀性的導航菜單呢?今天小飛就來介紹介紹導航菜單的幾個設計技巧,希望能給大家?guī)硪恍﹩l(fā)。

1. 超大菜單欄

盡管很多設計師不太喜歡超大菜單欄,但實踐證明用戶對它的反響還是比較好的。當然,這只在超大菜單欄設計良好的情況下成立,一個有效的超大菜單項必須能以盡量簡單的方法提供給用戶十分核心、重要的信息。因此,在導航菜單項比較多的情況下,如何篩選關鍵欄目就變得十分困難,站長們需要仔細考量或分析統(tǒng)計數(shù)據(jù)做出決定。還有,并不是所有的網站都適合超大的導航欄,不少網站沒有足夠的空間來承載大的導航欄目??偟亩?,大家在選擇使用這個技巧時一定要結合自身網站的實際情況再作選擇。

2. 顯眼的搜索框

在網站的主導航欄設置搜索框是必需的,因為這是用戶的剛性需求。當用戶無法在頁面上直接獲取想要的內容,他們就會開始在搜索框中輸入關鍵詞進行搜索。強大的搜索框是維系用戶群的有效方法之一,谷歌就是搜索框優(yōu)先這一想法忠實的支持者。而說到如何設計網站搜索框,最主要的設計準則就是要讓搜索框足夠醒目,易于輸入,讓它出現(xiàn)在每個頁面上,便于用戶進行查找。

3. 限定導航條目的數(shù)量

導航菜單項并不是越多越好,太多的菜單項有時反而會破壞網站的簡潔美,因此站長們需要明確用戶可能希望在網站上獲取哪些內容,將最受歡迎頁面或信息放在最醒目的位置。

一般來說,幾乎每個網站的導航菜單都應該包括搜索框、關于頁面或聯(lián)絡頁面,而商城網站還應該包括"加入購物車"或"立即購買"按鈕。

4. 靈活的導航機制

一個好的導航菜單不僅可以幫助用戶實現(xiàn)不同頁面之間的合理切換,還應該是靈活多變的。在當今這個時代,用戶們都希望自己能夠給獲得個性化、定制化的體驗。Amazon在這一點上就做的很好,當你再一次登錄Amazon網站時,你會發(fā)現(xiàn)導航菜單會根據(jù)你的信息重新調整。網站的導航菜單欄不再是通用性質的,而是更貼近你個人情況的樣式,比如最近的購買記錄,信用額度,Amazon的服務信息等(每一項都是針對個人定制的)。

5. 正確排列導航菜單項

導航菜單項的排列順序和菜單內容同樣重要。一般而言,導航欄兩端的菜單項是最引人矚目的,通常也是用戶點擊最多的。所以各位站長一定要特別注意這兩處菜單項的選擇和設計。

對于這一點,這有不少可以研究和理論做支撐。比如, 序列位置效應 是指人們更容易記住列表的開頭和結尾的項目; 近因效應 是指人們對于最新看見的項目(也就是結尾的項目)有更深的印象,而 首因效應 是指相對于中間位置的項目,人們更容易記住列表開頭的項目。

6. 在長滾動頁面上使用固定導航

不要讓用戶在網站上失去前進的方向。對于長滾動頁面來說,導航最好能夠一直出現(xiàn)在網站上,不管是在網頁的頂部、側邊欄還是底部。這樣一來,用戶能夠以輕松自然的方式同網站進行交互,交互越是方便,用戶越會在網站中四處瀏覽,用戶在網站中停留的時間就會變長。從而,降低用戶跳出率,提升網站用戶轉化率。

7. 不要隱藏菜單

超小的漢堡圖標、隱藏在頁腳不顯眼的鏈接或是在長滾動頁面中時隱時現(xiàn)的菜單,都會大大降低用戶想要點擊的欲望。這些"躲閃"的導航元素加大了用戶與之交互的難度。相反,時刻存在在頁面上的導航菜單會讓用戶更加安心,更加自在地實現(xiàn)跳轉、退出。所以,不要隱藏導航菜單。如果真的有使用隱藏式菜單的必要,務必讓漢堡圖標足夠清晰。

8. 精確的標簽文字描述

從導航標簽再到導航圖標,網站中的每個交互元素都應該起到明確指引用戶的作用,告訴他們點擊之后會發(fā)生什么。在導航菜單中,盡量多使用認知度比較高的圖標,比如放大鏡、購物車 。

除了導航圖標外,菜單欄中每個條目都會有個文本標簽,它們會告訴用戶這個鏈接中所包含的內容。這個時候要注意不要使用太過寬泛的描述,比如"服務"或"產品",盡量用更精準的描述。下圖就是一個很好的栗子,菜單項上的描述都很精確,如"Browse the cards"、"Upload your own"、"Our artists"等,更方便用戶快速獲取信息。

9. 全頁面導航

導航菜單如何設計有很多種玩法,如果你真的想要讓它更加醒目,不妨試試全頁面導航。用戶絕對不會錯過這種非常規(guī)的導航設計方式,雖然全頁面導航并不適合每個網站,但當它應用在一些小型網站或作品集網站,往往能夠帶來出其不意的效果。

10. 垂直導航

垂直導航設計也是目前越來越流行的設計之一,它很特別,很容易就會吸引用戶的視線。目前最常見的側邊欄垂直導航,側邊欄導航適用于不少網站,比如長滾動式的頁面。這是因為側邊欄導航一般為固定式的,可以讓用戶視線隨時定位,快速跳轉,并且其中所能承載的元素相對比頂部導航更多。如果你不確定自己的網站是否應該使用垂直導航菜單,可以閱讀《在網站中應該使用垂直導航菜單嗎? 》。

關于導航菜單的設計技巧小飛就先介紹到這里了。清晰的導航菜單結構不僅有助于用戶及時獲取信息,提高用戶的滿意度,還能方便搜索引擎快速抓取,受搜索引擎喜愛。各位站長做網站不就是為了提高網站在搜索引擎上的排名,打響品牌知名度,優(yōu)化用戶體驗,從而獲益,良好的導航菜單就能在這方面發(fā)揮不少作用。所以記得好好設計網站的導航菜單。起飛頁自助建站平臺()提供了眾多精美的響應式網站模板,導航菜單設計樣式也十分多樣,趕緊來起飛頁做一個響應式網站吧!

申請創(chuàng)業(yè)報道,分享創(chuàng)業(yè)好點子。點擊此處,共同探討創(chuàng)業(yè)新機遇!

相關標簽
起飛頁建站

相關文章

  • 響應式網站中優(yōu)化用戶體驗的7個關鍵點

    隨著移動設備的不斷興起,響應式設計越來越受到大眾的喜愛,站長們在搭建網站時也更加傾向于選擇響應式網站。不過,大多數(shù)站長們都認為既然響應式網站可智能根據(jù)設備屏幕大小呈現(xiàn)不同的展示效果,那就不用再對移動端的網站進行手動調整了。其實這種看法是片面的,響應式網站雖然自身具備一定的特質,但有時PC端網站和移動

  • 盤點2017年最受歡迎的10個商城范例:我們從中可以得到哪些啟示?

    在電商和線上購物快速發(fā)展的今天,擁有一個商城網站很是必要,關于試水獨立商城的好處大家可以瀏覽《有了淘寶京東,為什么還要自建商城網站?》查看。但是,搭建商城網站并不簡單,慶幸的是目前市面上涌現(xiàn)了不少建站平臺,起飛頁自助建站平臺就是其中一個,各位商家可以借助起飛頁輕松搭建出一個好看、實用的商城網站。不過

    標簽:
    起飛頁建站
  • 讓首頁背景動起來是怎樣一種感覺?8張圖告訴你真相!

    現(xiàn)在越來越多的設計師開始在網頁中使用循環(huán)視頻作為背景,這種現(xiàn)象的出現(xiàn)主要有兩個原因。一方面,移動設備性能不斷完善,網速越來越快,用戶能夠且有條件在移動設備上瀏覽視頻背景的網站;另一方面,隨著HTML5技術的發(fā)展,很多主流瀏覽器的視頻標簽都支持循環(huán)(Loop)屬性,網頁上單個或一系列視頻短片的循環(huán)播放

    標簽:
    起飛頁建站
  • 缺乏靈感?給你8個值得每天學習的頂尖設計網站

    網站設計是一種藝術,它離不開靈感和創(chuàng)意。但靈感與創(chuàng)意的涌現(xiàn)是需要碰撞、需要時機的,大多數(shù)設計師都不可能每時每刻都靈感爆棚。當您缺乏設計靈感時,不妨看一看下面這些網站,它們都收錄了豐富的素材,都有許多獨立設計師上傳的優(yōu)質作品,沒準這些設計就能讓你眼前一亮,獲得一些想法或啟發(fā)。趕緊和小飛一起看看這8個值

    標簽:
    起飛頁建站
  • 目前為止用戶體驗度最好的表單:浮動標簽式的表單

    在當今這個互聯(lián)網時代,填寫表單對用戶來說就是家常便飯,在網站進行注冊登錄時、在網上購物時,都免不了填寫表單這一環(huán)。表單是網頁設計中重要的組成部分之一,在獲取用戶信息方面發(fā)揮著不可或缺的作用,它是用戶和網站的一種互動形式,這種形式的互動越順暢,網站的用戶轉化率就越高。這也是為什么許多站長們一直在研究如

熱門排行

信息推薦