The 3 golden rules of sticky navigation

Opinions on sticky headers and sticky navigation are quite controversial. Some claim it drags a person’s attention away from what they’re reading. Others believe they’re essential to the structure and content of today’s websites. The truth, as in many optimization cases, lies somewhere in-between.

85% of people prefer sticky navigation

First off, a usability study by Smashing Magazine found that 85% of subjects preferred sticky navigation without knowing why. In addition:

– 22% of the participants found it easier to navigate around the website and individual pages.

– Sticky navigation saved the same viewers, on average, 36 seconds in finding what they were looking for.

Some encouraging data in favor of Sticky Navigation then. But can we add any further proof to our pudding?

Well actually, yes. Using the insights gleaned from our in-page digital customer experience software, the Customer Experience Consultants here at ClickTale are able to draw some unique conclusions about how people interact with and experience websites of all shapes and sizes. And for the question of Sticky Navigation, we’ve discovered 3 golden rules:

Rule 1: is my website actionable?

Sticky Navigation works well with retail websites
Sticky Navigation works better with retail and e-commerce websites

Sticky navigation is most suited to ‘actionable’ sites – sites where the designer intends a specific action – a click to purchase a product for example. For such websites, sticky navigation has been shown to improve the customer experience significantly.

In one example from a very well-known retail site (sorry – we can’t release the name), once the sticky navigation was implemented, visitors began to scroll further and pay more attention to the individual products on the pages. As a result, the company experienced a major reduction in page bounce and a conversion increased from 30% to 33%.

That may not sound like much, but it’s actually a 10% increase in conversion. And if you’re a leading retailer with annual revenues of, say $100 million, we can make a quick calculation to see how much that’s worth to your business:

  1. If we assume revenues from online are just 8% (as we mentioned in this blog post), then you currently have $8 million in direct website revenues.
  2. A 10% conversion increase on that figure gives you a further $800,000 in additional revenue – from just one small website change!
  3. If we then substitute our 8% for 53% which are the proportion of “web-influenced” sales in the US, then we actually have a much larger ROI (in the region of $5 million).


Rule 2: how long are my pages?

In long pages with lots of content, navigation must be friendly and intuitive. Clear and understandable in-page navigation helps visitors make a smooth journey through the content on the page. While in the past this was achieved by “back to top” links, today it’s sticky navigation that does the job.

In the below example, we see part of a long, content-heavy page from a travel website. The left hand Clicktale mouse-scroll heat map was generated before they implemented Sticky Navigation. Now, compare that to the right hand heatmap showing how much further people scroll down once the site implemented Sticky Navigation:

Rule 3: what’s my audience demographic?

Among other interactive navigation techniques, the effectiveness of the sticky element was found to improve the performance of older adults in basic selection tasks, and to provide similar benefits (although smaller) to young users (Worden, Walker, Bharat, & Hudson, 1997).

Why do older adults and much younger users respond better to Sticky Navigation? Because of the relatively lower confidence levels of older adults and much younger users on the web, and their subsequent need for additional support, which the Sticky Navigation fulfills.

Older adults and young users respond to the confidence that sticky navigation instills

Here’s a deeper explanation why:

The psychology behind sticky navigation

At the psychological level, sticky elements increase visitors’ confidence as they scroll up and down the page, giving them a sense of control while interacting with the site.

People need to be in control. Imagine a situation where you are unaware of what is happening around you. Very quickly, the “stress” button is switched on and you try to do everything you can to regain control. You can achieve this by ‘sticking to’ something familiar, adopting an old pattern of behavior, or relying on someone you trust.

The same logic can be applied to web navigation and digital experience. Visitors can feel lost trying to find their way through very long webpages. In most cases, this feeling will trigger stress that will cause them to leave the site. This is exactly the purpose of sticky navigation: to help people explore a webpage without sensing that they’re losing control.

The need to control our environment

Businessman Speaking On Mobile Phone By Noisy Freeway

Even where participants are told they can press a button to stop the noise they didn’t – negatively affecting their ability to problem solve

In a study in which two groups of participants were exposed to a loud, extremely unpleasant noise, participants in group A were told they could stop the noise by pressing a button, but were urged not to do so unless absolutely necessary.

Participants in group B had no control over the noise.

The results were eye-opening: None of the participants who had a control button actually pressed it. But performance on subsequent problem-solving tasks was significantly worse in group B – in those that had no control (Glass & Singer, 1972).

Translated into the web optimization world; even if people do not take advantage of sticky navigation, just knowing that it is there will improve the digital customer experience, even if the feeling remains at a subconscious level.

Book a demo to see how customer experience management can improve your business