Open main menu

Wikipedia β

Example hamburger icon
Screenshot of Wikipedia mobile app with hamburger icon and opened menu

The hamburger, hotdog, pancake, tribar (or triple bar) double oreo or options button is a button placed typically in a top corner of a graphical user interface.[1] It takes the form of an icon that consists of three parallel horizontal lines (displayed as ), suggestive of a list,[2]. The names refer to its resemblance to the layers in a hamburger, a pile of pancakes, or three hotdogs.[3]

Selecting (tapping or clicking) this button results in a menu being revealed (sliding out or popping up), which distinguishes it from a menu bar, which is always on display.[1]

Use of this icon as a graphical shortcut originated in order to save space on smaller devices (like smartphones).[3] On devices with even smaller user interfaces, the wider hamburger button may be reduced to three vertically stacked dots (displayed as a tri-colon or vertical ellipsis ),[4] from which it may also be described as a kebab.[5]

Compared to other computer menus, a hamburger button increases interaction cost and pay out in less space usage of the screen.[6]

Hamburger buttons have been criticized by TechCrunch as a "poor design choice" in apps for mobile devices.[7]

The icon was originally designed by Norm Cox as part of the user interface for the Xerox Star,[2] and it saw a resurgence starting in 2009 stemming from the limited screen area available to mobile apps.[8]

See alsoEdit

ReferencesEdit

  1. ^ a b Bawcombe, Libby (August 27, 2014). "The hamburger menu-icon debate". The Atlantic. Atlantic Media. Retrieved April 10, 2015. 
  2. ^ a b Campbell-Dollaghan, Kelsey (March 31, 2014). "Who Designed the Hamburger Icon?". Gizmodo. Retrieved February 2, 2016. 
  3. ^ a b Lessin, Jessica (March 18, 2013). "What's a 'hamburger' button? A guide to app features". The Wall Street Journal. Dow Jones & Company. Retrieved April 10, 2015. 
  4. ^ "Why did Google choose to use vertical three dots icon instead of Hamburger icon on Chrome? - Quora". www.quora.com. Retrieved 2017-01-10. 
  5. ^ Bravo, Gonzalo. "Kebab Menu". thenounproject.com. Retrieved 2017-04-06. 
  6. ^ Budiu, Raluca (August 31, 2013). "Interaction cost: Definition". Nielsen Norman Group. Retrieved 2017-04-09. 
  7. ^ Constine, Josh (May 24, 2014). "Kill the hamburger buttons". TechCrunch. Retrieved April 10, 2015. 
  8. ^ "A Brief History of the Hamburger Icon". placeit.net. 29 October 2014. Retrieved 25 January 2017.