5 CTA Button Design Best Practices

Take a close look at your call to action (CTA), particularly the design of the CTA button. It’s an element that many designers do not give enough attention, but they are one of the most important elements to consider. If you get them right, your results will improve.

The Art & Science of Writing Calls to ActionYou’ve designed the perfect landing page, product page, email or home page. Are they converting leads, sales or generating incoming traffic? Could they work harder?

You need to ask questions like these every time you review the results of your marketing efforts.

One way you may be able to improve these results: Take a close look at your call to action (CTA), particularly the design of the CTA button. It’s an element that many designers do not give enough attention.

Unfortunately, there’s no universal template or design style that works across the board. What works for one email or landing page site may not work for you.

But there are some elements that have been tested which may be able to help you improve your results. The key word here is “tested.” I present this information for you to consider, but like anything, test everything as it relates to your CTA buttons.

After all, there are a many factors that contribute to improving results. CTA buttons are just one ingredient among many. Effective web pages and emails don’t depend on the CTA button alone, but upon a lot of factors, both in the realms of design and copy. If you get them right, your results will improve.

Parts of a Button
There are two parts to a CTA button — the design of the button itself and the copy within the button. Both have a critical role to play.

Button design is all about directing a viewers eye and answering the question: Where should I click?” Button copy, on the other hand, answers the question: “Why should I click this button?”

I’m going to focus more on the design aspect of CTA buttons, but you need to think clearly about these as a team and they must work together.

1. It’s a Button
Pay attention to convention. No need to reinvent the wheel here — CTA buttons are buttons. Make it clear that it is a button. The call to action is so important, you should not attempt to make anything but a plain button. It can be different shapes, but remember, it must clearly be a button.Try It Today CTA ButtonSave My Seat CTA ButtonSubscribe CTA Button

Join Now CTA Button2. Make It Stand Out
Contrast and position are the key words here. No matter how wonderful your product, your information or your offer, if your CTA is not easy to find it’ll be lost. The two things to do:

• Use contrasting colors: I’ve read that green and orange work better, but in reality there’s no magic color that works better than another. Every page, email and site are different, and testing your button color is critical.

Critical Mention website
Example of good contrast
Evernote website
Example of poor contrast

• Place in an obvious place: This may seem logical and obvious, but you’d be surprised how many times people place their buttons poorly. Even though your button my have contrasting color, if you place in the wrong place, it’ll be difficult to find. Even Apple makes this mistake.

Hubspot CTA
Example of good call-to-action button placement
Apple CTA
Example of poor call-to-action button placement

3. Make Your Copy Active
Many designers don’t pay much attention to the copy on a button. That’s a big mistake. Making your button say more than:


can make a dramatic difference.

Author: Patrick Fultz

Patrick Fultz is the President/CCO of DM Creative Group, a creative marketing firm producing work across all media. He’s an art-side creative, marketing strategist, designer and lover of all things type. His credentials include a degree from Parsons School of Design with 15 years of teaching at his alma mater, over 40 industry creative awards, and he previously served as President of the John Caples International Awards. Always an innovator, Fultz was credited with creating the first 4-color variable data direct mail piece ever produced. He continues to look for innovative ways to tap the powerful synergy of direct mail, the web, digital and social media.

5 thoughts on “5 CTA Button Design Best Practices”

Leave a Reply

Your email address will not be published. Required fields are marked *