A hot item of discussion (or maybe debate) when we present website design comps to a client, is the desire from many clients to keep most -- if not all -- information above the fold.
What is the fold?
The fold is used to describe the upper half of a website -- the content users see without having to scroll down the page.
Where is the fold?
There is no clear indication where that fold is, since this “cut off” depends on different factors like a user's monitor resolution, their browser, bookmark bars, etc. These are all elements that can influence a website's visual real estate.
Usually, on a monitor resolution of 1024x768, the fold is somewhere around 600 pixels. But it is important to remember that this is not a fixed position. In fact, recent studies show that the same position of a certain fold only accounts for about 10% of all users. So, even if we were to design a website with a clear cut off in mind, we would only get it right for about 10% of all visitors.
Does the fold matter?
Yes, the fold matters. Visitors should be able to understand what your business is about by the information located above the fold. However, we don’t believe there is a need to place all content, or as much content as possible, above the fold. In fact, we try to encourage users to scroll down and explore the site, and a very effective way to achieve that is the use of white space and less content above the fold. We also try to show images or content that will be only partially visible to indicate there's more content below.
Jakob Nielsen wrote about the acceptance and understanding of scrolling down a website in 1997, yet we still come across this misconception and desire to place all content above the fold 14 years later.
Recent usability testing suggests that a majority of users do in fact scroll, and that a good portion of them scroll all the way to the bottom.
The Death of the Fold
There is another matter that is contributing to the Death of the Fold. No longer is browsing confined to desktop computers. Mobile browsing is increasing every day, whether on small-screen devices like the iPhone, or medium-screen devices like the iPad.
With the shift to mobile, website developers have to take different screen resolutions into consideration than ever before.
Open up one of our latest site designs, Fluidmaster.com
on your iPad in portrait mode. You can see the entire content of the home page right up to the footer. Now turn your iPad to landscape mode. The iPad automatically enlarges the site to fill the wider width of the iPad screen, however the cut-off, or the fold, has now moved up considerably, and much less of the content is visible and more scrolling is needed.
As you can see, even on a single device we’re dealing with two different cut-offs. Of course we could design a home page that shows all content in landscape, but it would leave half the page empty in portrait mode. Bottom line:
Test your site design to see that what is visible clearly and effectively articulates your brand and the business you are in.