- 80Branding / Identities
- 17Color Theory
- 133Graphic Design
- 217Marketing Advice
- 85Product Marketing
- 16Search Engine Optimization
- 205Small Business Marketing
- 83Social Media Marketing
- 74Viral Marketing
- 71Web Design / Development
- 746Our Blog
Stop the Above The Fold Web Design Insanity - People Scroll Today!!!!!
The old mantra that things on web pages had to be above the fold is an antiquated idea from the very early days of the web. When people didn’t know what the internet was or how to use a browser. Back then, yes, the “above the fold” idea mattered. But that was back in 1999 - today people know what a browser is and how to use it.
This old newspaper term was adopted and refuses to die.
Above the fold originates from the newspaper industry where positioning a story or graphic “above the fold” on the paper could increase readership. Since newspapers are displayed and sold flat - if the headline or photo was compelling it could increase sales. And of course, readers are more likely to read and be interested in things placed on the top half of the front page. So “above the fold” was born.
When the web was young, and newcomers didn’t understand how a browser worked, monitors were small, and the world wide web was not ubiquitous - this idea was co-opted and applied to web design. Since screens were small, things seen within the boundary of the home page screen were “deemed” above the fold. So back in 1999, something visible within the 800 x 600 pixel dimensions of the home page was more likely to be seen, read, and clicked on. Similar to a “folded newspaper” if it appeared above the fold or in digital terms, within the visible area of the monitor, then it was golden. AOL also made this concept popular since its standard interface was constrained to 800x600 everything was “chopped up” to be contained and displayed within this area - to keep it visible. The result, articles spanned multiple pages, you clicked to the next page instead of scrolling to see more. But that was then…
Repeat after me, above the fold doesn’t matter any more.
Now breath a little bit. Relax. It’s ok. You’re not going to die. Your head isn’t going to explode. And visitors to your website aren’t going run screaming from their computers because they have to scroll. In fact, with the explosion of the big monitors and the mobile web with its small screens on smart phones, scrolling is almost a requirement in some instances. The fold has vanished. It has ceased to be. It is a dead issue.
User testing, eye tracking, and click data dispels the fold myth
Many studies of been conducted to test the validity of the “above the fold” hypothesis and they’ve all shown that today’s users do indeed scroll. The above the fold myth has been debunked. CX Partners, a user-centric design firm from the United Kingdom, does a lot of eye tracking research for their clients. And they’ve consistently found that the “fold” is no longer relevant. You can read about their “above the fold user testing” on their blog. But to paraphrase their results - often less content above the fold will encourage exploration beneath. And if the design tantalizes that more exists below - scrolling is almost guaranteed. In essence, if something bridges the fold people with scroll down to see more. Further, people now recognize that scroll bars on a browser indicate more content lies below and know that the scroll bar can also visually indicate the page length.
Evaluation of click data also supports the notion that people do scroll. Milissa Tarquini writes for boxesandarrows.com about her experiences as an interface designer at AOL since 1995. Her article, “Blasting the Myth of the Fold” is a very good read and provides lots of anecdotal and real-world evidence to support the concept “the fold doesn’t matter” - but one of the interesting things she mentions is the click data for TMZ. She notes that the links at the bottom of TMZ’s super long pages are often the most clicked on - this indicates a willingness of the user to scroll long pages - if the content is compelling.
Things above the fold should be important…
If you’ve scrolled down this far, you’ve just read the above headline where I acknowledge that content above the fold should be important. But it’s a no brainer to proclaim interesting and important things should be placed at the top of the page. Really “above the fold” was an argument against scrolling and against longer content on pages. The mantra of “above the fold” was used to constrain design to an arbitrary and mostly imaginary screen dimension. But as research has demonstrated compelling content and visual cues that more content exists below have obliterated the old notion of “above the fold” in web design. Unfortunately the out dated idea simply refuses to die.
But where is the fold?
Again, back in the 90’s when most computer monitors were typically 15 inches, screen real estate was at a premium. But more so, it was fairly standard. Most people viewed a web page full screen and with “browser clutter” designers knew they had less than the 800x600 pixel dimensions to work with and designed for 640 x 480. But today, high resolution monitors are fairly standard and their pixel dimensions and aspect ratios vary wildly. Desktop monitors can span 20” to 30” or larger; you can connect your computer to huge LCD or Plasma televisions; and laptops come in all sizes and shapes with lots of different screen resolutions too. And need I mention smart phones and tablets? So the answer to “where is the fold” isn’t easy to answer today. The “fold” was usually defined as the bottom of the browser window…but if you open your browser on a 24” monitor it’s likely most web pages will fully display within that height - so there really isn’t any fold. Or if you open the same page on a smart phone…it’ll either resize the content to fit or you’ll need to scroll.
So why cling to the old 800 x 600 dimension? By adhering to the “above the fold” dimensions your content is squeezed to the top of the browser. You’re doing a disservice to your web design and web visitor. To fit, your content was most likely edited and unnecessarily truncated to squeeze it into an arbitrary area. And your larger monitor using visitors are left looking at a lot of unused screen real estate and a forced user experience. All because you (or likely the client) believed users don’t scroll.
But when monitors are huge or very tiny (such as in the mobile world) it’s impossible to ascribe a fixed dimension to the “fold” on a web page. The idea works for newspapers because they are a consistent size and perhaps in the early years of the internet it was some what true - but today - there is no fold on a web page. Users do scroll. And in fact, most would likely prefer to scroll and continue reading or viewing your content over being forced to view shortened content spread across multiple pages. So forget the fold - it doesn’t exist. Design a compelling page layout and if it runs long…it’s OK…people will scroll - provided what you put lower on the page is worth scrolling for.
Reference and Related Reading:
Jul 26, 2011
By: William Levins
Additional Posts You May Find Interesting:
We work with large and small companies, but sometimes budgets, schedules, or differences get in the way. There's always the next one.
We're not miracle workers, but we've been known to perform a little magic and help your businesses take off. And we keep working hard.
Our biggest reward is when our clients tell us we've done a good job and thank us for it. And then when they hire us again and again.