無論您是想構建一個在桌面和移動設備上看起來都很棒的網站,還是打算加入 48% 擁有自己應用程序的小型企業,為用戶提供輕松的移動瀏覽體驗都保證為您的品牌帶來新的機會。
移動導航是指用戶可以在任何移動設備上瀏覽網站或應用程序并與之交互的方式。在制作這些資產時,有效的移動導航對于提供無縫的 UX 設計至關重要,并且可以影響它們的整體成功。
在本文中,我們將討論移動導航的含義,并探索當今流行的移動導航模式,以及如何使它們變得用戶友好。
什么是移動導航?
在移動設備上瀏覽時,網站導航是用戶體驗的核心。移動導航是通知和引導訪客瀏覽應用程序或移動網站的功能,包括痕跡導航(和痕跡導航)和錨鏈接等功能。與桌面導航相比,由于空間限制,移動導航往往面臨更多挑戰。
自從移動使用量增加以來,UX 和 UI 設計師多年來通過進行 UX 研究和測試不同的移動模式,將移動導航變成了一種藝術形式。移動網站導航和移動應用程序導航都是此對話的一部分,調查用戶使用移動設備的行為方式,以更好地了解在較小規模上交付內容的最有效方法。
良好的移動導航不僅僅是為用戶找到從 A 點到 B 點的最快方式。它有助于實現合乎邏輯的用戶旅程,防止用戶感到沮喪,并允許他們通過您的移動網站或應用程序發現有關您的品牌和產品的更多信息。
5種基本的移動導航模式
了解最常用的移動導航模式和網站菜單是制作讓用戶滿意的應用程序或移動網站的重要第一步。
最適合移動網站和大型應用程序:漢堡菜單
到目前為止,構成經典漢堡菜單的三條水平線 在移動網站設計領域無處不在。小圖標會隱藏菜單,直到用戶單擊它,漢堡菜單在移動網頁設計中比在移動應用程序中更常見。”
由于漢堡圖標在主頁上隱藏了菜單,因此設計人員可以提供更多菜單項或使標題更長,而不會使頁面擁擠。如果您選擇底部導航,您將被限制為五個項目,因為它真的很小,需要更加專注。
最適合簡化用戶旅程:Tab 欄
“標簽欄是當今移動應用程序中最常見的導航模式,它位于屏幕底部,是一種更注重設計的導航模式,很容易被發現。通常,選項卡欄包含提供直接訪問導航項的圖標。它的交互性質和在 Thumb 區域中的位置使其成為一種特別舒適的導航模式。
與漢堡菜單相比,選項卡欄在您可以顯示的項目數量方面存在更多限制。由于操作系統指南允許您一次最多包含五個項目,因此作為所有者,您需要選擇要在主導航上顯示的最重要的內容。
最適合文本密集型應用程序和移動網站:基于網格的導航
基于網格的導航是一種全屏移動模式,它直接在移動應用程序的主屏幕上包含大多數菜單項。與漢堡菜單類似,您可以使用基于網格的導航來容納任意數量的項目,因此它用途廣泛,在設計方面有很多選擇。
類似于 iPhone 和 Android 的移動導航模式,它是我們許多人都熟悉的用戶界面。但正如 Gertman 指出的那樣,它正變得越來越過時,需要這種布局的用戶類型是瀏覽教育或社區應用程序以及包含大量閱讀內容的網站。
最適合輔助導航功能:抽屜式導航
顧名思義,抽屜式導航是一種移動導航模式,其中大部分導航內容都包含在選項卡或側邊欄菜單后面。使用與漢堡菜單類似的概念,抽屜式導航欄可以隱藏許多菜單項。雖然菜單項是隱藏的,但如果沒有明確的組織,導航系統將無法正常運行。“如果你有很多內容想包含在抽屜里,你需要確保它被組織起來并分為幾類,這樣用戶就可以在眾多選項中找到他們正在尋找的內容。”
最適合優化空間利用率:下拉菜單
下拉菜單提供了另一種通用的移動導航方法。只需輕輕一按,用戶就可以展開選項列表,從而輕松發現更多選項,而不會使界面變得混亂。下拉列表對于表單或當您需要提供一系列選擇而不會讓用戶不知所措時特別有用。請記住,將您的下拉選項設置得足夠大,以便在移動屏幕上輕松點擊,從而確保用戶友好的體驗。
最佳 Web 設計實踐
以下是設計移動導航時要記住的一些最佳實踐:
確保您的內容清晰易讀
由于移動屏幕較小,確保用戶可以輕松閱讀您的內容非常重要。注意字體大小和樣式,當它們被打包到小屏幕上時可能會讓人不知所措,并盡可能減少書面內容的數量。
在導航菜單中包含基本項目
如果您使用的移動導航模式限制了您可以包含的菜單項的數量,請從戰略上考慮只包含對用戶最重要的頁面。盡管基于網格和漢堡菜單移動導航允許更多選項,但您仍然應該意識到它們是否過載。
使用基于手勢的導航來吸引查看者
基于手勢的導航是指使用手勢來控制和導航移動網站或應用程序的用戶界面。您可以使用它來增強導航模式,允許用戶在其設備上執行操作,例如向左或向右滑動、在屏幕之間移動或捏合和展開手指以放大和縮小。通常,手勢交互提供了一種更自然、更直觀的與電子設備交互的方式。
使用浮動操作按鈕
浮動操作按鈕 (FAB) 是顯示在用戶界面頂部的圓形按鈕,按下該按鈕時會觸發主要操作。設計師通常將其放置在屏幕的角落并使其突出以吸引用戶的注意力。FAB 提供對導航抽屜等基本功能的快速輕松訪問。
應用單手導航原則
單手導航使用戶只需用一只手即可在移動設備上執行常見任務。以下是單手導航的幾個關鍵原則:
將最常用的元素保持在 Thumb 區域內
使用滑動等手勢而不是按鈕
提供視覺提示以指導用戶的手
使用戶能夠根據自己的喜好自定義布局









