what is unbounce
CATEGORY
DID YOU KNOW WE HAVE A PODCAST?

Become a Better Marketer. Anytime, Anywhere.

Listen and learn on the go with Unbounce’s Call to Action marketing podcast. Tune in and get inspired in the car, while you cook, or at the gym.

There is No Fold

There is no fold
I know why you’re here, Neo. I know what you’ve been doing… why you hardly sleep, why you live alone, and why night after night you sit by your computer. You’re looking for the fold. I know because I was once looking for the same thing.

There are some questions that just don’t have simple answers. It’s the question that brought you here. You know the question, just as I did: Where is the fold?

The answer is as difficult to answer as it is to enjoy either of the sequels to the Matrix. But that’s what we’re here for. We answer the tough questions, folks.

The answer is: There is no fold.

This is your last chance. After this, there is no turning back. You exit this page — the story ends, you wake up in your bed and believe whatever you want to believe. You keep reading — you stay in Wonderland and I show you how deep the rabbit-hole goes.

What is the fold?

In the days before the machines took over, folks got their news from something called a newspaper. Perhaps you’ve seen them in old movies. Most newspapers were printed in a format known as broadsheet, which is typically 22 inches high. In order to display newspapers without taking up a ton of room on a newsstand, the papers were folded in half.

The term was later borrowed by web designers. Now “above the fold” is any part of a website or landing page that you can see without having to scroll.

The Matrix: Resolutions

There is no fold. Not in the way there used to be.

Designers used to argue about whether to design for 800×600 or 1024×768. The fold was a static dimension, like on a newspaper.

mjproof1

But things have changed. Chris Goward from WiderFunnel sent us a screenshot that demonstrates the variety of screen sizes that visit his website.

device-size-fold

This is why there is no fold. People access the web on so many different devices with so many different screen sizes now that to design for just one size severely inhibits your ability to create landing page experiences that are both successful and delightful.

the-fold-mobile-responsive

The fold can no longer be defined by a predetermined number of pixels — the fold is defined by the device used to visit your page.

Respond with responsive design

Many landing pages are still stuck in the Matrix, prisoners of a paradigm from the past, existing only to serve the search engine machine overlords.

In other words, people still aren’t optimizing their landing pages for mobile devices.

The only way to respond, the only way to break free of a construct that keeps your landing pages from persuading people to convert is through responsive design.

Here’s a responsive page from GigSalad. On my 27-inch monitor, it looks like this:

Desktop above the fold
Click for full-length image.

Everything I need to know about their offer is right here in front of me. They provide everything I need to make a decision; all the context I need to understand what their product is and why I would use it.

Between this size and a smartphone there are several different breakpoints, but by the time you get down to 320×568 (the screen size of an iPhone 5), you can see that a lot of that real estate has gone. This is when clarity and concision are as important as ever.

smartphone-fold

In the mobile version of the page, GigSalad strips down the page content to a bare minimum: they keep their CTA front-and-center along with a very strong value proposition (they can help you get booked for events near you).

You know exactly what you’re in for when you click that “Get Started” button.

the-fold-call-to-action

But keeping your CTA above the fold on any device isn’t a hard-and-fast rule. As with most rules, there are exceptions.

As Chris Goward says:

The conversation about the fold has often centered around the call to action. Most people have assumed the button needs to be above the fold to maximize your conversion rate.

As always, you’ve got to test different configurations to find the one that will work for your visitors.

What you’re really trying to do is give your visitor the motivation to convert — regardless of the device they’re using. You can get them to click the CTA right away if you have given them the information they need to be motivated to do so.

Free your mind

You are the One. You can remake landing pages to be displayed the right way on any device as you see fit. You can make your copy relevant to your audience and clear enough for them to understand. You can remake the fold to display properly to any reader on any device.

Landing pages are similar to the programmed reality of the internet. They have the same basic rules, rules like clarity. Some of them can be bent. Others can be broken. Understand? Then convince your audience to take action and make use of that very valuable space above the fold — wherever it may be.

As you begin to more fully understand your audience, you can adapt and improvise, making your message even more enticing.

Am I trying to tell you that you can dodge bullets? I’m trying to tell you than when you’re ready, you won’t have to.

Ready to start creating friction-free mobile experiences?

We put together a 12-Point Mobile Landing Page Checklist to keep you on track.



blog cta image
About Mark John Hiemstra
Mark John Hiemstra is a content marketer who formerly worked out of Unbounce’s Montreal office. A writer by day and a reader by night, he is loathe to discuss himself in the third person, but can be persuaded to do so from time to time. Find him on Twitter here: @markjohnh
» More blog posts by
  • I understand your point – and it is a good one – but by your own definition the fold does exist – in the sense that everything a visitor can see is above, everything they cannot is below.

    I used to worry about my ads falling below the fold, and I fully appreciate the argument about CTA’s falling below the fold also – but here’s the thing – there is a counter argument.

    As you rightly say, there has to be something in the initial visible window that will make people scroll below the fold to see what else there is to discover, and I would argue that (with obvious limitations) the further a person is scrolling before they get to your CTA the more qualified they are likely to be once they get there and click.

    If someone has read through your text and is still engaged by the time (and this should, of course, be tested to be the perfect moment) they hit your CTA, they are going to be primed to respond. The quality of that click is likely to significantly outweigh the click that comes from a click above the fold where a visitor is clicking everything and anything they see – maybe even looking for a way off the page…

    I feel the same about my ads. If a visitor is on a page where my ad is displayed below the fold, then a visitor seeing my ad is more likely to be a better prospect since they are more engaged with the page’s content.

    The fold, in and of itself, can become a sort of pre-selector if used carefully.

  • Mark John Hiemstra

    Quite right, Steve. There are any number of possibilities. This is why we always encourage testing to find, not just the spot where the greatest number of clicks happen, but how that translates to actual business further down the line. The quality of a click in different places will be different on every page. Some better above, others below. The fun part of what we do is that we get to let the audience decide, and then adjust to their needs from there.

    Thanks for the great comment!

  • Mark, I agree the traditional idea of the fold is dead or at the very least vastly different. It’s multiplied like those pesky little gremlins from the 80’s when they find water they’re all over the place. You have a very valid point here. As developers and designers and Efficacy people we have to plan and set our media queries and adjust the content delivered. In a 320 vs a 480 vs a 720 etc…. In each version your needs and capability change. at 320 the need or even desire for a slider gives way to other things, you now need a CTA with succinct verbiage and truncated funnel path to the conversion. The fold is gone and now more about the viewer-impact. A tiny slider has virtually no impact. But a smaller better worded CTA can have far better impact. The moral is that you should save the cool stuff for the Desktops and tablets with the smaller screens just get to the point directly as possible. Or more importantly that a super easy half baked solution wont work. You cant have a 32 foot long page to scroll. regardless of how great the lead is, the drill path leads to the conversion.

  • Great Matrix analogies! I get where you are coming from in regards to responsive design and multiple screen sizes, however, when we look at scroll maps across our site, it becomes very apparent there is a “fold” no mater if it is from a desktop device or a mobile one. In general from an ecommerce site perspective, people will not scroll. Of the 100’s of pages on our site, there is only one page where people actually scroll and that is our special offers page. Visitors looking for a “deal” will take the extra effort to scroll. So if your site is something of interest people will scroll, but if they are just casual shoppers they aren’t. Trying to increase conversions is a primary goal of ours, and so we try and keep everything including CTA’s above the fold no matter what device the visitor uses. We have even tested having 2 CTA’s on a particularly long mobile page, one at the top of the page and another at the bottom. When we placed 2 CTA’s on the page it increased our conversions by 4%.

    Like you said, every site is different, so the fun part is for us to discover what will work with our customers.

    Great article!

    • Mark John Hiemstra

      Hi Shawn, thanks for weighing in and providing that info. I think you and I are of the same mind. “The fold can no longer be defined by a predetermined number of pixels — the fold is defined by the device used to visit your page.” Certainly there is still going to be an area that is visible prior to scrolling, but the “take home,” if you will, that I’d like for everyone to come away with is the importance of delivering the message you want them to see first on the device they’re using. Which I think you’ve already come to on your own. Cheers!

    • have you tried putting a scroll arrow on your page – with a word like ‘offers’
      (small down arrow at the bottom of the fold which scrolls down one page worth)

  • I agree on many levels with this. There’s some anecdotal evidence about scrollers vs bouncers as to where the CTA needs to be. But I’m of the belief that the whole idea that you have to put your CTA above the fold basically because people don’t scroll… not even sure that’s true anymore.
    The internet is not some mystery to people anymore. People scroll without thinking.
    The only thing I wonder about is that according to many Google still track scrolling with the time on page measurement as a measure of relevance…
    Just thoughts… not sure where I’m going with this… but like you say… things to test.

  • First off – amazing comparison to the Matrix! Regarding the ‘above the fold’ concept, I would bet 50-50 on it. One, you’re right: ‘the fold’ has changed along with the times and those looking for it will only frustrate themselves. However, it still exists: albeit in a different form. It all depends on one’s perspective as a web designer. I would still suggest A/B testing for the most appropriate CTA placement for maximum effect. For the rest of your web elements, it will be determined by your business goal.

  • I agree that users are now trained to scroll. They scroll quickly and intuitively. My issue with ignoring the fold altogether is the fold is a great exercise to improve your site. The content a user first sees and reads when they visit a site is a crucial first impression. If that content isn’t relevant, valuable and concise they will not even take the time to scroll. The fold is still one of the most important factors when designing a website.

  • wow ty very very good post i need post again good post!!!

  • Ankit Sinha

    It’s ironic that you say that the fold doesn’t exist but the post itself generates curiosity at each fold (checked on a Mac and an iPhone). Every fold is important and if you want your users to continue reading (in case you have a blog) you want them to get a taste of what’s next in each fold to drive customer to the next. The moment you lose the connection or your story telling takes a dip (nothing left to generate curiosity), your customers drop off. You need not have the CTA in the first fold but you need to place it before the user disconnects. Also, understanding your users is very crucial. If you are expecting a traffic of people with shorter session time, make use of the first fold itself.

    Awesomely written! You made me sign up for more!

  • Pakish web hosting provide addon to mobile optimized your html website just one click visit https://pakish.net