這個(gè)可能是最簡(jiǎn)單也最常用的組件了,所以內(nèi)容也不多……

原文地址: http://developer.yahoo.com/ypatterns/navigation/bar/topnav.html

解決什么問題?
用戶為了完成任務(wù)需要找到必要的內(nèi)容和功能.

什么時(shí)候用?
2-12個(gè)分類的時(shí)候
分類的標(biāo)題相對(duì)較短并且可預(yù)測(cè)的時(shí)候
分類數(shù)量基本不會(huì)變的時(shí)候
為一個(gè)web產(chǎn)品展示頂級(jí)導(dǎo)航時(shí)
配合標(biāo)簽來展示二級(jí)導(dǎo)航
如果頁面寬度很重要,用它來替代左側(cè)導(dǎo)航條
通過控制導(dǎo)航條的狀態(tài)來跟蹤和展示用戶當(dāng)前位置很困難,成本很大時(shí),用它來替代標(biāo)簽.
分類都屬于一個(gè)產(chǎn)品時(shí)

具體解決辦法是什么?
在一個(gè)水平的橫條上顯示一系列單行的鏈接,如果有網(wǎng)站頭部,則放到頭部之下.
可以通過與”標(biāo)簽”一起使用,在導(dǎo)航條中同時(shí)顯示一級(jí)和二級(jí)導(dǎo)航
如果只使用頂部導(dǎo)航條,最好第一個(gè)鏈接是”首頁(Home)”.應(yīng)該指向網(wǎng)站的首頁
但是如果頂部導(dǎo)航條是用在一組標(biāo)簽下,那么標(biāo)簽的第一個(gè)應(yīng)該是”首頁”并且具有同樣的功能
在導(dǎo)航條中用留白和”管道符” “|”(或者是垂直居中的”點(diǎn)”,或者是簡(jiǎn)單的視覺元素)來分隔每一個(gè)分類
頂部導(dǎo)航條中鏈接的所有頁面本身也一定要顯示在頂部導(dǎo)航條
當(dāng)頂部導(dǎo)航條數(shù)量過多時(shí),建議使用”更多..”的鏈接,或者考慮使用左側(cè)導(dǎo)航條
與標(biāo)簽一起使用來顯示高級(jí)別的內(nèi)容
跟左側(cè)導(dǎo)航條一起使用來顯示二級(jí)或三級(jí)內(nèi)容

關(guān)注內(nèi)容的劃分范圍(符合用戶的心智模型)比關(guān)注頁面的展示更重要.因?yàn)樽畛Ｒ姷腻e(cuò)誤是將一系列沒意義的內(nèi)容歸在一類.

1、盡可能降低分類之間的交集
2、讓分類之間的界限盡可能的清晰(例如,很容易猜到想要的東西是否在一個(gè)分類中)
3、避免過于寬泛或者過于特殊的分類名字.

為什么使用這個(gè)組件?
頂部導(dǎo)航條提供給用戶一種很方便,簡(jiǎn)潔分類展示方式,讓用戶訪問品類繁多的有組織的內(nèi)容

來源：http://pd4.me/blog/methodology/top-navigation-bar_yahoo_pattern_translate/