14

Left navigation is becoming a more widely used trend in Web Applications; for example, it is utilized by Zoho Books, Slack, Gmail and others.

More valid reason to move Left navigation, like screen resolutions sizes are increasing gradually, also to utilise more vertical space, as well as it looks like Desktop software too....

My point, why don't we use Left navigation like in web applications. Both are similar use cases, right?

Already we are using LEFT navigation for API documents, Help Documents & Knowledge base screens.

Advantages to move LHS navigation:

  • We will get more vertical space for main content
  • If already our web applications moved to Left navigation, it will be more useful for web sites. So that both looks similar

How to solve various resolutions using responsive design?

  • LHS can be opened by default for Above 1280 resolutions
  • LHS can be positioned at the top [or] closed by default for 1024-1280
  • LHS options can be moved under "MENU" tab at the top like mobile website for below 1024 resolutions

Yes, some of the website using LHS navigation, but they are using "hamburger menu" to open LHS part. Why don't we show upfront LHS navigation by default. Yes visually main content should be more focused.

What is your suggestion. Is there any particular reason to avoid LHS navigation?

enter image description here

Improve this question
3
  • 2
    Who is 'we' in this question? I'm a little confused. As an industry, left navigation is still used quite a bit.
    – DA01
    Jun 16, 2015 at 0:49
  • 1
    like @DA01, I have no idea who are you talking about, and as it is written, this question should be closed since it relates to an specific unknown case
    – Devin
    Jul 14, 2015 at 19:50
  • What goes around comes around...websites in the late 90's were all left hand nav. Here's an example: web.archive.org/web/20000414042632/http://…
    – Jeff
    Aug 4, 2015 at 15:58

7 Answers 7

Reset to default
8

I think your question is why you don't see left-hand navigation by default any more. I'd say this mainly a trend--perhaps a good one.

There are many trends these days and two of them are a) hamburger menus and b) single column page layouts.

This article isn't in-depth, but one of many you can find out there that talk a bit more about this: http://www.weebly.com/blog/web-design-trends

The goal of both of these trends is to put all the user focus on the task-and-hand. One column of content to focus on, no menu to distract.

This, obviously, isn't necessarily the best solution for everyone, but there's a lot of times this does make a lot of sense vs. past ways of how we did things with side-bars and top+left nav, etc.

Improve this answer
3

The answer to this question is simple, and is the answer for pretty much any "why don't we do it this way" question: You should do what makes sense for your users to digest your content in the most effective way.

This may mean a left-hand nav for your app, but a one-size-fits-all model will not be effective for all users across all applications.

Your best bet is to watch your users in their "natural habitat" to see what actually does work for them and what doesn't. Then you take those observations, make a prototype of your app, and see if it works. If it is left-hand nav, great! But you shouldn't discount something NOT left-hand just because it doesn't make sense to you.

Improve this answer
2

Many modern website designs that eschew vertical left navigation menus use one or more of the following instead:

  • Hidden hamburger menus
  • Simple horizontal navigation at the top of the page
  • Long single-column content
  • Targeted call-to-action buttons

Those design decisions help maintain focus on the content and allow each page to deliver information with a crafted narrative.

Today, many product and service sites employ these techniques to maximize user conversions. They view their website as the sales pitch before a buying decision, rather than pages of information. The first and second pages of a website may be the last a user sees before making a related purchase.

Sites focused on doing don't need to tell a story, and although the content is important, productivity is more important. Thus, they employ persistent navigation elements to reduce the number of clicks required to get where you need to go.

Improve this answer
1

Here are a few reasons why people prefer top navigation.

  1. Users consume website content in F pattern

    http://www.nngroup.com/articles/f-shaped-pattern-reading-web-content/

    This suggests both the left and top real estate grab equal attention. So, top navigation is another choice that can be used unless the number of menu items are not too many.

  2. Content positioning to grab user attention

    The trend now is to use large images and content that take up the entire browser width. The rise in internet speed makes it possible to download high res images and videos online. Making use of the entire browser width helps grab user attention. This way of story telling works for single page websites and sites that have a fewer menu items. Vertical nav bar takes its own space. Horizontal menu with a fewer items works best here.

  3. Localization

    Top nav suits well for most languages. In a few cases, Left nav has to be shifted to the right for Arabic. In scenarios like this, top nav makes life easier.

Refer this article for more http://www.smashingmagazine.com/2010/01/11/the-case-against-vertical-navigation/

Though I don't agree to a few points in the smashing magazine article above, I would say it has good points on vertical Vs horizontal menu. This article has a link to a study that suggests left nav is mostly ignored.

In a study called Eyetrack III: What We Saw When We Looked Through Their Eyes, results showed that top navigation performed better than left-side navigation. Interestingly, according to the results, even right-side navigation had better success than left navigation.

I would say the menu choice depends on the content and context. This link below provides guidelines on which menu to use based on context

http://www.usefulusability.com/main-navigation-types-and-usability-pt-1-horizontal-navigation/

Quoting a few lines from your question

1

If already our web applications moved to Left navigation, it will be more useful for web sites. So that both looks similar

2

LHS can be opened by default for Above 1280 resolutions

LHS can be positioned at the top [or] closed by default for 1024-1280

Well, I guess the above statements are contradicting. Anyways, this might work for a long menu. But, when a menu has a fewer items, and if you want consistency across all screen sizes, it is good to go for a horizontal menu.

Improve this answer
0

Screen sizes on desktops might be getting bigger, but more than 50% of web usage is now through smart phones where real estate is at a premium.

2-column designs are impractical for phones, and people may want a consistent experience across multiple devices/screens (or as consistent as it can be)

Improve this answer
1
  • Yes, definitely, 2-column layout will fit in to mobile screens. That's why I have mentioned about "MENU" option for below 1024 or mobile screen use case.
    – jelumalai
    Jun 16, 2015 at 7:18
0

"If already our web applications moved to Left navigation, it will be more useful for web sites. So that both looks similar" - I think you have it utterly wrong here. Sparing left navigation does spare space on the very limited real estate of a mobile device. There's no problem with real estate on a 16:9 desktop screen.

Just on the contrary, by moving navigation on top, you bring the chance of moving content below the fold, given you have more width than height.

But what is more important, I claim, is that left navigation is just perfect in terms of usability. With mobile devices it's a compromise we have to make, not a usability improvement. My rationale is here: https://psychology.stackexchange.com/questions/2056/any-research-on-right-hand-left-hand-based-preferences-when-interacting-with-an

Improve this answer
-1

I would suggest that horizontal text is more readable than text on separate lines. 

Read | This Sentence | Now | Please

vs.

Now
Please Read
This
Sentence

My eyes would rather move in a straight line than zig-zag.

Improve this answer
5
  • 12
    Navigation isn't the same thing as paragraph text though, so isn't supposed to be read in the same way. Users hunt for a particular item that they are looking for, rather than reading the whole thing. I would say that it's easier to quickly find 'Sentence' in your second example than in the first.
    – JonW ♦
    Jun 14, 2015 at 10:49
  • @JonW, Yes you are correct. Vertical readability better than horizontal one. In this case we can use icon with labels.
    – jelumalai
    Jun 14, 2015 at 13:54
  • Icons will do nothing to improve readability. With a few exceptions, icons mean different things to different people.
    – Sean Ryan
    Jul 6, 2015 at 17:11
  • As in forms vertical alignment is easy to find rather than one line menu.
    – Abektes
    Jul 14, 2015 at 21:20
  • This example has different verbiage in the horizontal and vertical examples, so the ability to compare becomes disconnected. Also, I think this all depends on context. Second tier navigation could make perfect sense displayed vertically on interior pages, but having vertical navigation for the top level navigation might not make sense. A lot of content written about this topic horizontal nav vs. left nav vs. right nav, etc, fails to clarify the context and so the discussion becomes ambiguous.
    – Dmacatude
    Oct 6, 2015 at 13:33

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.