Above the Fold

The term “above the fold” initially applied to newspapers, which put their most important stories literally above the literal fold in the paper. This was the part of the paper that would show in a newsstand, the part a reader could most easily read while traveling on a subway, and the part that would be most accessible when the paper was on the breakfast table.

In talking about websites, we say “above the fold” in reference to the part of the screen that’s visible without scrolling down.

While there’s widespread agreement that things like the primary call to action, especially buttons we want people to click, should be above the fold, there are differing viewpoints on how far we should go. Is it essential to have everything above the fold so no one ever has to scroll? Can you safely assume that nobody will ever look below the fold and feel free to dump any old thing in at the bottom of the page?

First, there’s the position that an increasing number of people won’t scroll, so we should not expect them to.  Many sites, taking this position, are intended to be seen on most browsers without any scrolling necessary.

Then there’s the view that above the fold is for initial visitors — but below the fold is for the search engines, returning visitors, etc. This site, designed by Littlefish, has everything essential right at the top of the screen, and then relaxes and spreads itself into another 480 words or so, comfortable with the idea that not everyone will see it.

Robert Flournoy, of Blue Cedar Marketing, points out that “Nowadays the below the fold idea is a bit difficult to comply with because of the many variations of screen dimensions and resolutions,” and this will only become more of an issue in the future as browsers and devices proliferate.

However, it’s clear that most viewers aren’t going to read to the bottom of the page. The behaviors in the video below are typical, in our tests: the young man does scroll, but spends only about 4 seconds total zooming down and back up before deciding whether to stay at the page, while the young woman never scrolls at all.

What’s the best solution?

• Test your site design without scrolling. It doesn’t have to look the same on everyone’s computer, but it should look good to non-scrollers, as much as you can manage that. We have every reason to believe that the average user of the internet decides whether or not to stay on the basis of an immediate impression, even if they’ll stay and scroll through your page once they’ve decided they’re in the right place. So avoid a design that requires scrolling for full appreciation, even if you decide to go with longer content.
• Put your essential content at the top. We’re currently working with a site that has business hours and contact info so low on the screen that only the largest monitors will show it without scrolling. Don’t do that to yourself. Your logo, your business name and location, your primary selling point and call to action — these things need to be at the top of the page.
• Check your analytics. The site overlay feature of Google Analytics, as well as heat map features of services like crazyegg, will show you whether people are clicking on items at the bottom of your site. Notice that Google Analytics won’t show, if you have a link in two places, which one is clicked. However, when you have a link below the fold only, you can see whether your particular visitors are clicking it (nine times out of ten, the answer will be “no”). Your analytics can also show you what kind of screen resolution your visitors use, and what kinds of browsers. While I have sympathy for the school that would embrace and encourage “biodiversity” online, knowing who’s actually looking at your site lets you know how broadminded you have to be.

Once your visitor has decided to stay and explore your site, you can relax a bit. Inner pages, for example, can be longer.  Just be sure to welcome the non-scrollers to your homepage.