Don't Fear the Fold: Why the Scrollbar is Your Friend

    Jun 09, 2014 Jessica Jones

    There was a time when web design was very focused on keeping everything “above the fold” - meaning that users would be able to see most if not all of the relevant content of a website without scrolling. Scrolling was considered a negative experience to be avoided, and it was sometimes assumed that users might never see content if they had to scroll in order to get to it.

    fold It’s easy to spot sites that were built during this phase of web design. The most extreme examples have all of the site’s content built into static-sized boxes. Because average screen size and resolution has steadily increased over time, sites built using this model tend to look very small on a modern monitor. If you’ve ever thought a site resembled a postage stamp, you’ll know what I’m talking about. Sites that were built to be small in order to avoid scrolling at all costs don’t just look oddly tiny now - they look dated. Now, to be fair, just about any site built in another decade is going to look dated - but the issue with the “above the fold” concept is that many people are still clinging to it.

    Embrace the Scrollbar. It Worked For Facebook.

    Avoiding scrolling, like making the logo bigger, is a concept that many people have a difficult time letting go of even though it’s generally not the best design choice. Let me make it clear that I’m not saying that the content at the top of your site isn’t important. Of course it is. No matter what sort of layout you’re using, you want your website’s header to be clean, attractive, professional. It’s the first thing people see when they visit your site and you want it to be good - the content/layout that people see first should entice them to continue exploring your site.

    What I am saying is that scrolling is not a bad thing. You’d never try to design a site that didn’t require users to click, and like clicking, scrolling is something that people expect to do when they’re on the internet - something that comes naturally. If you’re not convinced, take a look at the most popular social media sites. Facebook, Twitter, Pinterest: what happens on these sites? People scroll. And scroll. And scroll.

    It’s likely that social media has had a large effect on web design and how users interact with websites, and if users weren’t acclimated to the concept of scrolling already, they certainly are now. Having strong, engaging content up towards the top of your site? Good plan. Feeling as though all of your strong, engaging content must be up at the top? Not so good.

    Don’t constrict your web design or truncate your content in an attempt to avoid the scrollbar. Another reason that trying to keep all of your content above the fold is an outdated concept is illustrated very well by this post on medium.com which asks the question “Which fold?” As the graphics on this post demonstrate, the variance in screen sizes - from mobile devices to desktops - is enormous, and every screen size has a different “fold.” Trying to determine what will fall above a fold that is different on every model of device, from desktop monitors to smartphones, is an exercise in futility.

    Web Design is Getting Big. Literally.

    You may have noticed that websites seem to be getting bigger. As computers and devices get more powerful and average screen resolution continues to improve, the design world is taking advantage of the opportunity. One big trend that’s cropped up in the past year or two is the use of parallax scrolling - a design technique that has scrollbar use built right into the name! For an example of this, take a look at one of our recently released premium sites: Tag Resources. If you scroll down through this site, you’ll notice that different segments of the site scroll at different rates.

    Even when not using the parallax design style, you’ll see a lot of websites trending towards the big look - large, high resolution images, big fonts, chunky segments, and no fear of scrolling. Take a look at Starbucks, Android, Urban Outfitters and NatureBox.

    I’m certainly not saying that your website has to fit this design style in order to be relevant. The look and functionality of your website should meet your business’s specific feel and needs, and suit your particular target audience. But even if your site has a more traditional or subdued layout, it’s important that you don’t approach it with restrictive layout concepts.

    The Fold and Your SEO

    Another factor to keep in mind is that your content is your most valuable resource for building up strong SEO, and if you’re determined to keep your content short in order to avoid scrolling, you’re doing your website a disservice. Google uses your content to index your site, and more importantly, your users come to your website for your content. If you cut down the information you’re presenting for no other reason than to take up less space on the page, no one benefits.

    “Go Big or Go Home” is a Little Extreme … But Don’t Go Small.

    The take-home message: your site doesn’t have to be full of huge images and parallax scrolling in order to be effective. There are many different approaches to designing a good website, and there’s no requirement to fall in line with any one particular design trend. Even if your site isn’t big big BIG, however, be aware that most sites - particularly sites that are rich in content, which is the most important goal to shoot for - will make use of the scrollbar. Don’t fear it. The scrollbar is your friend. The scrollbar wants to help you. Embrace the scrollbar.

    More On This Topic