Beefree blog

Top Tips for Best Call to Action Button Design

Beefree team
Beefree team
Aug 17, 2020
Top Tips for Best Call to Action Button Design
Top Tips for Best Call to Action Button Design

Your call to action is probably the whole reason you send marketing emails: You want your readers to actually do something. Whether signing up for an event, downloading an ebook or purchasing a product, the action you have in mind is probably the driving force behind your whole email campaign. So it's critical that your CTA button really brings it home. Messing up your CTA is like putting a mouth-watering steak in front of readers but failing to give them a fork.How can you optimize your call to action button design and boost your conversions? Let's walk through some call to action examples so you can create your own stellar CTA.

Messing up your CTA is like putting a mouth-watering steak in front of readers but failing to give them a fork. So it's critical that your CTA button really brings it home.

Craft strong call to action button text

Good call to action button design will showcase the email's value proposition in a way that's clear, specific and concise — so readers understand exactly what they're getting by clicking. Here's a good example from Wilton Icing:

call to action button in email

The button makes it clear what will happen if you click — you'll be able to view a guide. The text on your CTA button shouldn't be too short or too long. Three to four words is a good rule of thumb. Think "Download your free ebook" instead of "Click to register for our special ebook deal today." Here's a good example from Lunya:

email call to action button text

Good CTAs are customized, unique, and they reflect the tone of the brand. "Click here," "Register," "Learn more" and "Sign up" are overused and generic; stay away from those if you can. Instead, use personal pronouns like “my” and “your” to set a friendly tone and make a CTA engaging and approachable. Charity:water, a nonprofit bringing clean drinking water to people in developing countries, uses a unique CTA that reflects their brand voice and mission:

Screen Shot 2015-11-18 at 2.06.47 PM

Here are some others to try:

  • Reserve my spot
  • Redeem my coupon now
  • Get my free ticket
  • Pre-order yours
  • Claim your seat
  • Get the full scoop

Now that we’ve covered what your email marketing call to action should say, let’s talk about what it should look like.

Tips for call to action button design

Buttons come in all shapes and sizes — some more effective than others. Here's what you need to keep in mind when designing the perfect CTA button.

Remember to make it bulletproof

CTA buttons in email are generally designed one of two ways: with HTML code or with an image. Your buttons should always be written in HTML. Buttons written in HTML — also known as bulletproof buttons — will render across all inboxes, ensuring that all of your customers can see them. You can either make a standard CTA button bulletproof by adding a few lines of HTML code or check that the email editor that you’re using generates bulletproof buttons (and that those buttons are not simply images).The problem with image buttons is that you have much less control of how the image looks across devices (and if it will show up at all). For subscribers who have images disabled, your button won’t show up at all. And no button means no clicks.Here's the Wilton Icing email we looked at above, but with image-viewing disabled. Their bulletproof button still shows up:

cta button

In another email from Lord & Taylor, their "Shop shoes" and "Shop handbag" buttons look great with images on...

Screen Shot 2015-11-18 at 3.14.14 PM

...but check out how those same buttons evaporate when we aren't viewing images:

Screen Shot 2015-11-18 at 3.14.42 PM

Avoid this kind of situation by making sure your CTA buttons are completely bulletproof.

Pick your call to action button size

How big should your CTA button be? You might be tempted to go big to make it visible — but bigger isn’t always better. Readers shouldn't feel like you’re shoving a demand in their faces. Strike a balance by making your button wide if it’s not too tall, or by making it a little taller if it’s not too wide.Check out how REI’s CTA button appears in this email. It feels balanced, with the width of the image, the width of the text and the width of the button creating an inverted triangle effect.

call to action example ecommerce

Alternatively, this one from the Getty Museum is a bit over-the-top. The height of the button is in balance with the header (the word "SHOP" is quite tall), but having two lines of text for the button makes it unwieldy, and with a quick scan, it's hard to tell if the button is a button at all.

Screen Shot 2015-11-18 at 3.29.23 PM

It's also important to remember that readers on mobile devices or tablets should be able to easily tap a button with a fingertip, so best practice is to allow ample white space around your button. Here's an example of effective use of whitespace in a message from Melissa & Doug:

mobile email call to action

Including whitespace makes it easy for people to tap.

Choose the best call to action button color

Color is a key way to make your button stand out. Most brands choose a button color that's on-brand and lines up with the design of the email. Often, the button echoes the header design in color (if not also in width or tone). Here's how Zoe’s Kitchen uses the same bright orange color of its logo for an email call to action button:

email branding

Other brands rely on a button's border for definition, like this example from Partake Cookies:

email call to action button example

Keep things simple with your color gradients. The best choice is often an on-brand background color or border that helps your CTA button stand out in a good way.

Decide on a shape

From a design perspective, rectangular elements generally connote a sense of traditionalism, practicality and balance. Circular elements can be perceived as soft and calming. Like color, the shape of your button should align with your brand style as well as the design of your email. An email with square and rectangular images or design elements would probably do better with a button that mirrors that style, like this example from The North Face:

email call to action example

And here's how Quip, a toothbrush company, softens the edges of its button to match the circles pictured in the product photo above:

email marketing call to action

These are a few call to action button best practices that can help your button be as effective as possible.

Consider your call to action button placement

Many of the emails in this post follow the best practice of communicating a clear, single message that leads to a clear, single call to action. Research has shown that placing a CTA button below the fold actually increases clicks by 304%! The important thing is to let readers know what they’re signing up for first — with great copy and visuals — and then invite them to act.We’re also seeing a lot of emails in our inbox with multiple CTA buttons. Many of these emails, like the example from Lucky Brand below, have their main CTA halfway through the email. Then they list several specific products, adding a separate CTA button for each one.

marketing email

If you’re sending browse or cart abandonment emails, it can be helpful to give customers a specific CTA button for each product they’ve previously considered.

Your call to action button design checklist 

There are as many button styles out there as there are emails. Take note of how the brands you admire are designing their CTAs and test the effectiveness of different button styles to see what works best with your audience. Remember these rules of thumb for your call to action button design:

  • Write action-oriented, compelling and unique copy for your button
  • Keep the copy direct and clear, making sure readers know exactly why they're clicking
  • Make sure your button is bulletproof (written in HTML so it always renders)
  • Check that your button "pops" (stands out visually)
  • Consider your visual brand identity and the style of your email when choosing a button's color and shape
  • Place your button in an easy-to-find spot that fits organically in the story of your email (probably below the fold)

Wrap-up: Create an email call to action with BEE 

If you build your CTA button in theBEE email editor, your button will always be bulletproof and totally customizable (color, shape, size, border, padding and more). Give the free BEE editor a try as you create strong call to action buttons for your brand!

Share this post with your friends! Pin it on Pinterest ?

Call to Action Button Design Pinterest Cover

Related posts

Using Beefree with Marketo Engage 101

Learn how integrating Beefree with Marketo Engage can help you build high-converting, on-brand email campaigns— faster.
Luca Penati
Apr 4, 2025

What Are Email Security Gateways? A Guide to Secure Communications

Are your newsletters being marked as spam? Discover all you need to know about email security gateways and how to create emails that pass all the checks.
Beefree team
Mar 12, 2025

Getting Started with Beefree: A Guide to Streamlined Email and Landing Page Creation

Whether you're designing a newsletter, promoting an event, or driving a marketing campaign, ensuring that your emails and landing pages are visually appealing, engaging, and efficient to produce is no small task. That’s where Beefree comes in.
Beefree team
Feb 26, 2025

Using Beefree with Marketo Engage 101

Learn how integrating Beefree with Marketo Engage can help you build high-converting, on-brand email campaigns— faster.
Luca Penati
Luca Penati
4 Apr
2025

Marketo Engage is a powerful tool for marketing automation, but when it comes to email design flexibility, many users find its built-in editor limiting. Creating visually compelling, mobile-responsive emails often requires custom coding or workarounds, slowing down workflow and making it harder to execute high-quality campaigns efficiently.

That is where Beefree comes in. By integrating Beefree’s no-code, drag-and-drop email design platform with Marketo Engage’s advanced automation capabilities, teams can build professional, responsive emails without coding headaches and push them directly to Marketo in just a few clicks.

This article explores:

  • The challenges of designing emails directly in Marketo
  • How Beefree solves these pain points
  • A step-by-step guide to integrating Beefree with Marketo Engage
  • Common FAQs and troubleshooting tips

The challenges of designing emails directly in Marketo

Marketo’s built-in email editor is useful for basic templates but presents several limitations for marketers and designers.

  • Limited design flexibility – Customizing layouts, fonts, or interactive elements can be difficult without custom HTML or Marketo’s proprietary syntax.
  • Technical barriers – Advanced customizations often require HTML knowledge or an understanding of Marketo’s email template language, which may not be ideal for non-technical teams.
  • Time-consuming manual processes – Without a centralized style kit, teams may struggle to stay on-brand and often have to manually recreate headers, footers, and other reusable content blocks for each email, adding extra steps and slowing down production.

Due to these challenges, many marketing teams turn to external email builders like Beefree, FeedOtter, or Knak to improve design efficiency and automation.

(source)

Why Beefree is the best email builder for Marketo Engage

While other external email builders like Knak and FeedOtter also integrate with Marketo, Beefree offers distinct advantages.

  • No-code drag-and-drop builder – Enables teams to design professional emails without writing any code.
  • Advanced design features – Provides more customization options beyond what Marketo’s built-in editor allows.
  • Mobile-responsive templates – Ensures emails adjust automatically for both desktop and mobile devices.
  • One-click export to Marketo – Simplifies the process of moving email designs directly into Marketo Engage.
  • Ability to update existing templates – Allows quick updates without requiring manual re-imports of HTML files.
  • Team collaboration – Enables teams to work together in real time, with built-in guardrails and approval controls to ensure error-free emails before exporting.

By integrating Beefree with Marketo, marketing teams eliminate design frustrations and manual email imports, allowing them to focus on high-performing email campaigns.

Learn more about Beefree's integration with Marketo Enagage [https://support.beefree.io/hc/en-us/articles/24837761625618-Export-Emails-to-Marketo]

(source)

How to update existing email templates in Marketo

Instead of manually editing HTML, Beefree allows users to edit emails in Beefree and update existing ones in Marketo Engage with one click.

  1. Open the email design in Beefree.
  2. Make changes and click “Export.”
  3. Select “Update Existing” to overwrite the previous version in Marketo Engage.

This feature ensures that emails and templates remain up to date without requiring complex HTML edits or duplicates.

(source)

Frequently asked questions on using Beefree with Marketo Engage

Can I use Beefree with other ESPs besides Marketo Engage?

Yes! You can connect Beefree to any ESP, MAP, or CRM including Mailchimp, HubSpot, Salesforce Marketing Cloud, and others. To learn more about how to integrate Beefree to your sending platform watch the video below: 

For a full list of our native integrations visit [https://beefree.io/integrations].

Are there any limitations when exporting Beefree emails to Marketo?

Yes, there are a few important limitations to be aware of:

  • Charset emojis are not supported in Marketo. Including emojis in your email content may result in an error. To prevent this, Beefree automatically replaces unsupported emojis with a placeholder. For more details, refer to the [Marketo documentation on emoji support].

Preheader text is not a native field in Marketo. However, Beefree includes it by embedding the preheader directly in the email's HTML code during export.

Additional resources and links

Why you should use Beefree with Marketo Engage

By integrating Beefree with Marketo Engage, marketing teams gain a faster, more flexible way to build high-converting, on-brand email campaigns—while leveraging Marketo’s powerful automation and analytics to track performance and optimize results.

  • Design responsive, professional emails with ease.
  • Maintain brand consistency across every message.
  • Collaborate efficiently and gain insights to improve campaign performance.

Ready to elevate your Marketo email marketing? Try Beefree today and streamline your entire email creation process.

Start your 15-day free Business trial today!

(source)

What Are Email Security Gateways? A Guide to Secure Communications

Are your newsletters being marked as spam? Discover all you need to know about email security gateways and how to create emails that pass all the checks.
Beefree team
Beefree team
12 Mar
2025

Email is king when it comes to talking directly to your customers. Sure, we might send texts or share voice notes, but we all still check our emails. It’s how we keep in touch with work and the businesses we connect with. 

As an email marketer, this puts you in prime position to get your business’s brand right into the hands of your customers. The problem, however, is that you must first get past the metaphorical guard dog known as the secure email gateway (SEG). 

SEGs use sophisticated methods to identify and block spam and phishing emails from ever entering a person’s inbox. While your email newsletters should go through, that doesn’t necessarily mean they will. That’s why businesses need to know what a secure email gateway is and how it works. Know this key info, and you’ll be able to improve the chances of your emails reaching their destination. 

What are email security gateways? 

Protecting yourself from cyber threats is the basis of all cybersecurity risk assessment services. One of the biggest gaps in any security armor is phishing emails. If they get through and someone clicks a link they shouldn’t have, it’s almost impossible to stop the damage. 

The victim could be anyone. The link could lead to a ransomware virus that holds your data captive or be the start of a data breach. It could even lead to a traditional scam that has you input your credit card details so a thief can steal them. 

For all these reasons and more, email providers consistently invest in security features to help protect their customers. One such feature is an email security gateway. 

A secure email gateway uses AI and machine learning to screen incoming emails, identify spam, and stop it from entering. If there’s any doubt, the system quarantines the email in your spam box for review. 

Why are secure email gateways important?

While we are getting better at filtering out spam emails, an estimated 45.6% of emails sent in 2023 were still spam. This poses a massive security risk for consumers, businesses, and governments alike. 

According to IBM, businesses are hit the hardest, with the global average cost of each successful phishing attack increasing to $4.88M USD. The attacks don’t just hit businesses, either, with attacks targeting individuals and even charities.

Just as phishing and spam emails have become more sophisticated, so have the tools designed to protect against them. All providers, including big names like Gmail, use SEGs to secure communications and other features, such as Gmail’s unsubscribe feature

What do SEGs flag as spam? 

SEGs continually update their parameters. This means that what they check for is constantly in flux. What SEGs look for today, for example, could include: 

  • Strange or suspicious subject lines
  • Highly urgent capitalization or excessive exclamation points
  • Strange URLs
  • Poor grammar and/or spelling
  • Generic greetings that don’t address the recipient 
  • Suspicious email addresses
  • The volume of emails sent at once
  • Attachment types 
  • Image-heavy content 

SEGs are far more advanced than just ticking boxes, but that doesn’t mean your emails can’t get blocked or sent to spam. After all, you might put together a great email campaign, but if your email is too image-heavy, it might get quarantined or sent to spam. 

The good news is that once you know what the SEGs look for, you can work to design better emails. Beefree can help you get started, with a range of templates for responsive email designs.

How to create newsletters with secure email gateways in mind 

The good news is that you can implement and send out most, if not all, of your newsletter ideas without issue. So long as the emails are well-made and are sent at a reasonable frequency, you’ll be golden. 

Start by first improving your security methods

In general, you should always look at ramping up the security measures in your business. You can use one of the top types of risk assessment matrix to understand your business's threats and how to resolve them. Then, since you already have that information, you can use it to create better newsletters and emails. 

Make sure the personalization feature works

One of the biggest red flags for an SEG is a generic greeting. Adding Dear Sir/Madam at the start isn’t going to fly in today’s world. Even if your email gets through, it’s unlikely the recipient will open it. 

That’s why you need personalization. Linking your email marketing tools to your customer relationship management system means you can offer easy personalization, like addressing your customers by name, or even offering personalized recommendations based on their order history. 

Avoid image-only emails 

Image-only emails are tempting for an email marketer. They’re striking, they look good, and you can fine-tune what they look like in Photoshop or another image editor. 

They can also be a red flag for SEGs.

Thankfully, the solution is simple: enrich your emails. The best part about this approach is that it also improves the accessibility. Improving email accessibility will help ensure that all your customers can engage with your emails on their terms. Those emails will also load faster, look great on all devices, and be more engaging. 

Align your emails with the landing pages 

SEGs look out for suspicious links. A link might be suspicious if there’s a misspelling or if the link doesn’t sound like the content in the email. So, how do you ensure that SEGs don’t see any of your links as suspicious? 

You make them predictable. 

An easy way to do this is to create a landing page from an email. On top of aligning the landing page with the content of the newsletter, you’ll want to: 

  • Make a custom URL for every link that matches the content of the page 
  • Ensure there’s no misspelling
  • Don’t use urgent language around your link

Use 2FA to boost security

Do you need 2FA to get past SEGs? No, but it’s a great way to help protect you and your customers. 

You can protect sensitive data by adding user identity verification. For example, a customer may get an order confirmation email but wants to cancel or change the delivery details. Including a two-factor authentication step ensures only the customer can request changes. 

Building in extra security features puts your customers at ease. It also protects your endpoints and, in turn, your business. So, no, you don’t need 2FA to get past SEGs, but it’s worth looking into for you and your customers’ protection. 

Avoid urgency 

Urgency can be a flag for SEGs. So: 

  • DON’T WRITE IN ALL CAPS
  • Minimize the use of exclamation points

Think of the copy in your newsletter as a chance to win over your audience, not scare them into clicking the link. Doing this will improve your relationship with your customers since they’ve come to you on their terms. It’s also essential to get emails past the SEG.

Key takeaways 

Secure email gateways are a primary defense against spam and phishing attacks, but they can pose a problem for email marketers. By working to understand the security risks associated with email scams, you can then understand what your email needs to make it into inboxes. 

From there, you’ll want to make your emails more personable, accessible, and secure. Once you’ve found that sweet spot, your newsletters will be more likely to get past the secure email gateway and into your audience’s inboxes. 

Stay informed on all email trends

From the latest creative design strategies that inspire your next campaign to industry best practices and tech advancements, our newsletter is the go-to for all things creation.

Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.
By clicking Subscribe you're agreeing with our Privacy Policy
Beelo here 👋 Got questions?
1