Best practice web design and the death of “the fold”

Nowadays we consume content on all manner of devices, many of them with small smartphone-sized screens. Scrolling is now a natural instinct.

The world of web design today must cater to a myriad of devices and resolutions. In this new order of device diversity, it’s time to shake off outdated web practices.

One such practice is omnipresent “above the fold” placement. This expression comes from back in the day when the majority of people got their news from newspapers. It refers to the upper half of a paper where the most important story and images were located. In web design, it is also referred to as “above the scroll”.

There’s an old fashioned view pervading web development that all important information should be placed above the fold, or before you need to scroll down to see more. This trend persists, even if it makes a page look like a salesy smorgasbord of clutter.

Nowadays we consume content on all manner of devices, many of them with small smartphone-sized screens. Scrolling is now a natural instinct. We accept and expect that scrolling will lead to more content, due in part to ubiquitous scroll-heavy social media like Instagram and Facebook.

People also consume media on many different devices. The most popular screen resolution in Australia for the last six months has been 1366×768, but will likely change in the future? At iFactory we design for the current most popular resolutions, or those most suited to your target audience. There is not even a universal fold to be above anymore.

The fact is, the fold is dead.

Using the space below the fold invites the viewer to focus. There is now no “one fold”. Below the fold website design allows you to utilise white space for emphasis and simplicity, and create a visual narrative with the design and layout. It makes your page like a well-curated art gallery; the use of space allows you to really drink in what is before your eyes. Alternatively, above the fold is the equivalent of an entire exhibition competing for space on one wall.

Several recent A/B tests have shown that moving the call to action below the fold contributed to significantly higher conversion rates.

Research shows that readership falls off rapidly up to 50 words of copy, but drops very little between 50 and 500 words.

That’s a rather important, as 500 words of copy, set at 16px or above at the optimal 75 character measure (how many characters before an eye loses the line it is reading) and 150% line-height, will take up at least 1,000 pixels of vertical space. This puts the call to action well below the fold – even at full-HD resolutions.  Anything further down the page than about 700px can reasonably be considered below the fold at the moment.  Since 1366×768 is the most popular screen resolution , and browser chrome takes up at least 68 pixels).

The virtues of visual minimalism aside, people don’t want to commit to something without a bit of a back story. They want information; they want to know what they are getting themselves in for if they sign up. Above the fold calls to action are like a prospective date that is way too insistent about introducing you to their mother. It’s too pushy, and people do not respond well to it.

So what can we learn from this?

Quality copy and an attractive layout can capture a potential client’s interest much better than the outdated above the fold rule. This practice simply does not make sense in a world of scrollers, and a world of different resolutions.

Look, scrolling didn’t put you off making it to the bottom of this post!

For up-to-the-minute advice on best practice web design in Brisbane, contact iFactory today.


Read more insights