20.000 pixels below the fold

Daniel Dixon, Senior Developer

20.000 pixels below the fold

Do we scroll? How much do we scroll? Does a concept like the fold still apply? What to do and what not to do when important content has to live far down the page.

If like me you’ve been in the website-making industry for a few years, chances are you have come across someone mentioning “the fold”. They probably looked concerned about it.

This concept has been with us for a long time, but do the changing ways in which we are accessing web pages make it outdated?

Where did it come from?

We borrowed the term from traditional newspapers that needed to display the most interesting and eye catching titles in the top half of their front pages, with this being dictated by the way they were presented — folded.

When it comes to their digital transposition the concern is that the visitor would leave without exploring if they are not presented with all the important information “above the fold”, in the part of the page he sees first, without further interaction.

Accessing the same amount of content on a smaller screen clearly requires us to scroll more and as users we have had to adapt to that.

What has changed?

First of all, the devices: recently we moved from viewing pages on wide, mostly landscape monitors to browsing them on touch devices with small screens, most often portrait-oriented.

Even if we wanted to ignore the difference in viewport sizes across the multitude of devices available today (how big should this “above the fold” area be?), accessing the same amount of content on a smaller screen clearly requires us to scroll more and as users we have had to adapt to that.

The content changed as well: we spend most of our time online on social media and most social media platforms are story aggregators that span continuously on scroll, loading new content as we interact.

This makes them irresistible, we HAVE to scroll!

This pattern is so successful we’re now seeing it being adopted by many online magazines: they load a new article when you reach the bottom of the page, reading can easily get more addictive and thus there’s a higher chance for the product to generate revenue.

Since we scroll more, is it ok to ditch the concept of fold?

Not completely. 
As users we still pay more more attention to the part of the page that gets presented to us first. What has changed is that we’re more willing to scroll to reach what interests us.
And in the process of designing, building and populating our web pages we should aim at facilitating it.

So, on a visual level:

  • We should not give the idea that our page is ending right at the bottom of the window (“false bottom”), for instance by forcing big hero images to extend exactly as tall as the viewport. 
    If this is likely to happen we can provide visual cues inviting to scroll, e.g: down-facing chevrons, appropriate animated icons.
  • We want to provide as much real estate as possible for our content to be enjoyed. On small viewport sizes navigation tools are even more essential but they can be kept discreet: a fixed header/menu bar can be hidden while scrolling downwards and reappear on a change of scrolling direction.
  • We shouldn’t abuse the use of scroll-based effects like parallax or animations triggered on scroll, they are a powerful tool to enhance the experience but can also be distracting.
    They should also be very well timed: we shouldn’t make the user wait for content to animate-in just because they were scrolling quicker than we expected.
  • We should never try to hijack regular scrolling. Unless there’s a very good reason, the page should scroll in the direction the user is expecting it to.

And, with regards to the content, people will scroll and keep reading as long as it stays relevant and engaging:

  • Don’t let the idea of fold affect the content. Do not try to condense it to necessarily fit an unpredictable viewport size.
  • Do not hide important pieces of information several clicks away. Users are happy to scroll but get frustrated if they realise they spent time where it wasn’t needed, i.e.: the content was on another page.
  • Make long-form content less tedious by using appropriate headers and images, paragraphs and bullet points. By providing visually varied content we give the user some “anchor points” that can help during the visit and in follow-ups.
    If possible and where appropriate offer a progress indicator or a “jump to” menu.
  • Know your visitors and their habits: analytical tools can give you precious information like your visitors’ device screen size or where in your page they spend most of their time. A/B testing different versions of your pages with a real user pool can help you make them more successful.

As users we still pay more more attention to the part of the page that gets presented to us first.

There is life below the fold, users are willing to explore it as long as we make the experience enjoyable and keep our content relevant. If you are unsure of how to apply the fold in your next project, are looking for UX/UI support please reach out to us.

As your brand and technology partner, we’ll help you discover what’s possible.

We’ll make sure that the way we work is the right fit for your business, and we’ll ask the right questions to make sure you’re set up for success.

We can help build your brand through technology, email [email protected]

Share this

Comments are closed

TheTin uses cookies to give you the best possible experience on our website and to help us analyse our site traffic.
You can update your cookie settings and review our Cookie Policy at any time.