If you’ve studied web design, you’ve probably heard at least one designer’s battle cry against “the fold.” And if you’ve delved into anything design-related having to do with conversion rate optimization or internet marketing, you’ve probably heard that the fold is critical and must be honored in your design.
Ultimately, the vast majority of designers who discuss the fold are taking different approaches to the same conclusion: the fold is important, but working with it looks very different now than it used to.
What’s the fold, anyway?
“The fold” comes from the newspaper world, and it refers to the top half of the front page — the part of the paper that appears above where the physical paper is folded. That’s where the most compelling headlines go, as well as (usually) some or most of the front-page photo.
For websites, the fold refers to the part of the website that is visible when the page first loads, before the viewer does any scrolling.
In the early days of the web, monitor size and resolution were fairly consistent at 15 inches. Because of that, most websites were designed to incorporate “the fold” in the top 600px. That’s what just about everybody saw, consistently. Monitor size was somewhat standard, so the concept of “the fold” was still applicable to web design.
Why doesn’t the fold matter anymore?
People have been talking about “the death of the fold” since about 2010, not long after the radical explosion of internet-connected smartphones. By then, people were accessing the internet on anything from a 60-inch wall-mounted television monitor to a tiny hand-held device, with every dimension of laptop and computer screen in between.
Long gone are the days when everyone used the same monitor with the same resolution. Now websites are being viewed at many different resolutions, running different operating systems, using any of several different browsers, and even viewing in different page orientations thanks to tablets’ ability to display in both landscape and portrait.
To get a sense of what the traditional web design fold is, check out Life, Below 600px. And if you’re curious about where the fold is on any given website with various monitor sizes, check out Where Is the Fold.
How do I design if it’s not for the fold?
“The fold still exists and still applies,” writes Amy Schade for Neilsen Norman Group, but it’s not what it used to be. There’s no way to anticipate what resolution and window size will be used to view the site, so there’s no true “fold” to identify.
Instead of using the fold as the guidepost, design for the user. Ultimately your design needs to convince the website viewer to scroll, so the idea of the fold still matters even if the specific dimensions of a “fold” can’t be determined. Instead of looking for a fold, take into account what designer Sophie Shepherd calls “the hierarchy of the content on a page,” and understand that the most important material should go at the top.
As you plan your design, determine what your “above the fold” material is and then place it at the top of the page. Most viewers will still see it, even if they need to scroll a bit to see all of it. Scrolling isn’t the hurdle some people make it out to be, but if this is a new concept for you, check out these 3 ways to design to encourage scrolling. Ultimately you can use the idea of “storytelling” in web design to lure the reader in at the beginning (the top) and keep drawing attention further down the page.
Final thoughts on the fold and web design
While there seems to be a lot of conflicting advice about designing for the fold and what that should or shouldn’t entail, one thing is certain: the fold today isn’t what it was 20 years ago, and design best practices need to take into account today’s users with today’s technologies, needs, and expectations.
The most important or compelling content still needs to go at the top, but incorporate good design principles rather than sticking to a rigid guide. In fact, good, effective design is the root of every good piece of web design advice, no matter if you’re ready to shout “death to the fold!” or “the fold is forever!”
What do you think? How important is fold to web design?