CTA Buttons: Below or Above the Fold?

In Design
newspapers above the fold seafoam

Photo courtesy of Flickr user Jon S.

For some time, there has been debate among those in the digital marketing and design sphere. Their argument: where should you place calls to action on your landing pages for maximum exposure and click through rates?

A long standing theory has been that you need to place your CTA “above the fold”, so to speak. What does that mean? The phrase “above the fold” didn’t always apply to websites! It originated in the days of newspapers, when people would receive them folded in half. Because they were folded, you would only see the top half of the newspaper at first glance, which is where editors would stick all of their powerful headlines and attention grabbing stories. They’d entice you with their best articles to get you to buy the newspaper. After doing so, you’d then have access to the other stories (which may still be interesting and pertinent, but not as eye grabbing as the above the fold content).

Should CTA buttons on landing pages stay above the fold?

According to Michael Aagaard at ContentVerve, it isn’t necessarily true that an effective call to action needs to stay above the fold! He wrote about 10 different case studies and found clear examples where having a CTA at the bottom of a very long landing page led to a 304% increase in conversions. He notes, however, that the location of the CTA wasn’t the only motivating factor for better performance. It can never be that simple, right?

What we need to keep in mind when working with our own landing pages is that humans are visual creatures with short attention spans. In our consumer decision making process, we place a lot of emphasis on things like easily identifiable logos, and the colors of buttons. If we like what we see, we’re more inclined to read the copy (and maybe even click a button). This is where good copywriting comes into play—if you’re using a generic phrase for your CTA, such as “Download” or “Buy”, don’t expect customers to come flocking in! You need to understand who your customer is and where they’re coming from, and then craft a compelling message that feels more personable.

Some other factors to consider

Menard Construction below the fold example

One of our clients, Menard Construction, with a CTA button below the fold.

-The size of your button. Too small, and no one will see it. Too large, and you’ll seem pushy. Remember that bigger is generally better, just don’t go overboard with it. A good way to test this is to take a screen shot of your entire page, place it into a graphic editor like Photoshop, and then apply a 5 pixel blur to it. Once applied, you should still be able to make out key elements of your page—headers, company logo, and call to action. If the CTA isn’t easily visible, you should consider increasing the size of it.

-The shape of your button. Continuity is especially important in call to action design. If your site uses a certain color scheme (say soft, cool colors), it probably wouldn’t make sense to give your buttons a hot pink color that break the overall design and feel of the site.

At the end of the day, your CTA should be able to stand on its own, regardless of whether it is above the fold, or below! These important design elements (and your copy) will be the determining factors in getting users to click.

Recent Posts