11

I have just started taking UX classes and am designing my first e-commerce webpage. I was wondering what type of navigation works better for users? Do users prefer eBay's vertical navigation http://www.ebay.com/fashion/womens-clothing compared to FarFetch's horizontal navigation http://www.farfetch.com/ ?

Under what circumstances does one of the two work better?

5
  • 3
    Please provide much more information about your situation. Jul 19, 2012 at 0:04
  • 1
    It will depend on the content for the rest of the page. One popular style is to have the main navigation as horizontal, and then use vertical "navigation" on the left side of the page in order to further filter down content. But as @Fresheyeball said we need a lot more information to make an educated judgement on this.
    – rsparis
    Jul 19, 2012 at 4:24
  • @rsparis Thanks for the comment. That is what I was researching on. What kind of information is required to make a judgement on the type of navigation. I am designing an e-commerce fashion website. I do have the main navigation horizontally on top. I was wondering whether the filter navigation can be placed horizontally too like in Zappos instead of placing it vertically on the left. Jul 19, 2012 at 6:20
  • Anything is possible it really just depends on the rest of the site. And I know the "it depends" answer doesn't really help in this case but if possible you should also consider the hardware people will be using to view your site, will they be using a tablet where screen realestate is at a premium? Will many users have widescreen monitors which means the site has plenty of horizontal space to use but not much vertical space? How do you want to prioritise the information to assist users in reading it in the correct order? Visual weighting plays just as much of a role as placement on the page.
    – rsparis
    Jul 19, 2012 at 7:08
  • You mean navigation bars, right?
    – Ben Brocka
    Jul 21, 2012 at 18:38

2 Answers 2

12

Compared to horizontal top-of-page menus, vertical left-side navigation has been found to yield faster navigation and greater user satisfaction. This may be simply due to vertical navigation bars being so common that users are used to them, but it may also be due to it being easier to scan down a menu than across. Interestingly, it appears you can combine a left-side vertical main menu and at-the-top horizontal submenus and get acceptable performance for multi-level menus. This is an attractive option if you can’t use flyouts and don’t want to squish content to the right to make room for a large wide vertical menu.

In contrast, another study found that users looked at horizontal top menu bars more than vertical left menu bars, leading the author to conclude that horizontal menus “performed best.” However, this may be an illustration of the dangers in interpreting eye-tracking data: just because users look toward something more, doesn’t mean it’s good. It could mean it’s hard to read. It could mean it’s a distraction. In this case, users’ primary task was apparently to consume the content on the page, rather than find content that’s somewhere else. If that’s true, you don’t want people looking at the navigation bar. High gaze time there means it’s distracting the users from their task.

This implies that one additional advantage of vertical menus is that they’re easy to ignore when users are not using them in addition to being easy to find and use when they do.

0
3

I am not a UI expert by any means, learning some UX tricks by hanging out here, here is what I found:

  1. Recommended: In website navigation, what are the pros and cons of horizontal menus vs vertical menus, and is one better than the other?

  2. The Case Against Vertical Navigation

  3. Vertical vs Horizontal Global Navigation (any usability studies?)

But I would love to know what other think about this.

2
  • 1
    Thanks for sharing the links. I think the listing of pros and cons of both the navigation types was very helpful. With a vertical navigation, I specially like the use of standard, tree and group listings along with fly-outs. On the other hand does it not interfere with page's content beside it like the use of sub menus in horizontal navigation does (cons of horizontal navigation). Curious to know what do others think about it. Jul 19, 2012 at 6:49
  • Hi zengr, thanks for the links. It'd be helpful if you also summarize the contents of links and bring in your own insights and expertise, so that we can keep expanding the sphere of knowledge. Jul 19, 2012 at 14:25

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

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