Hacker News Board Hacker News, browsed like a classic message board
Live data from Hacker News

Using hamburger menus? Try sausage links (2019)

tdarb.org

Post reply on HN
Print view View original

91–100 of 208 posts

Re: Using hamburger menus? Try sausage links (2019)

#91

Post by politelemon »

hn_throwaway_99 wrote: post #67
ilamont wrote: post #5

When designing medium to large sized menu navigations on the mobile web the default go-to, for some time now, has been hamburger menus. This isn’t necessarily a bad thing Tell it to the many people who have no idea what it means on a mobile device, or increasingly on desktop websites. I've said it many times before, but it's worth repeating: Most people are frustrated by modern information tools. According to a 2015…

> I like the sausage link concept because it clearly labels options with text. 100%. I'm kinda surprised how the 3 lines hamburger menu got so prevalent in the first place, because it always user tests poorly. My guess is that when flat minimalism (my favorite shitty example of this is when Android expected everyone to know what a flat square, circle and triangle are supposed to mean) was the rage, even though user t…

Not quite, the usage of lines are still conveying something, it's similar to pause, play, stop on media players, it's similar to back, forward and refresh icons on the browser. Line based symbols are easy to pick up and have been picked up by users from our testing, I'm really not sure what studies you're referring to (?)

For an actual shitty example, look at Macos window button controls. Red yellow and green circles, they convey absolutely nothing, you're expected to learn them. Instead of slating this shitty design, everyone just rolls over and learns them.

Re: Using hamburger menus? Try sausage links (2019)

#92

Post by babypuncher »

brimble wrote: post #48
ilamont wrote: post #5

When designing medium to large sized menu navigations on the mobile web the default go-to, for some time now, has been hamburger menus. This isn’t necessarily a bad thing Tell it to the many people who have no idea what it means on a mobile device, or increasingly on desktop websites. I've said it many times before, but it's worth repeating: Most people are frustrated by modern information tools. According to a 2015…

Firefox and Chrome have proven Apple right, in forcing a top-of-screen menu bar to appear whether the application wants it to or not. This was demonstrated to me recently when my parents couldn't figure out how to print on Windows in Firefox (because there's no standard menu on it—they know "file -> print" just fine) and called me for help. After a moment of confusion on my part as I remembered that FF doesn't have a…

The way Apple does it is also better design than a conventional menu bar.

I can see why FF and Chrome hide it by default. Most of the actions tucked away in it are either used infrequently, or have common keyboard shortcuts. Turning it on in Firefox makes the chrome feel cluttered to me.

By exporting the application's menu bar to an OS-provided panel that includes other OS-provided functions (clock, status indicators, wireless controls), they enforce both a strong level of consistency while allowing for reduced window clutter.

Re: Using hamburger menus? Try sausage links (2019)

#93

Post by qwertox »

rustyminnow wrote: post #88
brimble wrote: post #48

Earlier quoted context omitted.

Firefox and Chrome have proven Apple right, in forcing a top-of-screen menu bar to appear whether the application wants it to or not. This was demonstrated to me recently when my parents couldn't figure out how to print on Windows in Firefox (because there's no standard menu on it—they know "file -> print" just fine) and called me for help. After a moment of confusion on my part as I remembered that FF doesn't have a…

I know this is besides your point, but in Firefox there is an option to turn the menu bar back on (at least until they remove the option :/). If you go to the "Customize Toolbar" page, on the bottom left where it says "Toolbars v" you can check "[ ] Menu Bar". Hope that helps (a little)!

Or right-click on any free space on the top row. There's an option in the menu.

Re: Using hamburger menus? Try sausage links (2019)

#94

Post by jokteur »

AlexandrB wrote: post #38
cobertos wrote: post #26

Earlier quoted context omitted.

Horizontal scrolling isn't that bad on mobile devices. I wouldn't want to scroll one of these on desktop but it's so simple to just, flick through it with my finger on a phone. Just put it behind a media query when your desktop-sized nav bar gets too big?

It can be OK in some cases, but it can be hard to discover unless it's very obvious. Thanks to Apple hiding scroll bars, if the elements in a horizontal scroll happen to line up with the edge of the screen it can be impossible to tell that horizontal scrolling is even an option unless you trigger it accidentally. Edit: Oh yeah, and horizontal scrolling interacts unpredicatably with horizontal gestures on mobile. E.g.…

Once I got confused on Google maps android, because I thought they had removed the "Share" button. It was a sausage menu, but the size of the buttons were such that the rest of the buttons were perfectly hidden (you could not see the rest of a half button) and of course there was no visible horizontal scrollbar.

Re: Using hamburger menus? Try sausage links (2019)

#95

Post by rustyminnow »

qwertox wrote: post #93
rustyminnow wrote: post #88

Earlier quoted context omitted.

I know this is besides your point, but in Firefox there is an option to turn the menu bar back on (at least until they remove the option :/). If you go to the "Customize Toolbar" page, on the bottom left where it says "Toolbars v" you can check "[ ] Menu Bar". Hope that helps (a little)!

Or right-click on any free space on the top row. There's an option in the menu.

Oh you are right! That's how I was getting to the Customize Toolbar page too haha. Totally missed that!

Re: Using hamburger menus? Try sausage links (2019)

#96

Post by jayd16 »

hn_throwaway_99 wrote: post #67
ilamont wrote: post #5

When designing medium to large sized menu navigations on the mobile web the default go-to, for some time now, has been hamburger menus. This isn’t necessarily a bad thing Tell it to the many people who have no idea what it means on a mobile device, or increasingly on desktop websites. I've said it many times before, but it's worth repeating: Most people are frustrated by modern information tools. According to a 2015…

> I like the sausage link concept because it clearly labels options with text. 100%. I'm kinda surprised how the 3 lines hamburger menu got so prevalent in the first place, because it always user tests poorly. My guess is that when flat minimalism (my favorite shitty example of this is when Android expected everyone to know what a flat square, circle and triangle are supposed to mean) was the rage, even though user t…

Designers like the hamburger because it lets them sweep anything they haven't considered under the rug. They're simple so no one attempts to cram in carousels or videos or what have you, so its the easiest way to add functionality into an app that doesn't have any other thought put into expanding the navigation. So in that sense they're highly productive.

Re: Using hamburger menus? Try sausage links (2019)

#97

Post by onion2k »

josho wrote: post #66
onion2k wrote: post #20

Clear menus that aren't hidden away are great, but a significant problem with horizontal 'sausage' menus is that it isn't obvious that you can scroll, especially on Apple devices that hide scrollbars. The article mentions this as a bit of an after-thought ("Without proper fade / cut off visual cues, users may not understand they can scroll") but it's the key reason why you should avoid them. To demonstrate, I've fork…

That's solved by adjusting the scroll starting position so that the first element is partially offscreen. It may initially look jarring, like the designer made a mistake but it provides a nice visual affordance that you can scroll and it will work regardless of the screen width. https://codepen.io/blipo/pen/Rwxrgpd

Now your menu requires JS though, which isn't ideal, especially on a brochure site that could work perfectly well without it.

Re: Using hamburger menus? Try sausage links (2019)

#98

Post by jonathanlydall »

kingnothing wrote: post #72
jonathanlydall wrote: post #14

Sometime back UberEats switched from a hamburger to a sausage menu for the restaurant’s menu categories and I really feel the experience is worse overall for it. While I suppose it’s now more obvious that the categories are there, it’s way less usable trying to scroll left and right to see them compared to before where you scrolled up and down the old vertical hamburger menu. On a related note, it’s incredible to me…

Uber A/B tests everything extensively before it gets rolled out to everyone. They would not have switched away from the hamburger menu unless it drove better metrics. I used to work there.

I suspect that it would have been better in A/B testing as a lot of people probably didn’t realise the hamburger menu would reveal the categories.

So it probably won due to discoverability rather than usability.

So on average more people now navigate the menu, but doing so is a less pleasant experience for those “in the know” before.

Re: Using hamburger menus? Try sausage links (2019)

#99

Post by jayd16 »

ridgered4 wrote: post #84
hn_throwaway_99 wrote: post #67

Earlier quoted context omitted.

> I like the sausage link concept because it clearly labels options with text. 100%. I'm kinda surprised how the 3 lines hamburger menu got so prevalent in the first place, because it always user tests poorly. My guess is that when flat minimalism (my favorite shitty example of this is when Android expected everyone to know what a flat square, circle and triangle are supposed to mean) was the rage, even though user t…

But seriously, what does the hamburger icon mean?

It's three lines. A minimalist list.

Re: Using hamburger menus? Try sausage links (2019)

#100

Post by JadedBlueEyes »

brimble wrote: post #48
ilamont wrote: post #5

When designing medium to large sized menu navigations on the mobile web the default go-to, for some time now, has been hamburger menus. This isn’t necessarily a bad thing Tell it to the many people who have no idea what it means on a mobile device, or increasingly on desktop websites. I've said it many times before, but it's worth repeating: Most people are frustrated by modern information tools. According to a 2015…

Firefox and Chrome have proven Apple right, in forcing a top-of-screen menu bar to appear whether the application wants it to or not. This was demonstrated to me recently when my parents couldn't figure out how to print on Windows in Firefox (because there's no standard menu on it—they know "file -> print" just fine) and called me for help. After a moment of confusion on my part as I remembered that FF doesn't have a…

On Windows, and most Linux apps, pressing Alt reveals a menu similar to MacOS's global menu. It's basically impossibe to discover, but it's there!
Post reply on HN