網(wǎng)頁設(shè)計中漢堡式菜單的利與弊發(fā)布者：本站     時間：2022-03-18 10:03:49

現(xiàn)在很多時候，你可能都會在移動界面的右上角看到“漢堡式菜單”，它們通常是三行堆積在一起，形狀類似于一個漢堡，因為占用空間少，所以常被作為一個網(wǎng)站設(shè)計功能納入網(wǎng)站菜單。

雖然漢堡式菜單在提供簡練的信息和簡約設(shè)計上有著巨大的優(yōu)勢，而且能使網(wǎng)站本身看起來十分簡潔，但是也存在著巨大的缺點。

網(wǎng)頁設(shè)計中漢堡式菜單的利與弊

無論你怎么稱呼它，側(cè)邊欄，抽屜式導(dǎo)航還是漢堡式菜單，隨著時間的推移，總會有一個新的事物來代替它來提高用戶參與度。許多人在網(wǎng)頁設(shè)計中的漢堡式菜單上抱有爭議，以“眼不見，心不煩”這種思路來設(shè)計會降低用戶的參與度和網(wǎng)站的功能性。并且會降低轉(zhuǎn)化率。

使用目標菜單來保護寶貴的界面空間的設(shè)計思維像野火一樣蔓延了整個網(wǎng)頁設(shè)計界，漢堡式菜單這種設(shè)計方法幾乎在全線每一個網(wǎng)站都迅速被采用。現(xiàn)在改變這種方式可能為時已晚，但是討論漢堡式菜單的利與弊仍然具有價值，因為用戶的需求發(fā)生了改變。

漢堡式菜單缺乏效率
一個漢堡式菜單最基本的缺陷就是位于移動應(yīng)用上突出的位置 – 左上角。對于習慣用右手操作的用戶而言，這個位置顯然并不完美，并且不適合訂閱。

在用戶能看到他們選擇的內(nèi)容之前，他們必須輕點菜單，當確定這是要找的正確信息時，還得再點擊一次。如果想要回到菜單導(dǎo)航，他們還必須在多屏幕中進行多次點擊，選擇“是”或者“返回”等多次操作才能退回。單次看起來這可能不會有什么，但這使一個用戶找到正確界面的時間成本大大的增加了，用戶對這種操作越熟悉越覺得不妥，于是越來越多的用戶會抱怨這個模式。

在當今這個競爭異常激烈的市場，是什么讓你的網(wǎng)站脫穎而？是用戶，所以你所有的出發(fā)點和圍繞中心都必須是用戶。當你用漢堡式菜單簡練的概括了你網(wǎng)站的所有功能或者內(nèi)容的時候，你就必須了解，可能存在這樣的風險，你的用戶將不會看到你的品牌到底哪里與眾不同。這傷害了整體品牌的知名度和轉(zhuǎn)換率，對于推廣你的產(chǎn)品也毫無益處。

網(wǎng)頁設(shè)計中漢堡式菜單的利與弊

用戶可能偏向“熱狗式”菜單
雖然設(shè)計師們很快完成了漢堡式菜單設(shè)計的革命，這種設(shè)計清新，美觀并且十分簡約大方，但是他們忽視了一個重要的因素——用戶需求。很多用戶并不知道這種菜單提供了什么，或者不愿意去點擊它。他們依然面無目的的在你的網(wǎng)站中搜索著他們需要的信息，當時這是徒勞的。

與此同時，還有這樣一批網(wǎng)站，它們將用戶尋求的信息設(shè)置在用戶一眼就能看到的地方，用戶不必一個個的翻找隱藏的選項，而且不用擔心自己會漏掉信息。許多網(wǎng)站都選擇了概括式途徑和恢復(fù)上一級菜單的設(shè)計方式（比如將其水平排列在頂部菜單），并且看起來效果很不錯。

漢堡式菜單的簡練使文本信息不易被發(fā)覺，而現(xiàn)在的情況是，一個普通用戶如果查看頁面十秒鐘不能發(fā)現(xiàn)或者理解他想要的信息，他會馬上離開，漢堡式菜單要求用戶有快速的發(fā)現(xiàn)能力，但這點很難實現(xiàn)。雖然漢堡式菜單相當吸引人，但卻忽視了用戶的實際水平。

用戶通常很難理解一個漢堡包的菜單，而傳統(tǒng)的菜單不能不立即被理解 。于是很多人會產(chǎn)生抱怨，網(wǎng)站試圖通過改變菜單包括后退按鈕或其他選項，如在漢堡式菜單圖標的旁邊添加文字，使之更加人性化，以減輕用戶的不滿。

網(wǎng)頁設(shè)計中漢堡式菜單的利與弊

但是許多改變只會使用戶對于菜單欄更加困惑，現(xiàn)在許多漢堡式菜單樣式和用戶在使用菜單之前，都必須先搞清楚那些選項可以使用才能使用正確的導(dǎo)航功能。你應(yīng)該多想想其他選擇，而不僅僅只是假設(shè)漢堡式菜單包含和作用于所有網(wǎng)址導(dǎo)航。

如何打破禁錮
在許多情況下，你可以優(yōu)化漢堡式菜單使其具有更高的可用性，或?qū)⑵涮鎿Q成別的導(dǎo)航選項。但是有時，你只需將漢堡式菜單移動到屏幕的右側(cè)，就足以使你的網(wǎng)站看起來獨特并提高用戶的參與，因為右側(cè)更容易挖掘習慣右手的用戶。

同樣，你可以優(yōu)化菜單的點擊方式。在頂部菜單中，用戶通常都會將他們的注意力集中在第一個和最后一個元素，這兩個地方同樣是你放置重要信息的地方。如果你將菜單設(shè)置在側(cè)邊欄中，你需要從高到低排列不同重要程度的信息，以符合用戶垂直掃描的視圖習慣。

你同樣可以恢復(fù)到漢堡式菜單最初的模式，創(chuàng)造一個經(jīng)典的用戶友好的頂部菜單，比如下面這個例子：

網(wǎng)頁設(shè)計中漢堡式菜單的利與弊

GameStop使用動畫圖標，以提高可用性，同時也完全避免了漢堡式菜單。他們已經(jīng)優(yōu)先調(diào)查了用戶最需要從他們的應(yīng)用程序中獲得什么，在其頂部菜單中只包括這些。這樣在不需要一個抽屜式的菜單隱藏信息的情況下，該網(wǎng)站仍然達到一個干凈，清新的外觀。

網(wǎng)頁設(shè)計中漢堡式菜單的利與弊

這些圖標和文本結(jié)構(gòu)會使你一眼就注意到文本內(nèi)容，但是又同時保證不會搶了下方界面內(nèi)容的風頭。但是事實上你并不能時時刻刻根據(jù)下文內(nèi)容來調(diào)節(jié)圖標及文字的大小，這個時候，我們建議你使用純文本的菜單或者網(wǎng)站，這樣菜單就不需要了。無論哪種方法，首先考慮用戶，根據(jù)用戶特性進行設(shè)計。

對于那些希望能減少浪費時間的用戶來講，你的菜單應(yīng)該是一目了然的，同時也必須是易理解的。實現(xiàn)這點功能，你需要在其他地方妥協(xié)很多。如果你想要最大程度上調(diào)動用戶的參與性，簡單和易解這兩點是必需達到的。當你困擾與菜單選項的優(yōu)先次序時，記住把自己當作用戶，從用戶的角度出發(fā)。舉個例子，你的文筆可能很好，很會寫生活感悟，但是用戶到你的網(wǎng)站來想看的是你的產(chǎn)品，那么文筆再好也是次要的，只能為了突出產(chǎn)品做陪襯。

跟著你的直覺走
如果你在作品中已經(jīng)采用了漢堡式菜單或者它的一些變形，別急著馬上用其他設(shè)計模式改變替代它，仍然有許多用戶傾心于漢堡式菜單的易用性和獨特魅力。特別是當開發(fā)一個移動應(yīng)用時，在有限的空間中，漢堡式菜單就相當實用了。

盡管漢堡式菜單目前飽受爭議，但是如果你的網(wǎng)頁特別適合采用漢堡式菜單，那就繼續(xù)使用，只要保證你菜單中的所有部件都達到標準，能達到最佳的用戶參與度。但是如果你僅僅是出于懶惰就直接選擇了漢堡式菜單，那我認為你該重新思考一下自己的選擇了。