The Menu Bar

Look at this screenshot of MacPaint from the mid-1980s. Now look at this screenshot of a current version of Microsoft Excel for Mac. Finally, consider just how different the two applications actually are. The former is a 30-year-old black and white first party application for painting while the latter is a current and unabashedly third party application for creating spreadsheets. Yet despite having been created in very different decades for very different purposes by very different companies, these two very different applications still seem a part of the same thread. Anyone with experience in one could easily find some familiarity in the other, and while the creators of the Macintosh set out to build a truly consistent experience, there is only one significant piece of UX that these two mostly disparate applications share —the menu bar.

On a recent episode of The Talk Show, John Gruber hit upon a topic I have been ruminating on for a few months now:

To me, it comes down to the most mundane and overlooked, and because it’s been here right since 1984 when the first Mac shipped, but the menu bar… But the Mac’s menu bar, the fact that it’s still there and still useful and, if well done and well designed, organizes things in a way that you know where to look for them is such a powerful feature…

The menu bar has been, and in my opinion remains, the best mechanism for providing familiarity, discoverability, and progressive disclosure in user interfaces on any platform. Even beyond the Mac, anyone who has clicked on a File menu in one platform has a pretty good shot at guessing where a Save command might be when provided a File menu somewhere else. Likewise and also regardless of operating system, someone presented with an entirely new application can safely open and explore menus to try and locate features they might need. Never pivoted data before, but need to for the first time? Hey look, there’s a menu in the bar called Data! Finally, let’s say that same seemingly one-time operation becomes a regular course of action that is needed multiple times a day. The best menu bars provide an equivalent keyboard shortcut right next to the command so, for example, anyone can discover how to save using command – s without having to be told.

So then why are menu bars fading out of more modern UX conventions?

On mobile, the answer is obviously two-fold — screen real estate and touch. From before the iPhone to today’s relatively large screen smartphones, screen real estate remains a precious commodity. Even the most common functionality like notifications require various gestural incantations so they can accessed without onscreen controls 1, and because of touch, anything that does require onscreen controls does so at over double the cost of real estate to accommodate for larger and less precise fingers.

Larger tablets do have the screen real estate to support some sort of UX analogous to the menu bar, but any such mechanism would have to be significantly rethought for touch. In addition to needing a larger target size, touch controls come with another disadvantage — no hover state. I don’t think menus need hover support per se, but I’d also argue that hovering is what makes exploring complex sub-menus a fluid experience in desktop environments. Having to explore the various menus in a sophisticated application like Photoshop by repeatedly tapping in and the out of numerous sub-menus would be arduous by comparison. I think the lack of a hover state is a solve-able problem, but building any sort of sophisticated UX akin to the menu bars available on the Mac and Windows will require much more thought than simply porting over what’s available on pointer driven user interfaces.

Speaking of pointer driven interfaces, menu bars are also fading from desktop UX convention. Unlike in smartphones or tablets, where the lack of menu bars on mobile is a result of various technical and physical limitations, menu bars in desktops are being minimized primarily for aesthetic reasons. Marco Arment, while likely still detoxing from his guesting on the aforementioned episode of The Talk Show, went into the topic of app design trends on a recent episode of Accidental Tech Podcast:

But also, modern design trends are such that you try to hide as much as possible in the main interface. You are trying to make the main interface as empty as possible… Right now we are in, I’d say probably the three-quarters point of a trend of ultra minimalism everywhere. And the fact is that’s just a style…

Marco’s right. App design is largely driven by trends in styles. It’s fashion. John Gruber offhandedly used the word “mundane”, even while extolling his love for the menu bar above. Even worse than boring, pinning menu bars to each individual window quickly becomes downright ungainly and is my best guess as to why hiding or removing menu bars is far more common in Windows 2.

The most popular convention to replace menu bars, again more prevalent on Windows, is to shove everything into a single menu. While certainly cleaner looking than individual window menus, these catch-all behemoths don’t seem more intuitive to me and are certainly less consistent. Developers can’t even decide on what icon to use for their über menu, let alone how commands and options should be presented. Even sophisticated applications that benefit the most from having menu bars are sidelining them in favor of custom UX. There isn’t an equivalent 30 year comparison on Windows when using same version of Microsoft Excel, because Excel for Windows also hides its menu bar entirely in favor of the dubiously “more intuitive” ribbon 3. On Mac applications, most of these newer mechanisms are entirely redundant and exist largely for consistent UX across platforms. Even the ribbon laden I-look-just-like-Windows-Excel for Mac also benefits from comprehensive menu coverage 4.

The menu bar isn’t perfect. It’s not a solution for touch and even the Mac’s global menu bar can quickly become overwhelming in very sophisticated and poorly designed applications, but for now I would happily stay in a world with familiar menu bars than one without… at least until something better comes along.

I really hope something better comes along.


  1. Part of me wonders just how much gesture based UX has had the unintended consequence of making the most common features also the most undiscoverable. ↩︎

  2. Bruce Tognazzini, the author of Apple’s first human interface guidelines, explained the role of Fitts’s law in the Mac’s global menu bar in his book “Tog on Interface”. I have yet to hear a similarly strong counter argument for placing multiple menu at the top of each window and am confounded to this day as to why that became the prevalent solution. On page 204, Tog writes:

    Trying to hit a small target requires people to slow down and be careful; with a large target, people can accelerate up the screen without caring how much they would have overshot. In effect, a border target has an infinite height…

    ↩︎

  3. I would say that Microsoft has stumbled into a own more touch friendly menu bar replacement with the ribbon. I say “stumbled” because the ribbon was intended mostly as a more user friendly menu bar replacement, and I say “would” because it still doesn’t even have touch friendly icons↩︎

  4. Proof positive of the power of the menu bar was the person sitting in front of me during my flight at the time of writing this. They were working with the Windows version of Microsoft Word, and sure enough awkwardly sitting there above the ribbon was a deliberately re-enabled menu bar. ↩︎