Take the 2-minute tour ×
User Experience Stack Exchange is a question and answer site for user experience researchers and experts. It's 100% free, no registration required.

As an amateur web designer I've been paying close attention to websites' designs to improve my grasp on this field, I noticed that some websites are using sticky navigation bars while others are using non-sticky ones (such as SE). So, I've been wondering, why are they choosing one option instead of another?

What are the basis of choosing a sticky navigation bar anyway? Is it the page's length(longer pages need a "return point")? Or perhaps it's based on application's type (web apps need sticky navbars to look more app-y)? Or maybe it's just designer's personal preference?

P.S.: I've seen websites using both sticky navbars and non-sticky ones, such as SE chain and Twitter.com, and indeed both of them are well-made. So I really don't think there's a bad design choice here.

share|improve this question
    
As a user, I'm not a fan. I don't like the idea of parts of the web page "following" me around. At most I'll tolerate a "back to top" button and even then I can always just press Home on the keyboard. Maybe I'm in the minority, maybe not. –  Brian Ortiz Aug 27 '13 at 22:15

3 Answers 3

A sticky bar has the advantage of always being visible. It has the disadvantage of always taking up part of the viewport and leaving less area for the content. This isn't much of an issue on a large desktop screen, but on a smaller phone screen can be problematic.

Another disadvantage of a sticky bar on the top is that when one pages down, the reduced effective viewport is not accounted for so it effectively scrolls a little too much, more than a visible page's worth - there's a sliver of content jumps from just below the viewport bottom to just above the (reduced) viewport top. This is problem exacerbated by a large sticky header. You probably notice most sites that have a sticky header have a small one, and this presents it's own design constraints that aren't acceptable in many cases.

There's always tradeoffs.

share|improve this answer

The decision to use sticky navigation should be based on the primary activities of the user. If the user is likely to use the navigation quite a bit then it may make sense to accept some of the tradeoffs mentioned by @obelia.

With SE, for instance, the primary activity might be to read and respond to questions. Most of that happens within the context of a scrolling page. That is: read question, read comments/answers, add comment or answer. A case could be made to have a link to the homepage (to see additional questions), search (to find answers), and Ask Question, as these may also be primary activities. Whereas, I would suggest, the other options in the header are may not be primary activities.

share|improve this answer

Frankly, I think the question you should be asking is when NOT to use a sticky nav bar.

As long as the site or app you're working on has multiple sections that users frequently navigate between--even single page web sites often do--providing users with persistent shortcuts is definitely good for usability.

Yes, this even and especially applies to mobile devices, where it's easy to become disoriented on long-scrolling pages or in content-rich apps.

Consider, for instance, that the android phone I'm using to write this post has a sticky nav built in to the OS. My old phone had one built into the hardware, and the prominent design feature of the face of the iPhone is its home button--the number one navigation destination for users.

As a user, I'll take the screen space hit all day to have those most common nav buttons close at hand.

share|improve this answer

Your Answer

 
discard

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.