網站新手入門

什麼是漢堡選單 (漢堡功能表)?

如果您在您的手機上瀏覽網路,您可能會注意到,您以前在桌機上看到的導覽選單內容變成三條水平橫線取代。

它之所以命名為 “漢堡選單”,是因為它 (我們無意中發現) 看似牛肉三明治的標誌性 (尤其是雙層三明治),而不是因為它與速食有任何關聯。

漢堡選單從哪裡來?

由於其最近在行動網站上越趨流行,您可能會認為此簡單的圖示是隨著智慧型手機的發明或響應式設計的出現而製作出來的,但事實是,漢堡選單 (或稱 “通風口”,此為其最初的暱稱) 是由 Norm Cox 在為 Xerox “Star” 設計第一個圖形用戶介面時所創建的

Cox 設計此圖標代表您點擊時所會顯示的內容:選項清單。
在 Xerox “Star” 有限的像素空間上,圖形設計師力求盡可能的簡化,並把將圖標與路標變得一樣容易識別為目標。

我們在日常生活中習慣於電腦上的許多標準圖標都是來自圖形介面設計的年代。

漢堡選單的歷史可以追溯到 1980 年。但其實,直到 Apple 在大約 30 年後,也就是 2009 年時,將該選單添加到 Voice memo 的應用程式中後,它才真正起步。隨著其他一些潮流引領者的使用,漢堡選單很快地被通稱為 STOP 符號。

漢堡選單現在可以完成其原本設計的基本任務,也代表著歷已經繞了一圈:代表我們可以透過點擊 (或在智慧型手機上點選) 圖標以展開選項清單,否則選項清單將保持隱藏。與當時的原因相同,其簡單的設計在現今也非常具有吸引力:使用最小的螢幕空間即可快速達到其目的。

我應該使用漢堡選單嗎?

漢堡選單擁有許多粉絲,但也有不少批評者。每個設計都一樣,有它的優點也有它的缺點。

缺點值得被納入考量,不應該輕易地忽視它。

無法辨識

首先,漢堡選單有個問題,就是它容易使人們感到困惑。對於技術不太在行的網路用戶而言,看到這三條平行線並不曉得這是一個需要 “點擊以展開選單” 的暗號,因此,若您整個網站導覽都使用漢堡選單可能會使您失去一些網站訪問者。

過多的資訊

接著,您很容易就不小心 “塞滿” 您的漢堡選單。因為您會覺得,是不是可以在清單中再加上一個選項?一旦您加上了第四個選項,就會覺得好像可以加上第五個選項,當您有了六個選項時,您就會想說,好像可以在加上第 7 項?

將您的漢堡選單塞滿比思考如何將您網站上的訊息進行分層,並且創建最佳導覽方式來的更簡單。

過多的點擊

另一個漢堡選單的問題是,您需要透過點擊以進入您想要訪問的頁面。訪問者每次都要多點擊一次選項才能到達他們想要去的頁面,這也代表他們最後很可能根本沒有到達他們想要去的頁面。

同樣地,當其故障時,漢堡選單本身也不會提供任何實際訊息。您無法一眼看出選單中有哪些項目,只看得到這是一個帶有選項的選單。

使用漢堡選單的優點

然而以正面來看,使用漢堡選單可為您的行動式網站提供乾淨,簡約和時尚的設計。它提供了一種方法,使您的使用者可以有效地控制他們在您網站上的導覽,而不是依賴於無止盡的滾動式設計,滾動式設計會使您的訪問者需要更努力地尋找他們想要的訊息。

您可以透過將您的選單維持在最少選項的方式,並找到將其它選項合併到網站導覽中的方法,以避免許多缺點,而這些方法並不會影響將拓展漢堡選單的設計。

動手試試看

如果您有時間,我們建議您可以在自己的網站上動手試做看看。如果您需要一個空間讓您可以試試看,您可以使用我們的 Simple Hosting 作為您的遊樂場。