解決什么問(wèn)題?
用戶為了完成任務(wù)需要找到必要的內(nèi)容和功能.
什么時(shí)候用?
分類至少有4個(gè)
分類可能會(huì)超過(guò)10個(gè)
分類的標(biāo)題可能會(huì)很長(zhǎng)或者是系統(tǒng)生成
頁(yè)面寬度沒(méi)問(wèn)題
推薦二級(jí)導(dǎo)航內(nèi)容;比如,當(dāng)在信息架構(gòu)層面,所展示的分類是這個(gè)頁(yè)面標(biāo)題的子元素時(shí)
當(dāng)展開/隱藏是有必要的
為了讓二級(jí)或三級(jí)導(dǎo)航條有更好的可見(jiàn)性,可以用來(lái)替代標(biāo)簽或頂部導(dǎo)航條
分類是屬于一個(gè)單獨(dú)的產(chǎn)品
具體解決辦法是什么?
在頁(yè)面標(biāo)題下方以一列的方式顯示一系列鏈接,并且左對(duì)齊.
對(duì)于更高級(jí)別的導(dǎo)航可以結(jié)合標(biāo)簽組和/或頂部導(dǎo)航條
左側(cè)導(dǎo)航條給于當(dāng)前位置特殊的視覺(jué)標(biāo)識(shí).通過(guò)對(duì)顏色,字體或者其他方式來(lái)表示”選中狀態(tài)”
左側(cè)導(dǎo)航條內(nèi)的所有頁(yè)面本身也該顯示在導(dǎo)航條內(nèi),同時(shí)必須正確的標(biāo)識(shí)當(dāng)前位置
左側(cè)導(dǎo)航條中文字標(biāo)簽周圍的元素都應(yīng)該是可點(diǎn)的,而不只是文字本身
一個(gè)左側(cè)導(dǎo)航條最多有兩層導(dǎo)航
當(dāng)需要展示兩層導(dǎo)航并且有很多的一級(jí)分類和二級(jí)分類時(shí),應(yīng)考慮使用可折疊的左側(cè)導(dǎo)航條(或者手風(fēng)琴導(dǎo)航)
可點(diǎn)父導(dǎo)航 VS 靜態(tài)父導(dǎo)航(Semantic Parents)
可點(diǎn)父導(dǎo)航(左圖)VS靜態(tài)父導(dǎo)航(右圖)
(譯者注:忘了過(guò)去某個(gè)項(xiàng)目中跟同事還爭(zhēng)了好久,現(xiàn)在看各有各的好處和用法,只要滿足基本原則即可)
當(dāng)把左側(cè)導(dǎo)航條中的鏈接進(jìn)行分類后,分類的名字可以是靜態(tài)的(語(yǔ)義的)或者是動(dòng)態(tài)的(可點(diǎn)的).靜態(tài)父導(dǎo)航只是定義了下面的子分類.
點(diǎn)父導(dǎo)航不僅僅是定義了子分類,他們還鏈接到一個(gè)特殊的目標(biāo)頁(yè)
永遠(yuǎn)不要在相同左側(cè)導(dǎo)航中將可點(diǎn)父導(dǎo)航和靜態(tài)父導(dǎo)航混合使用.
關(guān)注內(nèi)容的劃分范圍(符合用戶的心智模型)比關(guān)注頁(yè)面的展示更重要.因?yàn)樽畛R?jiàn)的錯(cuò)誤是將一系列沒(méi)意義的內(nèi)容歸在一類.
盡可能降低分類之間的交集
讓分類之間的界限盡可能的清晰(例如,很容易猜到想要的東西是否在一個(gè)分類中)
避免過(guò)于寬泛或者過(guò)于特殊的分類名字.
為什么使用這個(gè)組件?
頂部導(dǎo)航條提供給用戶一種很方便,簡(jiǎn)潔分類展示方式,讓用戶訪問(wèn)品類繁多的有組織的內(nèi)容
可訪問(wèn)性
當(dāng)使用”彈出式”或”滑動(dòng)式”菜單時(shí),粗心的做法會(huì)導(dǎo)致有鼠標(biāo)的用戶可以訪問(wèn)下級(jí)菜單(通過(guò)鼠標(biāo)劃過(guò))或者點(diǎn)擊鏈接,但是鍵盤用戶只能做到后者.解決辦法是讓用戶可以通過(guò)Enter或Return鍵來(lái)觸發(fā)(通常會(huì)用在靜態(tài)父導(dǎo)航中).
開放式問(wèn)題
對(duì)于長(zhǎng)文字我們?cè)撊绾谓鉀Q?在左側(cè)導(dǎo)航中我們是否應(yīng)該避免文字換行?
為什么至少需要4個(gè)分類?對(duì)于只有3個(gè)或者更少的分類時(shí)對(duì)那些設(shè)計(jì)師有什么建議嗎?
如果頁(yè)面寬度成問(wèn)題,是否有其他的可選建議?
0
喜歡他,就推薦他上首頁(yè)吧^_^
0371-86068866
4008887269
cndesign@163.com
CND設(shè)計(jì)網(wǎng)(CNDESIGN)會(huì)員所發(fā)布展示的 “原創(chuàng)作品/文章” 版權(quán)歸原作者所有,任何商業(yè)用途均需聯(lián)系作者。如未經(jīng)授權(quán)用作他處,作者將保留追究侵權(quán)者法律責(zé)任的權(quán)利。
Copyright ©2006-2019 CND設(shè)計(jì)網(wǎng)
移動(dòng) Android 版 豫 ICP 備16038122號(hào)-2 豫公網(wǎng)安備 41019702002261號(hào)