如何解決漢堡圖標（三道槓）問題

 

　　@十萬個為什麽 ：漢堡圖標，也就是三條小橫線，一直以來被用於表示指向菜單的鏈接，是當今網頁中最具爭議的技巧之一。據說設計師們都討厭它;客戶們也恨之入骨。那為什麼它卻無所不在?

　　漢堡圖標可以輕易縮放，它可以精確吻合像素網格。它原本是表達列表的圖標，被強行冠上了如今的角色，但既然菜單就是一列選項，這樣使用它從含以上來說是正確的。

　　在這個課題上，有數不盡的爭論、A/B型測試、博客宣洩、用戶研究，但這些研究幾乎都在關注app設計。當漢堡圖標用於網頁設計時，它表現出了更大的問題。

　　漢堡圖標的問題

　　有很多設計師質疑漢堡圖標本身的價值。它頻繁作為iOS風格圖標出現，雖然在Apple采用它之前，就已經被這麼用了。

　　World-of-swiss

　　Hugeinc

　　事實上，關於它是不是可用的菜單圖標，有大量相互矛盾的證據。有些設計師主張，年輕人能輕松認出這個圖標，其他人則表示年紀大的若有上網經歷，也可以辨認出來。這項證據中，我們只能得出唯一一個結論，可用性測試結果是不確定的，相似的測試常常得出相互矛盾的結果。

　　大家普遍接受一點，用戶不會把漢堡圖標當作單一鏈接，很可能是因為它被設計成一組鏈接，而非單個鏈接的樣子。支撐它的是環繞周圍的邊框，或是一塊背景色，使它看起來更像一個按鈕，我敢說，再擬物一些可以增加點擊量。

　　Futureinsightslive

　　漢堡圖標還有更多問題

　　除卻圖標本身不說，使用它的方式也充斥著問題。

　　首先，可能也是最明顯的，漢堡圖標給導航增加了額外的操作;原本一次點擊就可以到達具體頁面，現在需要兩次。根據網頁設計師的經驗，3次點擊要能抵達(任何地方)，目前為止，導航問題並沒有解決，漢堡圖標這種技巧，只是把一個問題變成了另一個問題。當然，這不僅僅是漢堡圖標的問題，它也是所有這種風格導航的問題。你可以用“菜單”兩字代替漢堡圖標，阻礙仍然存在，區別只是漢堡圖標沒法用在其他地方。

　　Middle-earth.thehobbit

　　Jam3

　　漢堡圖標同時也隱藏了它的內容。從用戶體驗的觀點來看，用戶不應該為了解自己能做什麼，而做出任何動作。“分享到Twitter”或“付款”這些操作若不是近在眼前，太容易被用戶忽略。用戶根本不會去找他們不知道的鏈接。

　　最後，漢堡圖標隱藏了網站的當前狀態，還有用戶所在的位置。菜單中的按下狀態為用戶提供了前後關聯信息，而漢堡圖標則使它變得隱晦。

　　London-se

　　漢堡圖標能做好什麼?

　　鑒於漢堡圖標被普遍厭惡，還導致一連串問題，為何它還隨處可見呢?

　　以我的經驗，原因當然在特定的年齡層裡，漢堡圖標近年來已經深得辨識度的精髓。駁斥它的研究往往是一年前或更早的，而一年對於互聯網來說可是很長時間。

　　事實上，鏈接圖標遠比“鏈接”或“分享”更易辨識，但決定性的形式尚未顯現出來。而漢堡圖標卻在各種不同設計中都保持了統一。

　　最重要的是，漢堡圖標保持了它的初衷：它為我們節省了大量寶貴的屏幕空間資源。假如客戶給你多如牛毛的東西，都要加到菜單中，那麼把它們移除屏幕並給出鏈接，就是簡單粗暴卻非常有效的辦法，可以為客戶同樣想要的內容騰出空間。

　　我得說漢堡圖標在這個問題上，比其他解決方案都好，但也不盡然。還是應該說，漢堡圖標沒有其他解決方案那麼糟糕。

　　問題的根源

　　漢堡圖標得到采用，還是因為設計師(更多時候是客戶)沒有完全遵循移動優先的設計方法。他們想要一個“常規”站點，卻把它硬塞進外孫女的手機中。

　　漢堡圖標的反對者往往用“菜單”二字代替它，他們這麼做完全不得要領。不論是否形似，漢堡圖標如今已經達到了它的含義，但用戶理解這個按鈕是干什麼的，並沒有解決最大的問題，它隱藏了導航，隱藏了用戶的選擇，這是相當嚴重的自殘。

　　簡單說，漢堡圖標是一種象征，象征著我們在一心一意全方位擁抱移動優先的道路上，集體失敗了。

　　Ponomusic

　　Mccollcenter

　　更好的解決辦法

　　為了解決漢堡圖標的問題，我們得接受一個現實，我們以往所知的網頁已經不再管用了。移動網頁的崛起，遠非減少幾欄、去掉一些沉重的圖片文件這麼簡單。

　　不同於舊時代的網頁，移動網頁采用了一種不同的方式。移動網頁生在專注於app的環境中，用戶希望傳統網頁也有類似的時尚體驗。

　　很著名的例子，Facebook的app將他們的漢堡圖標改成了標簽欄，結果顯示轉化率得到了提升。然而Facebook除了更換菜單設計，還做了意義重大得多的事情。近來他們發布了Messenger，了不起的地方在於，他們已經有了功能完善受人歡迎的app，他們本可以將信息功能整合進去。Facebook卻拆分了這些功能，使每個app專注於自己的角色，便得到了兩個簡單的app，而非一個復雜的app。縮減功能導致了菜單項的減少，就不那麼需要漢堡菜單了。

　　優秀的app都極為專注，他們通過遠比網頁嚴苛的用戶測試進化。要打造app一樣的體驗，我們得簡化網站，再簡化，然後再多簡化一點點。如果有必要，將建築結構打散成可管理的小片，近似於迷你站點。當我們為用戶展現一組簡單的選擇，復雜菜單的問題再也不會出現了。

　　使用漢堡圖標就像在傷口上扎繃帶：雖然把它包起來了，下面的傷口仍在。

　　我們只有完全擁抱移動優先的方式，不僅將它用於設計，也用於我們的內容和信息結構，漢堡菜單才會成為歷史。