用戶為了完成任務需要找到必須的內容和功能.左側導航條在垂直的緊湊的空間內提供給用戶快速訪問已分類內容的入口
解決什么問題?
用戶為了完成任務需要找到必要的內容和功能.什么時候用?
分類至少有4個
分類可能會超過10個
分類的標題可能會很長或者是系統生成
頁面寬度沒問題
推薦二級導航內容;比如,當在信息架構層面,所展示的分類是這個頁面標題的子元素時
當展開/隱藏是有必要的
為了讓二級或三級導航條有更好的可見性,可以用來替代標簽或頂部導航條
分類是屬于一個單獨的產品
具體解決辦法是什么?
在頁面標題下方以一列的方式顯示一系列鏈接,并且左對齊.
對于更高級別的導航可以結合標簽組和/或頂部導航條
左側導航條給于當前位置特殊的視覺標識.通過對顏色,字體或者其他方式來表示”選中狀態”.
左側導航條內的所有頁面本身也該顯示在導航條內,同時必須正確的標識當前位置
左側導航條中文字標簽周圍的元素都應該是可點的,而不只是文字本身
一個左側導航條最多有兩層導航
當需要展示兩層導航并且有很多的一級分類和二級分類時,應考慮使用可折疊的左側導航條(或者手風琴導航)
可點父導航 VS 靜態父導航(Semantic Parents
可點父導航(左圖) VS 靜態父導航(右圖)(譯者注:忘了過去某個項目中跟同事還爭了好久,現在看各有各的好處和用法,只要滿足基本原則即可)當把左側導航條中的鏈接進行分類后,分類的名字可以是靜態的(語義的)或者是動態的(可點的).靜態父導航只是定義了下面的子分類.可點父導航不僅僅是定義了子分類,他們還鏈接到一個特殊的目標頁.永遠不要在相同左側導航中將可點父導航和靜態父導航混合使用.
關注內容的劃分范圍(符合用戶的心智模型)比關注頁面的展示更重要.因為最常見的錯誤是將一系列沒意義的內容歸在一類.盡可能降低分類之間的交集
讓分類之間的界限盡可能的清晰(例如,很容易猜到想要的東西是否在一個分類中)
避免過于寬泛或者過于特殊的分類名字。
為什么使用這個組件?
頂部導航條提供給用戶一種很方便,簡潔分類展示方式,讓用戶訪問品類繁多的有組織的內容可訪問性
當使用”彈出式”或”滑動式”菜單時,粗心的做法會導致有鼠標的用戶可以訪問下級菜單(通過鼠標劃過)或者點擊鏈接,但是鍵盤用戶只能做到后者.解決辦法是讓用戶可以通過Enter或Return鍵來觸發(通常會用在靜態父導航中).開放式問題?
對于長文字我們該如何解決?在左側導航中我們是否應該避免文字換行?
為什么至少需要4個分類?對于只有3個或者更少的分類時對那些設計師有什么建議嗎?
如果頁面寬度成問題,是否有其他的可選建議?