User Experience Stack Exchange is a question and answer site for user experience researchers and experts. Join them; it only takes a minute:

Sign up
Here's how it works:
  1. Anybody can ask a question
  2. Anybody can answer
  3. The best answers are voted up and rise to the top

I'm working on a responsive site where the main navigation gets compressed to a "menu" button when at a mobile small-screen size. I feel like there are 2 strong methods for handling the navigation:

  1. Off-canvas -- menu pushes the page content to the right so that only a small portion is showing. Many apps (like Facebook) use this technique, as does Indochino (

  2. Dropdown -- menu comes down vertically (sometimes pushes page content down, sometimes covers page content). This seems slightly more common than off-canvas -- an example is Nokia (

I'm struggling to see a major usability difference between the two options, as it seems like it comes down to personal preference. Is there any research specifically comparing the two? Are there particular contexts where one may be stronger than the other?

share|improve this question
I think you are right; it will probably be personal preference, as the methods are very similar to each other. I prefer the Off-canvas method, as it does not blend in with the vertical content, and many users have familiarity with the method Facebook uses. – Keiwes Jul 15 '13 at 16:40

My two cents:

An off-canvas design works very well with a mobile app, as you can hook into native swipe gestures like Facebook does to deliver the most beautiful and usable design possible.

A dropdown, like with Bootstrap, works well for a mobile website, as you can simply tap and an animation will run, as opposed to an off-canvas, in which you should probably code a swipe gesture for usability. A dropdown would be your way to go.

share|improve this answer
An interesting way to distinguish -- but I also like Keiwes's point about off-canvas navigation not blending in with the vertical content. I also was under the impression that many mobile browsers do support swiping, so it may just be a matter of a little extra coding to recognize gestures. – Michael Histen Jul 15 '13 at 20:14
They do, it's just that it would be vastly inferior to a native swipe method. – Witch-King Jul 15 '13 at 20:18

Your Answer


By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.