13 ms·
Using a footer as a replacement for a nav bar is ridiculous. Which requires more interaction? Clicking a button to see available actions or scrolling all the wa
by dinkleberg 3y ago
Using a footer as a replacement for a nav bar is ridiculous. Which requires more interaction? Clicking a button to see available actions or scrolling all the way to the bottom of the page (and making the bold assumption that you happen to know that the menu is at the bottom)?
If you’ve got sufficient space at the top of your page to show your nav items, especially for larger window sizes, just show them instead of hiding them away behind a menu. But if you have limited space, like on mobile, a hamburger menu is a fine solution.
- scotty79 3y agoYou could always put a link at the top that will scroll you down to the footer menu. If you do it the simplest way possible the back button will bring you back to where you were if you change your mind.
- tobr 3y agoIt’s not ridiculous. Look at how it’s done on the page itself: a link to the footer in the header. I’d argue that the word “sitemap” isn’t a great choice for the link text, but the interaction itself works ok.
- waboremo 3y agoIf we're using this page as an example, they could have fit the entire navigation menu at the top of the page just fine. If it's pointless even at this small scale, what good is this going to do implementing on larger platforms like Amazon? I agree with the "stop resorting to hamburger menus so fast" take however.
- Kwpolska 3y agoExactly. The links fit very nicely at the top, and with just four CSS rules, I got this: https://i.imgur.com/7VH4UJ6.png https://i.imgur.com/7VH4UJ6.png
- rerdavies 3y agoOn mobile layouts, you've collapsed every single entry on the footer to a single "..." menu. How is this better?
- Kwpolska 3y agoHave I? Nine links fit nicely over two lines: https://i.imgur.com/OeNd5WA.png https://i.imgur.com/OeNd5WA.png
- vxNsr 3y agoThat looks great on desktop, how would you make it responsive?
- Kwpolska 3y agoIncrease the margin/padding for finger-friendliness and just have two rows of links? https://i.imgur.com/OeNd5WA.png https://i.imgur.com/OeNd5WA.png (I reordered the links to make them fit better; this could be made prettier with fancier rules than `display:inline-block;margin:0.75rem`.)
- permo-w 3y agoAmazon already does this but without the link
- crimsontech 3y agoI just assumed it would take me to a sitemap so I didn’t click it.
- eweise 3y agoI agree. Part of what sucks about websites is that everyone is trying to things differently. When I see a hamburger menu, I know what it does. It would take me a long while to figure out your site's navigation sits at the bottom of the page.
- scotty79 3y ago> When I see a hamburger menu, I know what it does. It contains some mystery meat, that's for sure.
- irthomasthomas 3y agoWhen you look at a website with a burger menu, you know what the burger menu does. When you look at a website without a burger menu, you know what the website does.
- muxator 3y agoThis depends on when you started using the web. 15 years ago an (additional) navigation bar at the bottom was not surprising. Hamburgher menus, albeit fancy, where really confusing at the start. Personally I still think overusing them is design laziness.
- eweise 3y agoHave to agree to disagree then. You're design laziness is my "grateful for consistency so I don't have to learn your navigation"
- irthomasthomas 3y agoHow does hiding a menu behind a very small button consisting of 3 vertical lines make website navigation easier? The authors webpage is functionally similar except the menu is labeled "sitemap" and it's text is always visible to screen readers.
- Spivak 3y ago> Which requires more interaction? Clicking a button to see available actions or scrolling all the way to the bottom of the page I mean honestly clicking the sitemap button on the OP is faster than than any SPA opening a menu. Your average site already has a bunch of links in the footer, if the argument is that footers are useless and should be eliminated then sure. But otherwise embracing their existing purpose is a good thing.
- bmelton 3y agoTo be fair, the only reason they exist in otherwise minimalist apps is because they need to be there for crawlability. A hamburger menu that isn't visible until someone clicks on it is an SEO problem that is (sadly) easily mitigated with a footer, which has bled into the problem of the big footer, wherein people hamfistedly use the footer to solve the entirety of their crosslinking strategies, which (at least for me, but maybe I'm the weirdo) makes it impossible to scroll to the bottom of the page to get to the meat of it without having to usually scroll almost all the way back up.
- cleansingfire 3y agoAssuming the bottom is even accesible! I believe it's somewhere in the Amazon ios app where I see a promise of a useful footer that is always pushed off the page by infinitely scrolling things they're pushing at me instead.
- wlonkly 3y agoEndless scroll with a footer is one of my favorite facepalm things.
- medstrom 3y agoProtip: navigate to a different page, not a listing of products, then you may be able to scroll to the footer.
- function_seven 3y agoMy favorite thing is when a website or app places a bunch of icons at the extreme bottom edge, and my tap there is confused by iOS as me interacting with the app switcher bar. That's always fun.
- throwaheyy 3y agoThis is very annoying. In Safari, clicking icons in that style of nav bar instead brings up the browser’s back/forward buttons, and requires a 2nd click in a new location now that the nav bar has been offset by the height of the back/forward buttons.
- spacedcowboy 3y agoAh, so that's what a "hamburger menu" is. I think anyone doing "Down with X" ought to define X... And I think I like them, anyway :)
- wlonkly 3y agoAllow me to also introduce you to the kebab, doner, and bento menus.
- HankB99 3y agoI came here looking for food. :-/
- fuzzfactor 3y agoLike most people, you probably want more than just a hamburger on the menu.
- bombcar 3y agoYou’ve not seen a hamburger menu until you’ve tried to order at Five Guys. It’s like the opposite of In-n-out where nothing is listed on the menu ;)
- vmilner 3y agoI noticed today that in the Uk a cheeseburger at Five Guys (nothing else) costs roughly the same as working for an hour as standard crew at Five Guys.
- bombcar 3y agoFive Guys is by far the most expensive of the "fast food" burger places anywhere near me, even beating out Smashburger sometimes. And the burgers are good, but they're not "more expensive than the local roadhouse" good.
- bwb 3y agoYa I don't understand that comment, no users go down there when you actually test. It isn't a bad secondary navigation, but kinda odd to say.
- erickhill 3y agoAgreed. Where I work, less than 10% of users even seen the footer regardless of the pages they visit.
- tomkarho 3y agoI see footers working as a usable nav bar only if the number of navigation elements is small enough and the footer is sticky (always visible and at the bottom).
- misterprime 3y agoInteresting. I was thinking the header which contains a link to the footer could be sticky. That way, it wouldn't matter how large the footer became.
- sametmax 3y agoI assume they mean a sticly footer.
- pseudosavant 3y agoI wonder about using this with a hamburger menu as a form of progressive enhancement? You would still use a hamburger menu that requires CSS and/or JS (it can be done in just CSS). You'd have that same content in the footer of the page. For the JS disabled people, you'd have a `<noscrip><a href="#footerburger"></noscript>` at the top of the page where the hamburger would be. So if a user clicks on it, it will jump to the footer that contains the exact same content as the hamburger.
- rerdavies 3y agoWhat exactly is this constituency of jscript-disabled people? It sounds a bit nuts to me. I can't imagine why I should be catering to them. Asking because I sincerely don't know.
- scotty79 3y agoWell, there are people who disable js to avoid such things as hamburger menus and other js bells and whistles. I had nojs button for a time in case of the pages that are unreadable due to all js and adverisement.
- irthomasthomas 3y agoPeople with impaired vision that rely on screen readers. They may not always have JavaScript disabled, but it's the same effect. They can't hear the navigation options.
- rerdavies 3y agoIs there not some way to annotate menus for people with impaired vision? That seems extraordinarily dysfunctional.
- misterprime 3y agoYou're misrepresenting the recommendation. You did not include the instructions "link directly to [the footer navigation options] from your header" or "Be sure to also include some form of "Top of the page" link for quick access back to the initial scroll view."
- bodge5000 3y agoWhy put a link to the footer in the header which contains links to other pages when you can just put your links directly in the header? I know the reason why, because it makes the page cluttered, whereas having it at the footer does a better job of hiding it. But isn't that the exact problem that the hamburger menu was made to fix?
- misterprime 3y agoThat question is addressed in the article as well: "The biggest headache when coming across these menus on the web is the complete disregard for accessibility." And by "accessibility" I'm quite certain the author means "usability for people with impairments that don't allow them to use a mouse and keyboard or touch screen".
- PhasmaFelis 3y agoYes, and this fixes it better than the hamburger menu does. Read the article.
- bodge5000 3y agoI did read the article, don't make assumptions. The article discusses the problems of a hamburger menu but doesn't address why its used, and then goes on to suggest a solution which does a worse job of what the hamburger menu is actually designed for.
- PhasmaFelis 3y ago> I did read the article, don't make assumptions. You asked "Why put a link to the footer in the header which contains links to other pages when you can just put your links directly in the header?" The article answers this question, quite clearly and in detail.
- deleted 3y ago[deleted]
- PhasmaFelis 3y ago> Using a footer as a replacement for a nav bar is ridiculous. Which requires more interaction? Clicking a button to see available actions or scrolling all the way to the bottom of the page (and making the bold assumption that you happen to know that the menu is at the bottom)? Why are you (and most of the commenters!) ignoring "...and link directly to them [the footer links] from your header"? You're arguing against a claim nobody made. In this scheme, you still click a button right up at the top to see a menu; it's just that the menu is at the bottom of the page instead of in a pop-out, avoiding all the listed problems with JavaScript, screen readers, keyboard navigation, etc.
- Nathanael_M 3y agoThere are scads of articles like this, either from the accessibility > all or the page size > all tribes, that obnoxiously "solve" problems by sticking their fingers in their ears and ignoring all objections. Throw in a snarky tone and sanctimonious justifications and bam: you got a black text white background web dev blog. Sorry, but for 99% of websites, businesses, and individual browsers, the harm of moving all your navigation a flat hierarchy in your footer VASTLY outweighs the harm of a hamburger menu.