Thom Henkel's List: Above the Fold

Because the traditional “screen” that people view the web through has undergone an explosion of variety… no longer can we expect web-surfers to be on something close to a 19″ monitor with a resolution somewhere between 1024×768 and 1280×700. Screens nowadays come in all shapes and sizes, from iPhones (and smaller phones) to 60″ HDTVs. It’s not just resolution that can vary wildly though; the very aspect ratio of a screen (even on the same device like the iPhone) can change with the flick of the wrist. Sure, web designers will always be advised to keep the most important messages of a site near the top, but with so many new ways for web-surfers to view the web, there’s no longer a defined height for where content must be above.

One interesting research concerning AOL has showed that the most clickable link on their website was placed in the footer (!) and it was pointing to a popular gossips website. It sure looks like scrolling is not that bad, and users don’t want to spare their fingertips and they mercilessly use the scrolling wheel to find interesting content.

ith blogs and blog sites, and these almost always require you to scroll below the fold. Another point is avoiding interruption. If you require someone to click to get to the next page, you may lose them. If you think about accessibility via smart phones, it also makes sense to design pages that can be read via scrolling, as opposed to clicking a (barely visible) button to get to the next page of content. But the debate is far from over.

What I'm proposing is for you to think twice about these 'rules' which are preached so often around the web and aim to create something original. Don't live in the old world of pushing all your quality content on the visitor at once because they've only got 4 seconds before their attention drops (or whatever other statistic is doing the rounds at present).

Think about the ultimate journey you want them to take. Entice them in, make them actively want to scroll and read on, and on, and on. Guide them with your excellent content and let them explore your site. Tell a story with your content. Space it out a little and you will have some happy visitors who actually want to be there!

The purpose of the fold rule was to sell newspapers.

This is not a newspaper. You aren't paying us to use this website. You came here because you wanted information on a website, you found us on google, a friend told you about us, or some crazy other way. The rule just simply has never applied to the internet.

A website's fold changes. A newspaper's does not.

What size is your monitor? In the room that I'm currently in, there are two 15.4" laptops, a 21" iMac, a dual 19" monitor setup on a PC, and a 17" CRT monitor. All have different resolutions. The way every single one of these monitors displays a website is different. The New York Times is always the same size.

The fact that one of 2009s biggest trends was for oversize headers, forcing content below the fold should provide a wake up to those believing this myth that a site’s functionality must all appear above the fold. If there is anything that stops users from scrolling and keeps them above the fold, it is only bad design.

In an attempt to drive more clicks, and presumably increase revenue, Facebook has added a new “below the fold” ad spot, increasing the number of ads that are displayed on the right-hand site of the site from 3 to 4 ad placements. While a subtle adjustment, this could have a dramatic impact, decreasing the cost of advertising in the short-term thanks to increasing the available inventory by 33 percent.

Now we know, users scroll and we are taking advantage. Sites now can space things out and leave viewers and readers visual relief in the form of white space. But we sometimes forget, especially on home pages, that users need to be led by the hand through the website. In the same way films present stories with a flow, leading viewers from point A. to point B. and so on, we need to do this with our web sites. Websites are not about how much visual noise we can create above or below the fold but it is about clarity of message and content aggregation.

show a little bit of the content below the fold and don't worry about making the page fit perfectly on the height. Do the opposite: make it clear there's more to come.