導航是良好用戶體驗（UX）的關鍵。用戶依靠直觀的數字導航來查找有用的信息，探索品牌故事并做出購買決策。

令人困惑的導航足以讓用戶退回或退出。隨著UX專家更多地了解消費者如何與數字內容互動，設計師混合搭配導航元素的方式越來越多。為移動和桌面站點選擇正確的導航設置可以改變您的用戶體驗并促進業務發展。

您的Web Designer工具箱

無限下載：500,000多個Web模板，圖標集，主題和設計資產

現在下載

一致性是王

如果所有導航專家都同意一件事，那就是一致性的重要性。導航需要在整個站點中保持一致，并且每頁都可用。

導航菜單不一致會導致混淆。用戶不必搜索隱藏的導航菜單或嘗試太難找到所需的頁面。無論您選擇何種類型的導航設置，都必須優先考慮一致性。通過關注幾個主要方面來做到這一點：

菜單應該出現在每個頁面上。不要讓用戶擱淺在沒有出路的頁面上。該菜單應該在您網站的每個頁面上都可用。如果菜單選項有多個級別，請保留面包屑以便訪問者可以看到他們在網站上的位置的層次結構。當用戶通過外部源查找頁面時，面包屑尤為重要。

使每個菜單項以相同的方式作出反應。如果“關于”選項卡下拉到不同選項的列表中，則其他選項卡也應如此。如果其中一個是指向著陸頁的鏈接，請同時創建其他鏈接。導航菜單中的每個項目應以與用戶觸摸（或單擊）相同的方式作出反應。

元素應該是直觀的。用戶已經將某些網站設計元素與意義聯系起來。例如，通過菜單項放置箭頭通常意味著存在與項目一起的下拉列表。創建幫助用戶了解導航期望的元素，并在整個網站中保持相同。

尼爾森諾曼集團表示，在記憶方面，識別比召回更容易。大腦依靠提示激活內存并檢索信息。

通過允許站點訪問者依賴識別而不是回想起來，使站點訪問者輕松導航。您越一致，越好的訪問者就會認識到您網站上每個元素背后的含義。這將導致更快的全方位網站瀏覽 - 以及更快樂的用戶。

清晰，簡潔的標簽

導航菜單不是讓您的內容變得聰明的地方。用戶依靠菜單來繞過您的網站。菜單的目的是提供方向。它不需要招待或震驚網站訪問者。

保持菜單標簽簡潔，清晰，簡潔。出于某種原因，大多數網站使用相同的單字標簽。用戶熟悉Home，Products，About，Blog和Contact等選項。他們知道標簽的含義以及選擇選項時會發生什么。

漢堡菜單的替代品

還記得2014年針對移動網站設計的精彩漢堡菜單辯論嗎？它正在進行中，現代網站設計師在問題的任何一方都會遇到問題。

許多移動網站仍然使用可信賴的漢堡包，因為這是大多數移動用戶所尋求的。“漢堡包”是由三條堆疊的水平線組成的菜單圖標。設計師最初使用它是因為它可以在較小的移動屏幕上節省空間。今天許多設計師正在嘗試漢堡包的替代品，例如：

標簽

可滾動導航

底部導航

“顯示更多”選項

帶標題的內聯列表

分段控制

漢堡包菜單的替代品在許多網站上取得了巨大成功，特別是那些選項少的網站。許多設計師的共識是，如果你可以顯示導航，顯示它。

可滾動導航菜單示例

有時這是不可能的，因為較小的移動屏幕或幾個菜單選項。在這些情況下，逐步披露是可以接受的。您的菜單選擇取決于您需要擠入的內容量和網站的目標。例如，較年長的觀眾可能會欣賞永久可見的菜單，而不是漢堡包。嘗試不同的風格，看看是否增加收入。

顯示更多選項示例

易于查找的搜索欄

設計功能菜單不僅僅涉及清晰度和一致性 - 它還涉及最大化網站的可用性。

YouTube搜索欄

可以提高可用性的一個功能是搜索圖標（通常是放大鏡）。如果用戶查找搜索欄，則他們已經丟失到足以需要直接搜索功能。隱藏搜索選項 - 或者完全不考慮搜索選項，不要讓事情變得更糟。

紐約時報搜索欄

用戶可以在搜索欄丟失時找到出路，也可以為具有特定任務的用戶提供更直接的信息路徑。拿走搜索欄會導致沮喪的訪問者決定尋找其他地方，而不是搜索他們想要的網站。

將搜索欄放在每個頁面清晰可見的位置。大多數用戶都會在搜索選項的右上角查看，或者至少在菜單附近的某個位置查找。

旋轉木馬菜單

輪播菜單在博客類網站和發布定期更新和新聞報道的網站上越來越受歡迎。

“輪播”指的是頁面頂部的菜單，其中顯示了網站發布的最新文章。許多新聞網站和博客在旋轉木馬中使用縮略圖來吸引眼球并使其更容易選擇文章。

Vogue Carousel菜單

旋轉木馬選項卡還具有文章的標題，和/或內部內容的簡要說明。它基本上用作帶有可點擊鏈接的幻燈片，供用戶輕松瀏覽。輪播菜單非常適合展示最新內容，并且可以讓用戶在您的網站上保留一些他們可能想要在普通網站上閱讀的其他有趣文章。

巨型菜單

另一個席卷導航設計的趨勢是大型菜單。顧名思義，這個菜單是加號，垂直和水平占據頁面。這些菜單在雜志式博客中很受歡迎，但更多品牌正在使用它們來制作菜單。

超級菜單非常適合具有多級導航的網站。如果需要，可以使用圖像和縮略圖，而不是將用戶與十幾個下拉菜單混淆，將菜單展開到頁面的一半，并清楚地排列選項。

大型菜單也非常適合頻繁發布文章的網站，因為設計師可以使用不同的列來顯示最近的故事和相關鏈接。

超級菜單示例

固定導航欄

由于社交媒體和移動網站，無限滾動風格的網站開始流行。Facebook等先鋒使用這種格式允許讀者無限滾動，每次用戶到達頁面底部時不斷上傳新信息。

使用拇指輕松滾動，使其成為移動用戶的理想選擇。有了這個網站風格出現了導航問題 - 它應該保持在頁面頂部還是以某種方式保持可見？答案來自固定的導航菜單。

固定導航示例

當用戶向下滾動頁面時，固定的導航菜單保持不變。這種類型的菜單也稱為粘性導航，并且最常見的是作為頂部導航欄。

菜單始終存在，供用戶更改頁面。Facebook使用這種格式允許用戶在滾動瀏覽新聞源時查看他們的個人資料或查看通知。如果您的網站具有社交感覺，或者該網站處理大量數據，則帶有固定導航欄的無限滾動可能是合適的。

毫無疑問，網站的導航會影響用戶體驗。用戶會有積極的體驗，還是消極的體驗？使用移動和桌面設計的最新趨勢優化您的導航設置可以帶來更好的全方位用戶體驗 - 以及更好的業務成功。請考慮更新您的網站，以包含一些最新的網站導航最佳做法。