Sticky Menus Are Quicker To Navigate

Hyrum Denney for Smashing Magazine:

Participants were then asked whether one of the websites felt easier to use. Six of the 40 participants had no preference, but of the 34 that did have a preference, 100% of them indicated that the website with the sticky navigation was easier or faster to use.

As we redesigned the header of QUOTE.fm we also tried sticking it to the top so that you always have access to the menu and your notifications. We felt that it’s really good to use and doesn’t distract too much and also doesn’t take away too much screen space even on a 11″ MacBook Air. It also works great on the iPad and especially on the iPhone it’s very handy. Seems like we made the right call on this one.

position: sticky lands in WebKit

Eric Bidelman for HTML5Rocks:

position: sticky is a new way to position elements and is conceptually similar to position: fixed. The difference is that an element with position: sticky behaves like position: relative within its parent, until a given offset threshold is met in the viewport.

I’d love to see this implemented in every browser and without vendor prefixes as soon as possible with a real spec. At the moment it just works in Chrome 23.0.1247.0+ and WebKit nightly.
I had to build the same behavior with JS for the QUOTE.fm Labs and CSS would make it much easier and faster.