Web Design - Above The Fold or Scroll?

Posted on: 6th May 2016

If there's one thing us web designers can all agree on it's that the web design industry doesn't stand still for too long. Trends come and go and what was once the next big thing is often outdated a year or two later. However, one trend which was adopted in the early days of the web and which refuses to die is the concept of 'above-the-fold' placement.

Stemming back from the mid-nineties, the 'above-the-fold' concept was adopted from the newspaper industry and implemented into early web design. The idea being that headlines and content must be constrained to the top section of a web page so that it could be viewed without scrolling. In the early days of the web, when users didn't understand how web browsers operated and monitors were small, this worked. Content which was placed at the top of the home page, or 'above-the-fold', was more likely to be seen, read and clicked on but thankfully things have changed.

Largely, thanks to the increase in tablets and mobile devices, users are becoming more accustomed to scrolling. For website users using mobile devices scrolling is almost a necessity, particularly for articles and content heavy pages where it is easier and more efficient to scroll then to flick between pages. The mass adoption of social media in recent years can also be attributed to the rebirth of scrolling. Both Facebook and Twitter utilise an infinite scrolling technique across all their platforms which users have grown to love and expect.

Although having certain content elements above-the-fold does undoubtedly still carry some weight in increasing conversion rates, it certainly isn’t as crucial as it once was. Thankfully though, modern web designers are more focused on creating thoughtful user interfaces which translate well across all screen sizes than they are trying to constrain everything to the top section of a webpage. And let's face it, with such a diverse range of screen sizes out there it's nearly impossible for web designers to accurately pinpoint the correct height of the 'fold'.

So whether you’re diehard 'above-the-fold' preacher or a new age scrolling wizard lets take a look at some of the advantages and disadvantages.

Advantages of Scrolling Web PagesDVANTAGES OF SCROLLING WEB PAGES

1. EFFICIENCY - Generally speaking, scrolling through a web page is a lot more efficient and less time consuming than clicking through multiple pages. This is backed up by a usability study conducted by the Software Usability Research Laboratory which confirmed users can read long, scrolling pages faster than paginated ones. The Impact of Paging vs. Scrolling on Reading Online Text Passages
2. RESPONSIVE WEB DESIGN - As outlined in some of our previous articles, responsive web design is here to stay and with so many users visiting your website from a range of different devices (smartphone, tablet, desktop etc) it's important to keep your UI consistent and optimised for all devices.
3. USER INTERACTION - A thoughtful and well designed website can encourage exploration below the fold and scrolling can even increase user engagement and become part of the natural flow of a website. A user-centric design company from here in the UK (CX Partners) have also found that tantalising users with the notion that more content exists will almost always result in scrolling.

Disadvantages of Scrolling Web Pages

1. PAGE LOAD SPEED - It goes without saying the more content you incorporate onto a web page the longer it will take to load. However, there are many optimisation techniques available to help you reduce your load times, some of which we've mentioned in a previous article.
2. NAVIGATION ACCESS - Depending on the size of your web page it may be awkward and annoying for your users if they are forced to scroll all the way to the top to reach your navigational elements. One way to overcome this is to incorporate a 'sticky' navigation menu which follows the user down the page as they scroll.

In Conclusion

As with most things in life it's good to have a balance. Having your important content at the top of the page is still important particularly in some cases, for example ecommerce, but trying to forcefully cram everything into the top 600 pixels definitely isn’t the way to go. It's time for us to shake the term 'fold' and focus on designing compelling and thoughtful layouts which are focused on the user and their multiple devices. If a page runs a little long so be it, people will scroll... providing it’s worth scrolling for.

If you would like any further advice and help regarding web design please don't hesitate to get in touch.