hamburger menu

B2
UK/ˈhæmˌbɜːɡə ˈmenjuː/US/ˈhæmˌbɜːrɡər ˈmenjuː/

Technical, Business, Informal (in tech contexts)

My Flashcards

Definition

Meaning

A button or icon on a website or mobile application, consisting of three horizontal lines, which when clicked reveals a hidden navigation menu.

A UI (User Interface) pattern for condensing site or app navigation into a collapsible side panel or dropdown list, typically represented by the stacked-line icon. It is named for its visual resemblance to a hamburger.

Linguistics

Semantic Notes

The term is specific to web design and app development. While 'menu' is understood broadly, 'hamburger menu' precisely identifies this visual pattern. It is a compound noun that functions as a single unit.

Dialectal Variation

British vs American Usage

Differences

The term is identical in both varieties. Differences may arise in secondary vocabulary (e.g., 'mobile' vs. 'cell phone' in surrounding context) but the term itself is standard.

Connotations

Neutral technical term in both varieties. Some UX professionals criticize the pattern for poor discoverability, a connotation shared globally in the tech community.

Frequency

Equally frequent in UK and US tech and web design discourse.

Vocabulary

Collocations

strong
click the hamburger menuhamburger menu iconhamburger menu button
medium
open the hamburger menuhide the hamburger menunavigation hamburger menu
weak
hamburger menu designhamburger menu patternhamburger menu located

Grammar

Valency Patterns

The [Noun: site/app] uses a hamburger menu[Verb: Click/Open/Tap] the hamburger menuThe hamburger menu [Verb: appears/contains/reveals] the links

Vocabulary

Synonyms

Strong

three-line menustacked lines icon

Neutral

navigation menu iconcollapsed menu button

Weak

side menu buttonmain menu button

Vocabulary

Antonyms

expanded navigation barpersistent menutab bar

Phrases

Idioms & Phrases

  • [No idioms specific to this technical term]

Usage

Context Usage

Business

In a meeting: 'We need to simplify the homepage; let's move secondary links to a hamburger menu.'

Academic

In a UI/UX research paper: 'The study evaluated user engagement metrics for sites employing a hamburger menu versus a tab bar.'

Everyday

Explaining to a friend: 'If you can't find the settings, look for the three little lines in the corner—that's the hamburger menu.'

Technical

In developer documentation: 'Implement the hamburger menu component using the React hook for toggling visibility.'

Examples

By Part of Speech

verb

British English

  • The designer decided to hamburger-menu the navigation to save space.
  • We should hamburger-menu those options.

American English

  • The team agreed to hamburger menu the main links.
  • Let's hamburger-menu the secondary navigation.

adverb

British English

  • [Rarely used as an adverb]

American English

  • [Rarely used as an adverb]

adjective

British English

  • It's a hamburger-menu approach to navigation.
  • The hamburger-menu icon is not intuitive for all users.

American English

  • The hamburger menu pattern is controversial.
  • We tested a hamburger-menu solution.

Examples

By CEFR Level

A2
  • Look for the three lines. That is the menu.
  • Click here to see more options.
B1
  • The website has a hamburger menu in the top corner.
  • Open the hamburger menu to find the 'Contact Us' page.
B2
  • Many mobile sites use a hamburger menu to conserve screen space, though its usability is often debated.
  • After the redesign, the main navigation was moved into a hamburger menu.
C1
  • Critics of the hamburger menu argue that it reduces discoverability by hiding key navigation paths, while proponents cite its minimalist aesthetic.

Learning

Memory Aids

Mnemonic

Imagine the icon (≡) is a top view of a hamburger: the top and bottom buns are the outer lines, the meat patty is the middle line.

Conceptual Metaphor

CONTAINER FOR HIDDEN CONTENT (The icon is a container or button that holds/hides the full menu contents).

Watch out

Common Pitfalls

Translation Traps (for Russian speakers)

  • Avoid literal translation as "меню гамбургера" which would mean a restaurant menu for hamburgers. Use the established calque "гамбургер-меню" or descriptive "значок меню из трёх полосок".

Common Mistakes

  • Calling it simply 'the three lines' without the 'menu' context, which can be ambiguous. Incorrectly capitalizing it as a proper noun (e.g., 'Hamburger Menu').

Practice

Quiz

Fill in the gap
On mobile sites, the primary navigation is often hidden behind a icon.
Multiple Choice

What is the primary purpose of a hamburger menu in web design?

FAQ

Frequently Asked Questions

It is named for its visual resemblance to a hamburger: the icon (≡) looks like two buns and a meat patty stacked together.

It is a common solution for saving space on small screens, but its effectiveness is debated. Hiding navigation can make it less discoverable for some users.

It is almost always placed in the top-left or top-right corner of a website or app interface, following common user expectations.

Yes, though it originated for mobile design, it is sometimes used on desktop sites to achieve a minimalist or responsive design, but this is less common.