Below the Fold: Why Scrolling Isn’t A Bad Thing
“I want a website. It will be cutting edge visually impressive. It will have a wealth of information available. All of our brochures, a full directory of employees, and a shopping cart. I don’t want it the user to have to scroll all over the place though!”
Ever hear this from a client describing their vision? Somewhere along the line having to scroll for information started to bother people. Scrolling isn’t the make or break of a page. Use it to your advantage, and you’ll have a site that seems almost intuitive.
Photo by everdred
Frames Brought a Bad Rep
Back in the days of single page sites with frames and IFrames, scrolling was heavily integrated to the layout. Most of the time it was far from necessary, but then again web design was only a hobbyist activity back then. Chances are you’ve seen an IFrame embedded into a page with miles of text acting as a news feed.
Then something happened. Screens started to get bigger, resolutions increased, and frames started to be banished from websites by CSS. But still some people did not like to scroll. Technology may have improved, but some sites continue to arrange content poorly and scrolling still feels like a chore. We can do better.
Pick A Resolution. Design to it.
In my experience when a client says “I don’t want it to scroll”, they don’t often realize how such a “simple” request is almost impossible to execute. A resolution of 800×600 will almost guarantee scrolling on most modern websites. This isn’t a product of bad design, it’s simply the limitation of a lower resolution.
You’re going to have to be decisive. Who is your audience for the project? What is their likely minimum resolution? If you’re dealing with cutting edge technology chances are it will be higher than average. Certain other sites may attract users who are still living in an 800 x 600 window. W3Schools has a great resource for browsing statistics to help you decide (numbers on your side!). Currently 1024 x 768 is the most common baseline (The 960 grid system works very well with this). Bookmark these pages for the next time a client requests the complete removable of scroll bars from a page, you’ll have numbers on your side.
Love the Fold
Think of a newspaper’s front page above the fold. What is the dominant content? On many newspapers it is simply an exciting image or headline to lure readers in. All of the substantial content is embedded within the rest of the paper, but if a reader is compelled by the headline they will gladly search it out.
Use this to your advantage. Attract your visitors above the fold, but don’t hesitate to put the good stuff below. It simply has to be something compelling; something that will make a winning case for the rest of the site. Flickr has vibrant community images, MTV has slide shows, Google has a search bar (Do you even realize how many other pages there are?!).
Sure, a casual visitor might give it a quick flick of the scroll wheel before moving on, but you have to hold bait in their face. Like the newspaper, an interested visitor will gladly continue.
People Expect to Scroll
Ever see what a website looks like with CSS removed? With the formatting gone the content becomes a long list of unorganized data, and a scrolling nightmare. It makes you miss columns, and text alignments. People don’t get frustrated when they have to scroll. People get frustrated when they know it can be avoided or done better.
The internet is not a new development any longer. Scrolling is not an unreasonable demand on a visitor especially if you continue to provide valuable content. Usability is about making it accessible, but not at the cost of intuitive information design.
Scroll Away
The scroll bar has been through its growing pains, and now the stigma needs to be re-evaluated. Rethink your scroll bar. Look at your site. Do you motivate people to scroll? Or do they have to scroll before finding anything valuable? Are you making a case for the scroll bar? Or against it? Let us know in the comments.
