就目前而言，“綜合下拉菜單”這種設(shè)計(jì)模式還是相對(duì)少見(jiàn)的。但是我確信，不出半年，它將會(huì)普及開(kāi)來(lái)。

什么是的“綜合下拉菜單”？

大型網(wǎng)站的導(dǎo)航系統(tǒng)一直是一個(gè)難點(diǎn)。當(dāng)然你可以試圖創(chuàng)建一個(gè)龐大的站點(diǎn)地圖一樣的導(dǎo)航菜單來(lái)鏈接到所有的頁(yè)面，但是實(shí)際上，當(dāng)頁(yè)面越來(lái)越多而且不斷增加的時(shí)候，這種做法將會(huì)變成一個(gè)不可能完成的任務(wù)。

一般情況下，設(shè)計(jì)師會(huì)有兩種做法：

1.設(shè)計(jì)一個(gè)輕巧簡(jiǎn)潔的主導(dǎo)航菜單，鏈接到各個(gè)主要的頁(yè)面，并在主要頁(yè)面上添加附加的導(dǎo)航菜單，以便鏈接到更深的層次。這種方式很容易實(shí)現(xiàn)，可用性也不錯(cuò)。但是如果訪(fǎng)問(wèn)者想要看到的頁(yè)面藏得比較深，那么就只好多點(diǎn)幾次鼠標(biāo)了。

2.采用動(dòng)態(tài)下拉或展開(kāi)式菜單，這種模式可以讓訪(fǎng)問(wèn)者無(wú)論在瀏覽哪個(gè)頁(yè)面時(shí)，都可以直接到達(dá)另外更多的頁(yè)面。它提供了一種快速導(dǎo)航的模式，然后，在可用性方面，如果訪(fǎng)問(wèn)者的瀏覽器沒(méi)有開(kāi)啟JavaScript的支持，他們有可能根本就看不到下拉或展開(kāi)的菜單。
(僅用CSS實(shí)現(xiàn)的下拉菜單也是可以實(shí)現(xiàn)的，但是:hover這個(gè)鼠標(biāo)懸停的偽類(lèi)并不是每個(gè)瀏覽器都能完整支持的……比如……萬(wàn)惡的IE6！)

綜合下拉菜單，則是上面兩個(gè)模式的一種折衷方案。它的效果類(lèi)似Microsoft Office 2007里的Ribbon菜單。

(示例：Office 2007 Ribbon)

?

(示例：actionenvelope.com)

綜合下拉菜單有哪些特點(diǎn)？

通常，一個(gè)綜合下拉菜單:

1.是一個(gè)通過(guò)鼠標(biāo)懸停感應(yīng)來(lái)展示和隱藏的下拉菜單。

2.在一個(gè)較大的面板上顯示所有的項(xiàng)目。

3.這些項(xiàng)目根據(jù)相關(guān)性進(jìn)行了分組排列。

4.使用圖標(biāo)和圖形來(lái)幫助訪(fǎng)問(wèn)者更好地識(shí)別項(xiàng)目。

為什么綜合下拉菜單會(huì)流行？

有很多理由可以預(yù)示綜合下拉菜單將會(huì)在許多網(wǎng)站成為主流的設(shè)計(jì)：

1.它提供了在簡(jiǎn)單導(dǎo)航和復(fù)雜的動(dòng)態(tài)菜單中的一個(gè)折衷方案，既不會(huì)顯得信息量太少，也優(yōu)化了信息結(jié)構(gòu)，不會(huì)顯得太復(fù)雜而難于訪(fǎng)問(wèn)。

2.它實(shí)現(xiàn)方便，僅需考慮到極少的可用性問(wèn)題。

3.它給了設(shè)計(jì)師更多的空間和視野來(lái)發(fā)揮自己的創(chuàng)意，而且通?？瓷先ザ己芪L(fǎng)問(wèn)者。

或許更引人注目的一點(diǎn)是，web可用性專(zhuān)家Jakob Nielsen也推薦使用綜合下拉菜單！一般來(lái)說(shuō)，他對(duì)很多新的web控件、模式都持批評(píng)態(tài)度，但是這次他也認(rèn)為綜合下拉菜單是一個(gè)好的模式，并建議設(shè)計(jì)師們可以嘗試使用這種模式來(lái)增強(qiáng)自己設(shè)計(jì)的網(wǎng)站的導(dǎo)航系統(tǒng)。

你怎么看？綜合下拉菜單會(huì)變得無(wú)處不在嗎？你是否在使用他們了呢？還是說(shuō)你會(huì)在你的網(wǎng)站嘗試一下呢？

via?Mega Menus: the Next Web Design Trend?by Craig Buckler