Above or Below the Fold: The Great Debate!

Posted on May 04, 2016 by Cale Benner

“The Fold”

Definition: A theoretical horizontal line, below which the content of a web page is not visible without scrolling.

This debate is almost as old as the internet. Mobile devices and responsive design have given more life to the argument because of the various display sizes, making the exact position of the fold different between devices and resolutions.

Background

Above the fold is a term that has been around long before the internet. The term actually comes from the newspaper industry in which they are referring to the literal fold in the middle of the page. To find the first folded newspaper, you need to go all the way back to 16th century Venice [1]. The thought process was that the content ‘above the fold’ should be the most eye-catching and important  in order to increase sales of newspapers that were stacked for display.

People don’t scroll

Nielsen Norman Group has conducted a number studies over the years about ‘the fold’ [2]. Early on, users had grown accustomed to scrolling and were actually doing so. As the internet evolved, later studies showed that people began to reduce their scrolling, unless there was meaningful action required. In 2015 Jakob Nielsen stated “What appears at the top of the page vs. what’s hidden will always influence the user experience — regardless of screen size. The average difference in how users treat info above vs. below the fold is 84%" [3]. 

In the diagram below you can see the outcome of some of the research conducted showing that a small percentage (5%) were scrolling below the 2,000 pixel mark. In other words 80.3% of the users stayed above the fold while 19.7% were willing to travel below. 

Additionally, below is an aggregated heat map from the Nielsen group that shows over 57,000 eye-tracking fixation across a wide range of pages (excluding search and search-results pages). Red indicates where users looked the most; yellow where they looked less. White areas got virtually no looks. The top black stripe indicates the page fold in the study; subsequent black stripes represent each additional screen after scrolling.

In the same 2015 study Jakob Nielsen acknowledged that users do read down the entire page although “rarely.” The thought is the user “has” to do this to get to the most relevant and important content such as Frequently Asked Questions (FAQ’S) and Customer Reviews. See the gaze points below:

Neilson Norman Group, UXmag, and countless others stand by these findings and say the fold “does exist” and applies to all device dimensions. Therefore, use “above the fold” real estate very wisely. 

Below the fold

Although the data above seems to favor that the fold exists Luke Wroblewski, UXMyths, and more think these arguments just don’t fly.

Before we get in to why this group feels this way, let’s try an experiment. Please visit the following website.  I’ll wait here while you do that.

Welcome back, so what happened? Did you scroll? You did, didn’t you? Interesting….

With enticing content, it seems that we are willing to scroll for as long as it takes. With the introduction of mobile devices this has thrown yet another wrench into the fold argument.

You need to follow certain design principles and provide engaging and relevant content to your users to ensure they scroll. After all if you’re not interested, what’s the point?

The scroll depth/engagement can vary widely depending on how the elements are positioned on the page. Chartbeat conducted a study in 2013 that gathered random samplings from 25 million user sessions across a wide sample of websites. What they found was that under 70% of the visitors saw the very top of the page they were viewing. However, because many content pages have content that exists further down the page, they found that people are more likely to scroll down faster and stay down longer. Essentially 66% of attention on a normal page is spent above the fold.

According to Luke Wroblewski, if you’re assuming the best way to drive conversion is to put big "call to action" buttons above the fold, you’re missing out on the more important point of placing actions where people become convinced to act (this is key). 

Based on this statement, the assumption can be made that the main issue here is not whether your call to action is visible but whether your call to action is visible at the point where someone has become convinced to take action.

Below is a test Luke conducted showing conversions are still possible regardless of the page length.

Conclusion

With today’s landscape of possible devices sizes and resolutions, it makes it incredibly hard to argue where exactly the fold exists.  I believe that users don’t just scroll for fun but they scroll for purpose. Testing your own designs and sites with users is crucial, whether it’s A/B testing, usability testing, or some other form of testing. Also, spend time reviewing your sites analytics (for usage and pattern) and set goals to measure the success level.

The use of responsive and adaptive techniques are a must in the creation of websites and applications today to help support the many varying browsers and devices. 

The web is an ever evolving world, so keep an eye on this new trend in 2016 “Long Scrolling” which could be the end of the argument once and for all. 

 

[1] https://en.wikipedia.org/wiki/History_of_newspaper_publishing#16th_century_to_1800
[2] Nielsen Norman Group Studies - 1997, 2006, 2010, and 2015
[3] https://www.nngroup.com/articles/page-fold-manifesto/