為用戶設(shè)計(jì)導(dǎo)航是每個(gè)應(yīng)用程序設(shè)計(jì)者的首要責(zé)任。畢竟，一旦用戶迷路了，不管動(dòng)態(tài)效果有多酷，內(nèi)容有多有趣，都沒有意義。即使我們的網(wǎng)站有搜索功能，我們也不能把搜索框當(dāng)作用戶導(dǎo)航的主要工具。大多數(shù)設(shè)計(jì)師已經(jīng)意識(shí)到這一點(diǎn)，并在自己的網(wǎng)站上設(shè)計(jì)了導(dǎo)航菜單。
定義：導(dǎo)航菜單是網(wǎng)站的主要內(nèi)容或功能的列表，通常由一組鏈接或圖標(biāo)組成，在視覺風(fēng)格上與網(wǎng)站的其他內(nèi)容有著顯著的不同。
導(dǎo)航菜單的重要性不言而喻。我們遇到的每一個(gè)網(wǎng)站或軟件通常都有它的存在，但并不是所有的導(dǎo)航菜單都是準(zhǔn)確設(shè)計(jì)的。我們經(jīng)常會(huì)發(fā)現(xiàn)，由于導(dǎo)航設(shè)計(jì)不當(dāng)，用戶感到困惑、操作困難，甚至不知道導(dǎo)航在哪里。
1、大屏幕中的導(dǎo)航菜單不能太小。如果有足夠的空間，不要隱藏菜單。
2、將導(dǎo)航菜單放在熟悉的位置。通常用戶會(huì)希望在他們?cè)L問過的網(wǎng)站或應(yīng)用程序中類似的地方（如網(wǎng)站頂部、左側(cè)等）找到他們想要的UI元素。
3、使菜單鏈接看起來是交互式的。如果菜單選項(xiàng)看起來不可單擊，則用戶可能無法將其識(shí)別為導(dǎo)航。如果我們的導(dǎo)航設(shè)計(jì)包含了太多的圖形，或者過于強(qiáng)調(diào)平面設(shè)計(jì)風(fēng)格，會(huì)使它們看起來更像裝飾圖片或標(biāo)題。
4、確保導(dǎo)航菜單具有足夠的視覺吸引力。許多導(dǎo)航菜單周圍都有一點(diǎn)空白，以便在視覺上突出顯示。但是，當(dāng)網(wǎng)站的用戶界面元素?fù)頂D時(shí)，如果導(dǎo)航菜單的視覺比例太弱，就會(huì)在各種圖形、促銷廣告、標(biāo)題中丟失，不易被用戶識(shí)別。
5、菜單選項(xiàng)的顏色應(yīng)與網(wǎng)站的背景色形成對(duì)比。令人驚訝的是，有許多設(shè)計(jì)師忽視了對(duì)比原則。
即使是熟悉上述規(guī)則的設(shè)計(jì)師設(shè)計(jì)的導(dǎo)航菜單也可能被用戶忽略，因?yàn)樗麄兒茈y客觀地評(píng)價(jià)自己的作品——特別是當(dāng)他們遇到更主觀的設(shè)計(jì)標(biāo)準(zhǔn)時(shí)，比如哪個(gè)UI元素應(yīng)該具有更明顯的視覺效果。如果你知道你的導(dǎo)航菜單在哪里，你可以一目了然，因?yàn)樗怯赡阍O(shè)計(jì)的。因此，有必要讓用戶參與身份驗(yàn)證。
6、告訴用戶當(dāng)前的位置。用戶成功導(dǎo)航的一個(gè)基本的標(biāo)準(zhǔn)是他可以找到自己：“我在哪里？”通常選擇的菜單選項(xiàng)在視覺上與其他選項(xiàng)不同，這些選項(xiàng)可以幫助用戶知道它們?cè)谀睦铮ɑ驗(yàn)g覽面包屑）。如果你不讓用戶確切知道他們?cè)谀睦?，?dǎo)致他們迷路，你將在網(wǎng)站設(shè)計(jì)中犯基本的錯(cuò)誤。具有諷刺意味的是，用戶并不總是通過主頁到達(dá)目的地頁面，因此導(dǎo)航菜單對(duì)用戶意義重大。
7、使用易于理解的鏈接標(biāo)簽。知道用戶在尋找什么，并使用類似和相關(guān)的類別標(biāo)簽。記住，導(dǎo)航菜單不會(huì)用自己的語言和行話愚弄人。使用準(zhǔn)確描述網(wǎng)站內(nèi)容和功能的術(shù)語。
8、鏈接標(biāo)簽應(yīng)該易于閱讀。減少用戶閱讀菜單特定內(nèi)容的時(shí)間，例如使用左對(duì)齊的垂直菜單或前置關(guān)鍵字。
9、對(duì)于大型網(wǎng)站，用戶可以通過導(dǎo)航菜單預(yù)覽子內(nèi)容。對(duì)于喜歡挖掘網(wǎng)站各級(jí)內(nèi)容的典型用戶，下拉菜單可以讓用戶快速瀏覽，節(jié)省時(shí)間。
10、為密切相關(guān)的內(nèi)容提供本地導(dǎo)航。如果用戶喜歡經(jīng)常比較一些相似的產(chǎn)品，或者在某個(gè)場(chǎng)景中完成多個(gè)任務(wù)，可以將這些相鄰的頁面做成本地導(dǎo)航菜單，這樣用戶就不需要在復(fù)雜的路徑中“上下跳躍”。
11、使用視覺傳達(dá)。圖片、顏色等元素可以幫助用戶了解菜單選項(xiàng)，同時(shí)也確保這些圖形起到了積極的作用（至少不會(huì)讓操作變得更加困難）。
12、菜單選項(xiàng)應(yīng)該足夠大，以便輕松單擊。如果導(dǎo)航菜單選項(xiàng)過小或過于接近，會(huì)給移動(dòng)用戶帶來很大的麻煩；如果大屏幕網(wǎng)站的導(dǎo)航菜單選項(xiàng)也采用這種方式設(shè)計(jì)，操作起來會(huì)比較困難。
13、確保下拉菜單不太大或太小。鼠標(biāo)懸停觸發(fā)的下拉菜單渲染時(shí)間太短，無法給用戶帶來挫敗感，因?yàn)樵谟脩魡螕舨藛沃械逆溄又?，下拉菜單將消失。另外，垂直?dǎo)航菜單過長(zhǎng)不利于底部選項(xiàng)的點(diǎn)擊，除非滾動(dòng)屏幕。鼠標(biāo)懸停觸發(fā)的下拉菜單不能太寬，否則用戶會(huì)誤以為是新頁面，想知道為什么在點(diǎn)擊前會(huì)出現(xiàn)一個(gè)新的“頁面”？
14、當(dāng)頁面內(nèi)容很長(zhǎng)時(shí)，可以考慮使用吊頂（或固定底部）菜單。要返回到個(gè)屏幕，瀏覽到頁面底部的用戶需要反復(fù)滾動(dòng)鼠標(biāo)（移動(dòng)端不斷向上移動(dòng)屏幕）；如果導(dǎo)航可以暫停和吸收，用戶可以輕松切換其他菜單選項(xiàng)。這對(duì)小屏幕場(chǎng)景很好。
15、盡可能縮短導(dǎo)航菜單常用操作的物理距離。當(dāng)有許多下拉菜單時(shí)，您可以通過將常單擊的鏈接放在離鼠標(biāo)懸停選項(xiàng)近的位置（移動(dòng)端類似）來縮短鼠標(biāo)移動(dòng)的距離。近，一些應(yīng)用程序中流行的餅狀菜單圍繞著菜單的所有菜單選項(xiàng)（有些是半圓），因此每個(gè)選項(xiàng)鏈接的物理單擊距離短。
酷的效果不是我們的首要目標(biāo)。對(duì)于用戶來說，讓他們印象深刻的是網(wǎng)站的精彩內(nèi)容，以及熟悉易用的導(dǎo)航菜單。