More and more web designers are seeking to dispel the notion of the browser fold. Yet there is still the reality that users can not see all of a page’s content if it is taller than a browser window and they will potentially leave the page before discovering the additional content. There is often an email sent from the CEO or other senior manager stating that they want some graphic or link moved above the fold. This typically ruins the layout or requires major reworking to get things to fit.
I guess I should back up a bit and explain that the fold is an invisible line where the content of the page is not visible below the bottom of your browser window (and/or to the right side if there is also more content than can fit into one screen horizontally). It is borrowed from the print world where certain print formats such as newspapers and brochures are folded. The content that was most important appears on the front page before the fold to be sure that the consumer would notice it.
Recently there was a posting by the Director of User Interface and Information Architecture at AOL, Milissa Tarquini on the Myth of the Fold. She quotes a Clicktale’s Blog where they did research showing 76% of page-views with scroll bars were scrolled to some extent. She also shows, using AOL data samples, how content at the bottom of long pages was often quite popular. They show that 22% scroll all the way to the bottom of even the longest pages.
After reviewing both stories, unfortunately, I have to disagree. There is a fold. There is no way of getting around the fact that there is content that users do not see. In this case, by their own data, as much as 78% never see the bottom. It is ridiculous to argue that users know how to scroll and that they do scroll. Of course they do. Just as nobody would argue that people are unaware of how to unfold a newspaper. The point is 24% (100%-76%) of users are still not scrolling at all for whatever reason (at least according to the linked research which is, of course, devoid of any details on how the data was actually collected). The articles point out an important issue and that is, unlike a newspaper or print piece the web “fold” is in different places depending on the user’s screen resolution, which browser they are using, and a bunch of other system changes that may affect the maximum display area. Tarquini also admits that the users must be able to know what your site is about from content above the fold (that, you must remember, is a myth). Additionally, both articles actually suggest ways of dealing with the mythical fold that, again, they insist does not exist.
They both recommend creating a design that has a “cut-off” appearance. Graphics and/or text placed so as to bleed (another print term) at the “fold” location, which help indicate to the user that they should scroll. The problem, again given screen and system variations, is how do you know if that content is positioned correctly. Ultimately, you can’t… So I am proposing the fold zone. Rather than a single line, you can work your design magic (another myth by the way) by placing/designing elements so that a significant region is spanned. My sample set is strictly 1024×768 resolution with IE, FireFox on Windows and Safari, FireFox on the Mac. The shortest window… IE at full height with start bar always visible and google tools installed (something many users have) is 543px. The tallest display was Safari with no status bar and dock set to hide no tabs) was 671px. That gives a 128px variation overall starting from 543 px from the top of the browser’s page display area.
There are of course settings to collapse or remove browser toolbars, but I am looking at the relatively (and I admit completely unbacked by any research) most common default configurations. The reason to limit it to these… is that it represents the users most likely not to scroll (again I have no data). Other users who have Opera or some other more exotic browser, or who have found ways to maximize the browser display so significantly, are most likely to scroll when they see that the scroll bar permits it. They do not need other indicators in the design. I am still maintaining that there is a fold even for such “expert” users. As again, the issue is… do they see relevant content that will motivate them to explore the page further or pursue interactions (by scrolling which they certainly know how to do)?
That is a pretty big zone, and so I can not recommend that you force all your designs to have an element spanning that much space. I would suggest you work to make sure that the content is prioritized, and that the most important content is above the 543px mark. Then, if the design lends itself to having something that gives a subtle visual hint which enhances what the scroll bar is already doing, then make it so. So don’t get bent out of shape over the annoying request to move something above the fold. Plan your design much like designers have had to do for ages, by knowing your medium and its limitations real or perceived.
Of course, this all goes out the window (hah pun) with mobile browsing devices… which of course you have a different style sheet for those. Don’t you?
Addendum:
In a recent meeting with a bunch of other UX experts the reality that there is a moving fold came up in our discussion. That is where ever the user stops scrolling is a new fold. That may partly explain why some users never scroll all the way to the bottom. If they stop at some point that has enough of a gap they may feel they have reached the end. So it would seem that the subtlety here is the size of the inner scroll bar (some interfaces cause the scroll bar’s inner element to be sized according to the amount of content) appropriate enough to be noticeably not at the end and again, ultimately, is the content or interaction compelling enough to prompt the user to scroll more.