Once upon a time, back when the internet was still a magical, futuristic wonderland ruled by nearly forgotten dinosaurs such as America Online and Prodigy, and internet speed was dictated by the speed of your dial-up modem, web design was an arcane art still in its infancy. In the days of AOL’s walled garden version of the internet and Netscape Explorer, designers were still feeling out just what a webpage should look like. They took their design inspiration from the leading printed news source of the day — the humble newspaper — and decided that, just like the newspaper, web pages should follow the ‘above the fold’ model of putting the most important news at the top of the page.
Newspapers did this because they were traditionally sold folded in half. This allowed them to both take up less shelf space for retailers, and to fit neatly into the display window on a newspaper vending machine. It also forced publishers to put the biggest, splashiest, or most alarming news stories of the day above the fold in order to entice readers to purchase the newspaper.
Web designers of the day simply decided to emulate that design. This design choice also dovetailed neatly with the technological limitations of the day. Computer monitors in 1999 were comparatively small, and screen resolution was often limited to only 800×600 pixels, which is miniscule by modern standards. Designers were also loath to make users scroll down to see page content, so everything had to be squeezed into that one small display area. AOL further popularized this design choice by using an 800×600 interface design, and not including a scroll function. Instead, AOL users had to click from page to page to see content instead of simply scrolling down, which worked out fabulously for the many novice web users who had to yet master the art of scrolling.
These factors combined to cause that first generation of web designers to standardize web design with the ‘above the fold’ idea. For the most part, designers that followed since that time have done little to change or challenge the idea.
However, there is simply no reason to continue this practice, and it may in fact be causing more harm than good for the many web sites that continue to use it.
This is not 1999. Monitors are much, much larger now. An enormous number of people use smartphones or other portable devices to surf the internet. And, best of all, most, if not all of them, have mastered the art of scrolling down a page to see content below the fold.
One of the biggest issues with ‘above the fold’ design is that many of these pages simply do not render correctly on small screens such as those on smartphones. Users instead are forced to scroll around the page, or zoom in, and generally have a very, very bad browsing experience.
Research has also shown that better content distribution over the entire entices readers to read the entire page and to seek out the content below the fold.
CX Partners, a UK-based design firm specializing in user-experience, thoroughly de-bunked the idea of above the page web design in an eye-tracking study of how users actually interact with web pages.
Over a six-year period, the firm tested 800 users use eye tracking technology to see how they interacted with various web page designs. Out of those 800 people, they recorded only three instances where placing content below the fold seemingly discouraged page viewers from scrolling down to see the entire page. Each of the three cases involved a specific web page with a single, broad blue line running from side to side. This line apparently acted as a physical barrier which discouraged users from scrolling further down the page. They redesigned the page without the barrier line – and users began scrolling to see all the page content.
For the most part, users in the study had no issues scrolling down webpages for content, and actually enjoyed scrolling down the page – provided that there was the promise of interesting content further down the page.
Their research yielded three important rules for web page designers:
Less is more: Resist the urge to cram everything above the fold. A well-designed webpage should include ample white space and imagery to entice users to scroll down the page for more content.
Avoid horizontal lines: Stark, bold horizontal lines act as a visual break or barrier on the page that strongly discourages uses from scrolling further down the page and should be avoided.
Never use in-page scroll bars: The only scroll bars should be the naturally occurring scroll bars on the browser. Using such things as boxes or lists on a page with independent scroll bars can confuse users and is a near-guarantee that the content will not be fully read. Also, since browser scroll bars give uses an idea of the length of a webpage, adding an in-page scroll bar can give a misleading idea of how much content is the page, which can seriously frustrate page visitors.
A vast body of additional research and anecdotal data from leading web designers seems to back up the idea that it’s time to bury the old above the fold design mantra.
Milissa Tarquini, who spent decades at AOL as an interface designer _ primarily as Director, User Interface Design and Information Architecture __ wrote passionately about the need to abandon above the fold in an article she wrote for boxesandarrows.com.
A veteran web designer who designed more than 80 sites for AOL, Tarquini argues that, contrary to traditional web page design that places highest value on the top of the page, the most valuable real estate is actually at the bottom of the page.
The secret, according to Tarquini – and backed up by CX Partners research, among others – is to use engaging content to draw your users down the page.
The evidence is clear.
Above the fold is an outdated design conceit that has no place in modern webpage design.
The last great frontier of web page design is the bottom of the page, not the top.
Effective web design needs to embrace this idea, and provide interesting, enticing content across the page, not just above the fold.
Meeting the challenges of designing an effective website can be a daunting challenge. We can help.
Contact us today see how our experienced team can create the web presence you need to increase traffic — and your bottom line.