Hamburger menu – nazwa ikony złożonej z trzech równolegle położonych poziomych linii, która symbolizuje listę menu. Po jej naciśnięciu na ekranie wyświetlacza rozwija się (bądź chowa) lista kategorii, podstron itp. Umieszczana jest zwykle w górnym rogu graficznego interfejsu użytkownika. Nazwa ikony nawiązuje do warstw hamburgera, choć sama geneza nazwy nie jest jasna.
Historia
Ikona została zaprojektowana przez amerykańskiego projektanta interakcji Norma Coksa, jako element interfejsu użytkownika stacji roboczej Xerox Star. Xerox Star został wprowadzony na rynek w 1981 roku i był jednym z pierwszych komercyjnych komputerów posiadających graficzny interfejs użytkownika. Według Coksa hamburger menu miało być czymś w rodzaju pojemnika na menu kontekstowe. Zaprojektowane zostało z myślą, aby być łatwe do zapamiętania, proste i funkcjonalne w realiach niewielkiej ilości dostępnych pikseli. Design miał przywodzić na myśl rezultat wyświetlonej listy menu.
W 1985 roku ikona była wykorzystywana w środowisku Windows 1.0.1 do wywołania menu systemowego. W późniejszych wersjach systemów Windows ikona z trzema poziomo położonymi liniami została zastąpiona przez ikonę z jedną linią, która to, wraz z wydaniem środowiska Windows 95, została wyparta przez miniaturowe ikony aplikacji. Hamburger menu ponownie zostało wykorzystane przez Microsoft, w systemie operacyjnym Windows 10, znajdując zastosowanie w Menu Start.
Zastosowanie
Wraz z rozwojem rynku mobilnego, aplikacji mobilnych i rozpowszechnianiem responsywnego projektowania stron internetowych hamburger menu zyskało znaczną popularność. Jest często wykorzystywane przy projektowaniu stron internetowych, szczególnie na urządzenia mobilne, gdzie stanowi branżowy standard. Smartfony są ograniczone niewielkim rozmiarem ekranu, przez co twórcy stron i aplikacji, aby zaoszczędzić nieco miejsca, używają tej ikony do reprezentowania bocznego menu. Czasami ikona złożona z trzech linii redukowana jest do postaci pionowego wielokropka. Do implementacji funkcjonalności menu stosuje się język JavaScript.
Krytyka
Pomimo popularności wykorzystywanie ikony do wyświetlania nawigacji spotyka się z krytyką projektantów stron internetowych. Nie wszyscy użytkownicy komputerów i urządzeń mobilnych rozpoznają ikonę i wiedzą o jej zastosowaniu, dotyczy to w szczególności osób starszych. Testy A/B przeprowadzone przez web developera Jamesa Fostera wskazywały, że dołączenie do ikony słowa Menu (lub zastąpienie jej tym słowem) zwiększa klikalność. Jednak testy A/B wykonane przez zespół Booking.com nie potwierdziły tej tezy.
Zobacz też
Uwagi
- ↑ Istnieje wiele wariantów tej nazwy.
Przypisy
- 1 2 3 Kelsey Campbell-Dollaghan: Who Designed the Hamburger Icon?. Gizmodo, 2014-03-31. [dostęp 2022-10-11]. (ang.).
- 1 2 How TO - Mobile Navigation Menu. www.w3schools.com. [dostęp 2022-10-11]. (ang.).
- 1 2 3 Co to jest przycisk menu hamburgera?. technoglitz.com. [dostęp 2022-10-11]. (pol.).
- ↑ Fahad Ali: Microsoft First Used The Controversial Hamburger Menu In 1985. www.windowschimp.com, 2015-05-13. [dostęp 2022-10-11]. [zarchiwizowane z tego adresu (2021-04-01)]. (ang.).
- ↑ Krzysztof Kapusta: Menu systemowe - niewidoczny element Windows, który się czasem przydaje. CentrumXP, 2016-01-26. [dostęp 2022-10-11]. (pol.).
- 1 2 Dan Nessler: To hamburger or not to hamburger. medium.com, 2016-02-25. [dostęp 2022-10-13]. (ang.).
- 1 2 Ana Gonzalez: A Brief History of the Hamburger Icon. placeit.net. [dostęp 2022-10-12]. (ang.).
- ↑ Amy Schade: Supporting Mobile Navigation in Spite of a Hamburger Menu. www.nngroup.com, 2015-08-16. [dostęp 2022-10-14]. (ang.).
- ↑ Carrie Cousins: Loving & Hating the Hamburger Icon. www.webdesignerdepot.com, 2015-05-16. [dostęp 2022-10-14]. (ang.).
- ↑ Hamburger icon: How these three lines mystify most people. BBC News, 2018-09-17. [dostęp 2022-10-14]. (ang.).
- ↑ Michel Ferreira: Would you like fries with that? Discussing the Hamburger Icon.. Booking.com, 2015-09-21. [dostęp 2022-10-14]. (ang.).