UX Best Practices: Destroying the Legend of the Fold


We’ve all heard of it. We’ve all feared it: “The Fold.” What would happen if your content fell below it? For years divisions have spent countless hours literally vying for position, shortening and shrinking each other’s content. Designers have developed new ways to pack more content into the top of the page with mixed results.

I want to demystify the legend of the fold and tell you how to design your sites in a way that doesn’t hinder the content below it. The research we’ve done shows that the propensity for people to view your content is not about screen size; it’s about page design.

Lets start by suspending the idea that people don’t like to scroll, we all scroll everyday without a second thought on websites, PDFs even the apps on our mobile devices. The question is why don’t people scroll on your page? Our research shows 4 key things that cause people not to scroll further on a page:

1. Poor Information Architecture (IA): The purpose of IA as a discipline is to help people understand what information is available and how to get to it. If people don’t expect more content, then they won’t go looking for it.

2. End of the Road Mirage: With various elements on a page, it’s crucial that you only design one that looks like a footer. People don’t fling themselves down a page; they scan their way down when they’re expecting something. When they reach a wide neutral toned rectangle filled with images of sponsor logos, small text links, or dead space, they think that’s the end of the page. No they don’t look at the scroll bar as much as you’d think. It’s the same reason people often don’t notice smoothly docking menus; they’re focused on the task at hand.

3. Lack of visual bleeding: This is a combination of IA and the end of the road mirage. Visual Bleeding is the concept of showing the top portion of the next content above the fold without the rest being visible without scrolling. Users are aided in knowing that there is more information available on the page when they can see it immediately. If they want to see the rest, they will have to scroll for it. Consider using this technique at each major stopgap when scrolling your page in order to draw people down the page.

4. Atypical interactions: This is rare, but occasionally someone will want to use a traditional interaction (in this case scrolling) to do something untraditional on the page. Don’t. Scrolling is a basic function of web navigation second only to left-clicking. If you use the scroll feature to control animations or kick off interactive media the User notices and quickly becomes disoriented and unsure of how to scroll further. Even if the next spin of the wheel would get them what they want, they may not spin it again and seek other ways of getting the information they want.

So you can see, it’s not about screen size it’s about page design. Putting important content above the fold is a good rule of thumb, but by setting expectations and designing appropriately you can ensure that your secondary content gets the traction it deserves.

Want to learn more? Contact our UX office in Atlanta, Georgia.