Why should I avoid using images for CTA buttons in email marketing?
Michael Ko
Co-founder & CEO, Suped
Published 28 Apr 2025
Updated 16 Aug 2025
7 min read
Email marketing relies heavily on effective calls-to-action (CTAs) to drive engagement and conversions. It might seem intuitive to use images for these crucial buttons, especially when aiming for a consistent visual design across various email clients. However, this common practice can significantly undermine your email campaign's performance and deliverability.
The primary goal of a CTA is to be seen and clicked. When a CTA is an image, it introduces a range of potential issues, from visibility problems due to image blocking to accessibility concerns for users with visual impairments. These factors can lead to missed opportunities, decreased click-through rates, and a frustrating experience for your subscribers.
I've seen many marketers fall into this trap, only to wonder why their engagement metrics are plummeting. The illusion of a visually perfect button across all platforms often hides underlying problems that severely impact email performance. Let's delve into the core reasons why image-based CTA buttons should be avoided in email marketing.
Image blocking and deliverability risks
Many email clients, including those used in business environments like Outlook, block images by default. This is a common security and privacy measure, as images can sometimes be used to track user activity or deliver malicious content. When images are blocked, your beautifully designed CTA button simply won't appear, leaving a blank space or a broken image icon in its place.
This leads to a complete loss of the call-to-action. If your main objective is to drive a click, and the button isn't visible, recipients cannot act. Even if you include alt text, it's often small and easily overlooked, failing to convey the urgency or purpose of the button effectively. This significantly impacts your email click-through rate. Research indicates that a significant percentage of email clients block images by default, making image-only CTAs a high-risk choice for email marketers, as highlighted by Email on Acid.
Beyond mere visibility, image-based CTAs can also contribute to your emails landing in the spam folder. Email service providers (ESPs) and spam filters analyze the ratio of images to text in your emails. An email composed primarily of images, including image-based CTAs, can appear suspicious to filters, as this is a tactic often used by spammers to bypass text-based content analysis. This can negatively impact your email deliverability, increasing the likelihood of your legitimate emails being flagged as spam. Understanding how image blocking works is crucial.
Accessibility and user experience
Accessibility is a critical consideration in modern email marketing. Users with visual impairments often rely on screen readers to interpret email content. When a CTA is an image, screen readers cannot properly interpret the text within the image unless robust alt text is provided. Even then, the experience is not as seamless as with a native HTML button.
Without proper alt text, users might not understand the purpose of the button or even realize a clickable element exists. This excludes a segment of your audience and can lead to a frustrating experience. An accessible email ensures that everyone, regardless of their abilities or how they interact with their email client, can understand and engage with your message. Accessibility best practices emphasize that text over images for CTAs is vital for screen readers.
Furthermore, HTML buttons are inherently more responsive across different devices and screen sizes. Images, especially those not optimized for email, can break or scale incorrectly, leading to distorted or unusable buttons on mobile devices. This directly affects user experience, as a significant portion of email opens occur on mobile phones.
A non-responsive CTA button can make it difficult for users to tap, resulting in accidental clicks or complete abandonment of the call to action. The goal is to make it as easy as possible for users to convert, and responsive design is a cornerstone of that principle.
Image CTAs
Visibility issues: Prone to image blocking by email clients, rendering the CTA invisible. Often appears as a broken image icon.
Accessibility: Poor compatibility with screen readers unless meticulously implemented with alt text. Cannot be easily navigated by keyboard users.
Deliverability: Higher risk of triggering spam filters due to a poor image to text ratio.
Responsiveness: Can scale poorly or break on various screen sizes, especially mobile devices.
Performance and responsiveness
Images inherently have larger file sizes than plain HTML text and CSS. This means that emails with image-based CTAs will take longer to load, especially for recipients on slower internet connections or those with limited data plans. In today's fast-paced digital environment, slow loading times can lead to immediate abandonment.
If a user has to wait for an image to load before they can even see your CTA, they might just close the email and move on. This negatively impacts not just your clicks, but also the overall impression of your brand. Remember, first impressions matter, and a sluggish email can deter engagement. This is one of the reasons why large images in email marketing should be avoided.
Furthermore, HTML and CSS allow for much greater flexibility and control over the design and behavior of your buttons. You can easily create bulletproof buttons that render consistently across most email clients, including older versions of Microsoft Outlook, without relying on images. This ensures your CTA is always visible and functional, regardless of the recipient's email client settings or device capabilities. This is especially true for image-only emails in general.
Better alternatives to image CTAs
The best alternative to an image-based CTA is a bulletproof HTML button. These buttons are crafted using HTML and CSS, ensuring they render correctly even when images are blocked. They offer superior accessibility, faster loading times, and consistent rendering across a wide range of email clients.
Here’s a basic example of how a bulletproof HTML button can be structured:
This code snippet combines standard HTML/CSS for modern clients with VML (Vector Markup Language) for older Outlook versions. This ensures your button appears consistently and functions correctly for almost all recipients, bolstering your email deliverability.
Views from the trenches
Best practices
Always use bulletproof HTML/CSS buttons for CTAs to ensure maximum visibility and functionality across all email clients and devices.
Provide clear and concise alt text for any images used in your email, including those that might appear near your CTA.
Test your emails across various email clients and devices to catch any rendering issues before sending.
Ensure your email's text-to-image ratio is balanced to avoid spam filters and improve deliverability.
Place your primary CTA prominently within the email's content, preferably above the fold, to maximize visibility.
Consider accessibility standards by using sufficient contrast for button colors and readable font sizes.
Common pitfalls
Relying solely on image-based CTAs, which can be blocked by default in many email clients.
Neglecting to include alt text for images, making content inaccessible to screen readers.
Using overly large image files that slow down email loading times and frustrate recipients.
Designing CTAs that are not responsive and break on mobile devices, hindering user experience.
Ignoring the text-to-image ratio, which can lead to emails being flagged as spam or blocklisted.
Placing CTAs too low in the email or making them too subtle, resulting in missed engagement opportunities.
Expert tips
Implement a strong plain-text version of your email. Many email clients default to this if HTML fails or is blocked.
Regularly monitor your email deliverability and sender reputation metrics to identify and address issues promptly.
Utilize DMARC reporting to gain insights into how your emails are performing across different providers.
Segment your audience and tailor your email content, including CTA design, to their specific client preferences.
Prioritize user experience over purely aesthetic considerations, as functionality drives conversions.
Keep your CTA language clear and actionable, regardless of its visual presentation.
Marketer view
Marketer from Email Geeks says: An organization experienced lowered engagement after switching to image-based CTA buttons, likely due to image blocking and the absence of alt text.
2023-05-19 - Email Geeks
Marketer view
Marketer from Email Geeks says: They were looking for recent studies on the percentage of users who have images turned off in their email clients, as they were encountering a similar issue.
2023-06-01 - Email Geeks
Optimizing your call-to-action strategy
While image-based CTA buttons might seem like a straightforward way to control visual consistency, they introduce significant risks to your email marketing efforts. From visibility issues caused by image blocking to accessibility barriers and performance drawbacks, the cons far outweigh the perceived pros.
Prioritizing functionality and accessibility by using bulletproof HTML buttons ensures that your crucial calls-to-action are always visible, clickable, and effective for every recipient. This approach not only safeguards your email deliverability but also enhances the overall user experience, leading to better engagement and higher conversion rates.
By adopting these best practices, you can ensure your email campaigns are not only visually appealing but also highly effective and inclusive for all your subscribers.