rethinking the fold
DESCRIPTION
TRANSCRIPT
The FoldRethinking
Chuck Mallo4July 2009
The Fold
Why we shou
ldn’t w
orry abo
ut
2
What is The Fold?Originally a term coined in the newspaper prin<ng business years ago.
Newspapers are folded in half, leaving 50% of the content below the fold.
Newsprint designers had to be cognizant of the fold and design layouts and ar<cles so the important headlines and features were above the fold.
THE FOLD
Most important stuff here
Less important stuff here
The Fold
Why we shou
ldn’t w
orry abo
ut
3
This term has been extended and used in web development to refer the por<ons of a webpage that can be visible without scrolling.
However, some have suggested that this term is inaccurate as screen sizes vary greatly between users, especially in an era where websites are viewed with mobile devices as much as home computers.
The Fold online
SOURCE: h8p://en.wikipedia.org/wiki/Above_the_fold
Wikipedia says:
The Fold
Why we shou
ldn’t w
orry abo
ut
4
In the early days of the internet, screen sizes were small and the average screen resolu<ons were much lower than what we enjoy today.
The Fold online
51%2002 2009
7%
% of users viewing websites with a screen resolu<on of 800x600 or less
THEREFORE:
Web designers (many of them migra<ng from the print industry) put a lot of effort into making sure users didn’t have to scroll much to see the whole page.
SOURCE: www.thecounter.com
The Fold
Why we shou
ldn’t w
orry abo
ut
5
Today, screens are much larger and screen resolu<ons are much higher.
The Fold online
46%2002 2009
80%
% of users viewing websites with a screen resolu<on of 1024x768 or more
THEREFORE:
Since there is so much more screen real estate to work with, modern‐day designers are less concerned about users having to scroll down to see important page elements or calls to ac<on.
SOURCE: www.thecounter.com
The Fold
Why we shou
ldn’t w
orry abo
ut
That’s one of the problems when contempla<ng The Fold. Where exactly is it?
Due to the wide variances in screen resolu<ons, screen sizes and browser window sizes, reaching a consensus on the “average” placement of the fold is problema<c.
The fold is not a single loca<on, but a broadly dispersed distribu<on with three peaks located at roughly 430, 600 and 860 pixels. These peaks correspond to the three most popular screen resolu<ons used today: 800×600, 1024×768 and 1280×1024, minus about 170 pixels used up by the non‐client area of the browser.*
6
Where is The Fold?430px
600px
860px
SOURCE: h8p://blog.clicktale.com/2007/10/05/clicktale‐scrolling‐research‐report‐v20‐part‐1‐visibility‐and‐scroll‐reach/
The Fold
Why we shou
ldn’t w
orry abo
ut
7
In the early years, there was a common misconcep<on that users didn’t like to scroll.
Today, there is plenty of data that proves that users don’t mind scrolling.
In fact, research shows that most users are comfortable with scrolling and do so regularly, regardless of page height.
Scrolling below The Fold
SOURCE: h8p://blog.clicktale.com/2007/10/05/clicktale‐scrolling‐research‐report‐v20‐part‐1‐visibility‐and‐scroll‐reach/
Percent Scrolled to the Bo4om
Page Height (Pixels)
The Fold
Why we shou
ldn’t w
orry abo
ut
8
This myth that users won’t scroll to see anything below the fold – is doing everyone a great disservice, most of all our users.Milissa TarquiniDirector, User Interface Design and Informa<on Architecture at AOL
“Users are perfectly willing to scroll ... if the page gives them strong clues that scrolling will help them find what they’re looking for.Jared SpoolCEO & Founding Principal of User Interface Engineering
“We should start thinking of “the fold” as something other than a hard line with an “above” and “below” porUon, and we should stop thinking of the verUcal posiUoning on a page as equivalent to priority.Christopher FaheyDesigner, Teacher and Co‐Founder of Behavior, an interac<on design consultancy
“
What the experts are saying
The Fold
Why we shou
ldn’t w
orry abo
ut
9
Rethinking The FoldShould we try to eliminate pages that scroll?
Should we try to cram as much content as close to the top of the page as possible?
Should we get rid of good content just to reduce the height of a page?
Does “the fold” really mager?
NO.
The Fold
Why we shou
ldn’t w
orry abo
ut
10
Rethinking The FoldShould we make sure that our primary calls to ac<on are close to the top of the page and visually dis<nct?
Should our page templates be laid out in such a way to feature important content at the top of the page?
Should we employ a content strategy that calls for concise content throughout our site?
Yes!
The Fold
Why we shou
ldn’t w
orry abo
ut
11
Further reading
BlasWng the Myth of the Foldhgp://www.boxesandarrows.com/view/blas<ng‐the‐myth‐of
Unfolding the Foldhgp://blog.clicktale.com/2006/12/23/unfolding‐the‐fold/
ClickTale Scrolling Research Report V2.0Part 1: Visibility and Scroll Reachhgp://blog.clicktale.com/2007/10/05/clicktale‐scrolling‐research‐report‐v20‐part‐1‐visibility‐and‐scroll‐reach/
ClickTale Scrolling Research Report V2.0Part 2: Visitor A4enWon and Web Page Exposurehgp://blog.clicktale.com/2007/12/04/clicktale‐scrolling‐research‐report‐v20‐part‐2‐visitor‐agen<on‐and‐web‐page‐exposure/
The Fold
Why we shou
ldn’t w
orry abo
ut
12
Sites that don’t bend at The Fold
Apple
Adobe
Symantec
Microso^
Geico
Nike
Hulu
Vizio
EDS
The White House
Starbucks
Neblix
Southwest Airlines
Intel
Motorola
Barnes & Noble
Capgemini
AIGA
