You need to give your users constant access to useful functions that need to be quickly accessible without scrolling. Think of it like the toolbar in Word or any other application for that matter.
Fixed toolbars contain functions which are:
– commonly used (share, add to wishlist)
– useful (search)
– or even promotional links (´Donate/join now´ or ‘give your feedback’)
– or branding fixed elements
Toolbar functions that need to be accessed at any time, with direct or indirect relation to the context on the page. The functions are accessible from a fixed position on the screen that holds its fixed position if the page is scrolled.
Anything could go on the toolbar. Icons (if conventional and understood by users), pulldown menus, links, textfields. It depends what the tools are. In CSS fixed elements are achieved by using position:fixed
– The toolbar could be present on almost all pages on your site, or only on pages where it makes sense with certain cha.
– Beware: They take up space, especially on low resolutions such as mobiles. More scrolling is needed to uncover the part of the page that it obscures.
– Keep it small. If it´s a horizontal toolbar, reduce the height. If it´s vertical, keep it narrow.
– Provide a ´close´ option if you think users will find it more annoying that useful. Consider how and when to show the toolbar again.
– Add tooltips or contextual help (on mouse-over show a hint) to facilitate learning, or help balloons to encourage use (see UXmatters example).
Tripadvisor.com – bottom toolbar
Cnet.com (browse the Reviews tab) – bottom toolbar
The http://www.conversion-rate-experts.com/buzz/ use a fixed side-bar :
uipatterns use a ‘you might like’ pop-over in the bottom-right corner. This could be useful for cross-sell, but it shouldn’t obscure other elements or it will have the adverse effect of annoying users.
http://www.uxcandy.net/frictionless-watching/ TED video docks on top when you scrol down TIP
From webdesignerdepot.com : “There are plenty of situations in which a fixed element (such as persistent navigation) could serve the owner’s business objectives and make the website more usable. Fixed elements are memorable and enhance the user experience. They have countless creative uses, and we will continue to see designers take advantage of them.”
For more examples, search google for ‘fixed position web design trends’
Nominated the best new UI element @ “Sticky” headers/sidebar content – critical elements stay fixed as you scroll down the page (the way the gMail header stays fixed as you scroll through an email, lots of “share” functionality on blogs/magazines stays with you as you scroll down the page). See also http://fab.com/inspiration/ main nav. The text formatting options in Quora and Basecamp Next stay with you as you write longer posts, like this one!