版權(quán)聲明：轉(zhuǎn)載時(shí)請(qǐng)以超鏈接形式標(biāo)明文章原始出處和作者信息及本聲明
http://piglili.blogbus.com/logs/37791411.html

不久前寫了這篇關(guān)于Tab的文章，最近看到兩老外的關(guān)于Tab的好文，特此推薦。在Tabbed Navigation, and What Makes it Useful一文中，David Leggett解釋了Tab這個(gè)metaphor的來源，以及使用導(dǎo)航Tab的四個(gè)好處，不過沒有具體講該怎么設(shè)計(jì)。作為補(bǔ)充，可以參考Smashing Magazine上的Showcase Of Well-Designed Tabbed Navigation，提供了大量的優(yōu)秀實(shí)例。但關(guān)鍵不在于看人家弄得多漂亮然后照搬，而是學(xué)習(xí)（并鉆研）怎么樣能弄得這么漂亮吧？圓角、漸變……都是小細(xì)節(jié)。但正是這些小細(xì)節(jié)讓整體看上去完全不一樣了。否則又只是生搬硬套的抄襲，還要抄不到點(diǎn)子上……sorry，又糞青說教了，最近實(shí)在看了太多劣質(zhì)山寨。很搞笑，在反饋用戶測(cè)試報(bào)告提到一個(gè)視覺設(shè)計(jì)的問題時(shí)，設(shè)計(jì)師反駁道，“XX網(wǎng)站（某主流網(wǎng)站，被抄襲對(duì)象）也是這么做的啊”，啊哈，測(cè)試時(shí)用戶就說了，“是沒錯(cuò)，但那XX網(wǎng)站也讓我不爽很久了”。

另外，OutC童鞋給我的文章留言道——

我認(rèn)為hover使用的必要性上還需要補(bǔ)充兩點(diǎn)：
1. 看導(dǎo)航菜單的Tab個(gè)數(shù)，如果個(gè)數(shù)太多而且都有子菜單，那么就十分有必要使用hover，因?yàn)槲覀儾荒鼙ＷC用戶是不有足夠的耐心去一個(gè)個(gè)點(diǎn)開分類菜單查看子分類；
2.如果對(duì)于導(dǎo)航下Tab中有相對(duì)應(yīng)的首頁(yè)來說，使用hover就顯得有些不可取，因?yàn)閔over這一動(dòng)作使得用戶的關(guān)注點(diǎn)集中在了Tab的子菜單下，而不是Tab本身，這樣就使得Tab大分類的首頁(yè)變得無足輕重，所以hover的使用還是需要權(quán)衡一下的。

在原文中，切換問題我是分別針對(duì)導(dǎo)航Tab和內(nèi)聯(lián)式Tab來寫的，但對(duì)前者的分析不是很全面。因此十分感謝他的補(bǔ)充。導(dǎo)航Tab是hover還是點(diǎn)擊切換的，針對(duì)OutC提出的第一點(diǎn)，原文我寫了：

“一般來說，導(dǎo)航Tab都是點(diǎn)擊切換的，因?yàn)樯婕暗秸?yè)刷新時(shí)載入速度的問題。但有時(shí)因?yàn)閾?dān)心Tab下的二級(jí)導(dǎo)航項(xiàng)藏起來用戶找不到（也即我們不能保證用戶是不有足夠的耐心去一個(gè)個(gè)點(diǎn)開分類菜單查看子分類的情況），就會(huì)出現(xiàn)圖4這個(gè)導(dǎo)航 Tab采用hover切換刷新二級(jí)菜單的方式?！?在這種情況下，我提出了要解決好觸發(fā)靈敏度，不再贅述。

關(guān)于第二點(diǎn)，不知道OutC同學(xué)所言“導(dǎo)航下Tab中有相對(duì)應(yīng)的首頁(yè)”，是指二級(jí)子類目中有一個(gè)第二層級(jí)的首頁(yè)嗎？我有點(diǎn)不太能理解你所描述的場(chǎng)景但總而言之，正如我在寫內(nèi)聯(lián)Tab切換問題時(shí)所說，沒有絕對(duì)的選擇，關(guān)鍵是選擇后如何處理好細(xì)節(jié)上的設(shè)計(jì)。