Menu/burger menu bottom or top on mobile?

Question

Is there any reason why websites don't place the burger menu at the bottom instead of the top? It's far easier to resch with your thumb if it's at the bottom, why isn't it done more?

Answer 1

It makes more sense for ease-of-reach on a phone, yes, but issues around scrolling, brand/company placement and list order make it less desirable than upper left.

1. Distracting and in the line of site of content. A fixed UI footer with a hamburger menu in the bottom left corner is incredibly distracting, because it interferes with where our eyes focus when scrolling. Imagine reading an article. Scrolling is all most of us do on the web, and putting it on the bottom means it becomes a visual you can't ignore, unlike the top of the screen.

2. Where do you put your website name? Well, I guess you'd put it in the fixed footer where the hamburger is, but then you're distracting the user as they scroll. Alternatively, you could put it at the top, well now you've got two fixed elements taking up valuable screen real-estate. What if you make the website name a non-fixed element? Not viable either. Most sites/brands want their name always visible.

3. List order goofiness. Once you open the hamburger, should the contents be listed bottom-up or top to bottom? This is minor but, makes users go hmmm. (BTW, from user studies...you should always list top to bottom).

4. Not a frequent action. The #1 interaction in a web browser is clicking on links visible on the page followed by the use of the back button. (So actually, a back button in the upper left-hand corner in web browsers is just mean :)...notice that Safari puts it on the bottom and browser on Android and Windows Phone depend on the hardware back buttons!) Navigating between places on a website that would require hamburger usage is less common than you might think. I think in order to be a viable solution, easier access based on physical effort would have to outweigh the downsides with more frequent actions, like scrolling mentioned above.

Answer 2

Putting the icon on the bottom of the screen could get in the way of the browser's UI. As Paula said, it risks getting in the way of scrolling behavior, especially if you want to explore a fixed header with the nav menu icon.

Something to keep in mind with the hamburger icon is that not all users know what it is for. I've seen "Menu" with the hamburger icon for some websites and apps that may be targeting an audience that hasn't learned the icon means menu.