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.

Upon a recent update to my Nexus 4, a new feature is present in my browser, whereby when I scroll down, the address bar disappears and the webpage is full-screen, only when you scroll back up do you get the address bar and options back.

This is also present on the LinkedIn website when logged in, scrolling down makes the 'navbar' disappear, then scrolling back up a little makes it appear again.

What are the advantages and drawbacks of implementing a feature like this on a website?

A few that I can think of:

Pros:

  • More space for content

Cons:

  • Confuse users

  • Hard to implement consistently across devices

share|improve this question

closed as too broad by Koen Lageveen, ChrisF, Benny Skogberg, Matt Obee, 3nafish Sep 12 '13 at 1:16

There are either too many possible answers, or good answers would be too long for this format. Please add details to narrow the answer set or to isolate an issue that can be answered in a few paragraphs.If this question can be reworded to fit the rules in the help center, please edit the question.

    
Another con if implemented on a website itself is that sometimes this is browser supported and sometimes not (ios7 vs ios6). I can imagine a inconsistent or double implementation will be confusing to users. –  benvds Sep 8 '13 at 20:26
2  
A pro/con list is not a really great question for this site. As you've seen nobody actually answers your question. It's impossible to create a such a list about a generic design pattern because everything has a bunch of pros and cons while still being a great solution to some problem. It'd be more useful to get a list of common pit-falls. But either way it'll just be a discussion. –  Koen Lageveen Sep 9 '13 at 20:47

3 Answers 3

up vote 2 down vote accepted

I actually think this is a rather smart pattern.

Just to clarify on terminology (I'm using Twitter Bootstrap as a reference):

  • Static Menu - a menu that scrolls away with the rest of the view (ie, will not be visible after scrolling).
  • Fixed Menu - a menu that is constantly in the view, regardless of scroll.
  • Autoshow Fixed Menu - a menu that hides itself on scroll down, and shows itself on scroll up.

Now consider the case of a static menu: - As you scroll down it disappears. - You need to scroll all the way up to show it again. - Particularly annoying with mobile devices, where content is narrow and long.

In comparison, the Autoshow Fixed Menu saves the user the need to scroll all the way up (which could be quite a few hand gestures). The assumption is that the content is read top-to-bottom and menu interaction is needed after X amount of scrolls down.

As you mentioned, this allows more content to be seen on the screen, which is more important with mobile devices.

Now it's hard to find a serious flow in this behaviour, since users are accustomed to scrolling all the way up to see the menu. In addition, users should easily conclude that if the menu disappears on scroll down, it will show on scroll up (opposite action).

My point is that regardless of how you look at it, learning the behaviour of this pattern should be easy and instant.

This pattern is good when the template in question involves lengthy content, with scrolling being more frequent that menu interaction.

My assumption is that you are going to see more and more of this in content rich applications. One extreme example is Pinterest - as a content-centred application, many interaction controls are shown after an additional user action (click, for instance, will show various interaction options). Pinterest for mobile not only shows/hide the top menu, but also a bottom one.

share|improve this answer
    
'Autoshow Fixed Menu' is a far better name for it. –  user Sep 9 '13 at 18:02

I'd caution against comparing this feature in the browser and this feature on a website because people (usually) use the browser much more than any single website, so tend to learn and become comfortable with the new browser behavior more quickly than they would the behavior in a website. Another confusing factor is that different websites implement this behavior in different ways. Personally, almost always find this behavior distracting (in websites) - when scrolling and I see an unexpected change at the top it grabs my attention and start to investigate it, scroll back up, scroll back down to try to understand it, but that my be an occupation hazard of mine.

Also consider this behavior on a website displayed in a browser with this behavior - it could get confusing.

share|improve this answer

This feature of making the address bar disappear when you scroll down is a practice that I saw for first time in the Pinterest App, and recently in one of the last updates of Chrome (both iOS). In the case of a mobile device this makes a lot of sense because we have reduced space and this cleans the screen getting a "full screen" experience (in the case of Pinterest, the dock disappears as well).

In both cases, the user will scroll for a while either browsing in a Pinterest page or reading articles in the browser.

In desktop, the practice is a bit different since is not the browser the one who change but the page. Nowadays is common to see sites with a big header and big logo and when scroll it changes to lite version, which is quite handy and use more space of the screen.

In case of LinkedIn, I guess is something similar since the options in that menu bar are not really necessary for the browsing around the "timeline". In this case the menu appears when you scroll up or hover the fixed header.

But I would say that these kind of "sticky headers" are good for sites with a "long scroll" like Pinterest, LinkedIn, Facebook or Twitter. Hide/Show menus I would leave it for mobile devices.

share|improve this answer
    
That's a good conclusion, I'd agree that it's a good feature for long, narrow sites and conversely, not so good for a site with barely anything to scroll to. –  user Sep 9 '13 at 18:03

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