Deciding what to put "below the fold" Options

[bragadocchio]

The latest article from Jakob Nielsen looks at Scrolling and Scrollbars, and appears to make some good points about how poorly designed scrollbars can frustrate uses, create accessibility challenges, and cause people to miss information.

One of the statements he makes is:

Display all important information above the fold. Users often decide whether to stay or leave based on what they can see without scrolling.

A couple of thoughts that I had in reading the article:

1. In this day of varying screen and monitor sizes, from smart phones to large laser plasma displays, and everywhere inbetween, it's hard to tell what is "above the fold" and what is "below the fold." The metaphor comes from Newspaper publishing, where the "fold" is easy to identify. With more people used to the idea that the information on their screen will scroll, is it as important to have everything "above the fold?"

2. With search engines possibly delivering people anywhere on your site as the entry point to your pages, this warning about scrolling probably should apply to any page on the site. So, what information should be "above the fold" on every page of your site?

3. The purpose of your site probably determines what "the most important information" on your page is. So, what is the most important information for a site that drives leads, or one that sells products or services online, or one that shares information? It's easy to argue that all the information on your page is important, or you wouldn't include it on your pages. But some of your words and images are more important than others. How do we determine that?

4. What are the best strategies for communicating quickly and engagingly to people what your site is about with that information that shows up above the fold? And what, if anything should you put "below the fold?"

[Ron Carnell]

So, what information should be \"above the fold\" on every page of your site?

To me, that seems fairly simple. What is above the fold should be whatever it takes to motivate people to scroll below the fold. That content might or might not be important in other senses of the word.

Once again, I think Jacob has missed an important point about content.

Assume, for a moment, that we put everything above the fold as he recommends. If that content wasn't sufficient to entice people to scroll a bit, why would we think it was sufficient to entice ANY other action from them?

[unreviewed]

What is above the fold should be whatever it takes to motivate people to scroll below the fold

Try to tell that to the average Adsense publisher …

I’ve never seen a horizontal scroll bar in use before, can’t imagine what it could be used for. I have seen many a blog that could make good use of a vertical bar, rather than a mile long border without center content.

[Ron Carnell]

Try to tell that to the average Adsense publisher …

LOL. That, I think, relates well to one of Ammon's frequent points.

Sometimes, the real goal of the web page, often the hidden goal of the web page, is not best served by usability concerns. When selling advertising space, especially on a CTR basis, you don't really WANT the user to scroll down or go to another page. But that's a different horse, of course.

[tam]

I very much dislike scroll bars that have been added so that the whole page doesn't scroll. E.g. putting the content in a scrolling box. I'd much rather use the scroll bars provided by the browser than fiddle about.

If your advertising then I think generally you want to be above the fold. You want as many views as possible so don't want to cut out those that don't. Then again having an advert/link at the bottom of an article you know that most likely someone that has found it has read through the article so is perhaps more interested then someone who would click through at the top.

I think headers that fill half (or sometimes all!) of the above the fold area are wasting important space.

If the top part has caught my interest then I'll scroll down for more. The anchor links can be handy for this. Linking to sub topic titles that might catch someones interest and draw them down the page but would otherwise be missed because they are below the folder.

As for the location, I'd say about 790px x 550px of above the fold space would be visable on the majority of browsers. With mobiles etc. it's even more precious, as from the limited fiddling I've done with them scrolling is a pain.

Tam

[busybeingborn]

A good practice is to peek some good content, categories, photos, whatever right above the fold. this usually entices the user to scroll down.

I think the days of users not understanding that they can scroll down and see more is diminishing as users become more savvy. This was true a couple of years ago but now I see it less and less.

[randfish]

I'm sure Kim would agree that vertical scrolling is practically the standard these days. When I watch users going over our websites or those of our clients, I (almost) always see them look at something, then scroll, either with bars or the mouse wheel.

Usually, they scroll right back up, as the most "engaging" content has purposely been put above the fold (since we're such smart designers!). But clearly they realize the concepts of screen real estate and are at least advanced enough to realize that important stuff might be "below the fold".

Good topic, BTW

[James]

I certainly agree with many ideas in this thread. I too dislike framed content (or iframed or CSS-styled to look like scrollable framed content).

I also agree with Randfish that vertical scrolling is the norm to many with the invent of such things as mouse wheels and scroll wheels on keyboards (the latter I think I've used twice though).

From an ecommerce perspective, as long as you have:

* product summary information
* nice photograph(s)
* buy now/add to cart
* pricing

in an area of the browser where it is likely to be above the fold on any common screen resolution, you can use the real estate in the area that could be below the fold for additional information, for example, more detailed product information, reviews of a product, specification data.

[chinohill]

A recent article from (MediaCom...? forgot exactly which authorative site) indicated that:

1. Most online users view a webpage in the "N" manner. That is, they will view the top left portion, move down than to the mid top, down; then top right, down again...

2. Until they see something, within 7 seconds, that there is something interest them in the first fold. They WILL leave. Hardly anyone will use horizontal scroll bar.

3. Only within that crucial 7 seconds, that something is interesting, will they scroll down to the 2nd fold...

4. If there is a naviagation bar on the left or on the Top. Most users will "immediately" ignore the navi bar and move on to the next logical viewing area.

I found that is true, as far as myself is concerned. So for us doing business online, I would:

a. Place my navi bar on the right or on the top. Leave the left Critical real estate to yell out something that could attract users attention, or make it sticky, and make them scroll down.

b. On the center top part above the fold, another prime real estate, lay out the "Benefit" the users will get by scrolling down or click other pages or link that will convert them to paying customers or subscriber...

c. Do not jam too much word on the first page. People hatre to be "eyeball-Stressed" or "text-jammed"; they prefer text with space in between. Only until you catch their attention, then you bore them with long sales text page...

Page layout does make a lot of difference... i.e. Conversion.

[Dr_Livingston]

2. Until they see something, within 7 seconds, that there is something interest them in the first fold. They WILL leave. Hardly anyone will use horizontal scroll bar.

I come across a Horizontal scroll bar, I close the browser. Immediately.

they prefer text with space in between.

This is a golden rule and ignore it at your peril I say

[Ron Carnell]

Isn't it amazing how forums inevitably seem to break every rule we try to make? The content rarely is complete above the fold. A long URL will create an instant horizontal scroll bar. Use of white space is haphazard, at best, and at worst, sparse.

And yet? Here we sit.

[cre8pc]

My first sites were web versions of print magazines and my major in college was journalism. I think this naturally led me to place content "pyramid style", as is taught in journalism (state the overview first and fill in with backup info below.)

Article and story headlines are now, in my mind, navigation links. Both have to grab attention, and offer some hint of what the subject/topic is. This is where the "scent of information" in relation to navigation comes from. This "scent" is something like a keyword that describes where the visitor will go if they click the link. The "scent" has to be strong enough to make the visitor feel confident about where they'll end up. It has to be something they'll understand.

This is why "above the page fold" web page real estate is so valuable. It's like grabbing a newspaper. We usually see the upper fold half first, with the bold headline and lead stories. We know that where the editor places an article sends a message to us about its importance. Translated to the web page, we think the same way. We expect that the most vital information is up top.

I like to test pages at different resolutions to see what people will see. It's fun to experiment and try things like starting a boxed area with a just a hint of something from it above the page fold, but to see the rest of what may be inside that box, the visitor must scroll. Images too can be used like this.

Another lesson I learned from a famous web site owner/mentor was the error of putting too many things at the top of a homepage. He insisted that I discipline myself by putting the main objective information at the top and fill in with sub-objectives/goals below. He would ask me, "What is your web site for?" (or "What do you want it to do?, "What is the main purpose?", etc.)

For him, it was a crime to force someone to scroll just to figure out what a site's purpose is.

[usability_guy]

Nice topic.
So Important information should be above the fold.
Again that is different for different monitor resolutions.
peoples using 800*600 can fit only 419px area above scroll.
So I think you need to do proper case study for the site like how much % of peoples will have 800*600 and how many % will have.
The portals like rediff.com are viewed at 800 resolution by more than 65% audiance.
In some sites the I saw the images are displayed half till the fold is that a good idea?