Summary
Relying solely on images for CTA buttons in email marketing presents several challenges. Many email clients block images by default, hindering visibility and reducing click-through rates, especially among a significant portion of B2B users on Outlook. Accessibility is a major concern, as images without alt text are unusable by screen readers, violating accessibility guidelines. Furthermore, images may render inconsistently across email clients and devices. Using excessive images, including image-based CTAs, can also increase the likelihood of emails being flagged as spam. In contrast, text-based CTAs ensure consistent display, easier brand maintenance, and support features like Dynamic Type for text scaling. Utilizing semantic HTML elements like `<button>` offers built-in accessibility. Avoiding exclusive reliance on images for CTAs can help maintain accessibility and also improve conversion rates.
Key findings
- Image Blocking: Many email clients block images by default, making image-based CTAs invisible unless the user enables them.
- Accessibility Issues: Image-based CTAs without proper alt text are inaccessible to visually impaired users using screen readers.
- Rendering Inconsistencies: Images can render differently across email clients and devices, potentially breaking or distorting CTAs.
- Spam Risk: Emails with a high image-to-text ratio are more likely to be flagged as spam.
- Brand Maintenance: Text-based CTAs are easier to style and maintain brand consistency.
- Lower Conversion Rates: Image blocking can lead to decreased conversion rates.
Key considerations
- Implement Alt Text: Always include descriptive alt text for images used in CTAs.
- Use Text-Based CTAs: Utilize text-based CTAs or combined text/image approaches.
- Optimize Images: Optimize images for file size and rendering across devices.
- Test Across Clients: Thoroughly test email rendering across different clients.
- Consider Image to Text ratio: Consider the ratio of image to text, to reduce the chances of being flagged as spam.
- Usability: Ensure CTAs have clear and legible text labels.
What email marketers say
10 marketer opinions
Avoiding images for CTA buttons in email marketing is crucial due to several factors. Image blocking by email clients, like Outlook (affecting a significant portion of B2B users), hinders visibility and lowers engagement. Inaccessible CTAs for visually impaired users, inconsistent rendering across devices, and increased chances of being flagged as spam are other significant concerns. Text-based CTAs offer better accessibility, consistent display, and easier brand maintenance, and can improve click-through rates.
Key opinions
- Image Blocking: Many email clients block images by default, rendering image-based CTAs invisible unless the user enables them.
- Accessibility Issues: Image-based CTAs without proper alt text are inaccessible to visually impaired users relying on screen readers.
- Inconsistent Rendering: Images can render differently across various email clients and devices, potentially distorting or breaking CTAs.
- Spam Filters: Emails with a high image-to-text ratio are more likely to be flagged as spam.
- Brand Consistency: Text-based CTAs are easier to style and maintain brand consistency across campaigns.
- Engagement Rates: Use of images reduces click through rates
Key considerations
- Alt Text: Always provide descriptive alt text for image-based CTAs to ensure accessibility.
- Text-Based Alternatives: Utilize text-based CTAs or hybrid approaches (text and image) to ensure visibility and accessibility.
- Image Optimization: Optimize images to reduce file size and improve rendering speed across devices.
- Email Client Testing: Thoroughly test email rendering across different email clients and devices to identify and resolve potential issues.
- Image to Text ratio: Consider the ratio of image to text, to reduce the chances of being flagged as spam.
Marketer view
Email marketer from Reddit user mentions that using too many images, including image-based CTAs, can increase the likelihood of your email being flagged as spam. Spam filters often penalize emails with a high image-to-text ratio.
26 May 2024 - Reddit
Marketer view
Email marketer from Hubspot explains that the key benefit is that live text is supported by all email clients. It's also easier to read, doesn't rely on the end user downloading images, which can improve your click rate.
12 Oct 2022 - Hubspot
What the experts say
2 expert opinions
Experts at Word to the Wise advise against relying solely on images for CTA buttons in email marketing due to rendering inconsistencies across email clients, potentially leading to broken or unreadable buttons. Furthermore, the lack of alt text in image-based CTAs creates significant accessibility barriers, preventing visually impaired users from understanding the button's purpose and rendering the email inaccessible.
Key opinions
- Rendering Issues: Images used as CTA buttons may not render correctly across all email clients, resulting in broken or unreadable buttons.
- Accessibility: The absence of alt text for image-based CTAs creates major accessibility problems for visually impaired users.
Key considerations
- Client Testing: Always test how images render across various email clients to ensure consistent display of CTAs.
- Alt Text Implementation: Include descriptive alt text for all images used as CTAs to provide accessibility for users with visual impairments.
- Text Alternatives: Consider using text-based CTAs or a combination of text and images to ensure that the call to action is always clear and accessible, regardless of image rendering or user settings.
Expert view
Expert from Word to the Wise explains that using images without alt text is a major accessibility issue. Alt text provides a textual alternative to the image, allowing screen readers to convey the CTA's purpose to visually impaired users. Neglecting alt text makes your email inaccessible.
18 Jul 2024 - Word to the Wise
Expert view
Expert from Word to the Wise, Laura Atkins, explains that images may not render properly across all email clients. This could lead to a broken or unreadable CTA button, hindering user interaction.
25 Jul 2021 - Word to the Wise
What the documentation says
4 technical articles
Technical documentation from W3C, MDN Web Docs, Google's Material Design, and Apple emphasizes the importance of avoiding images as the sole content of CTA buttons in email marketing. Accessibility is a primary concern, as images without alt text are unusable by screen readers for visually impaired users. Semantic HTML elements like `<button>` offer built-in accessibility features. Clear, legible text labels enhance usability, and text scaling (Dynamic Type) ensures readability for users who adjust text sizes. Using images exclusively can hinder interaction and confuse users.
Key findings
- Accessibility Concerns: Image-based CTAs without alt text are inaccessible to screen reader users.
- Semantic HTML Advantage: Semantic HTML elements like `<button>` provide built-in accessibility features.
- Usability: Clear, legible text labels are essential for button usability.
- Text Scaling: Text-based CTAs support text scaling for enhanced readability.
Key considerations
- Implement Alt Text: Always include descriptive alt text for any images used in CTAs.
- Use Semantic HTML: Prioritize using semantic HTML elements for creating buttons.
- Prioritize Clarity: Ensure CTAs have clear and legible text labels.
- Adaptable Text Size: Design CTAs that support adaptable text sizes for user preferences.
Technical article
Documentation from MDN Web Docs emphasizes the use of semantic HTML elements like `<button>` for creating interactive buttons. These elements have built-in accessibility features and are recognized by screen readers. Using images instead of semantic buttons can lead to accessibility issues and a less user-friendly experience.
22 Aug 2021 - MDN Web Docs
Technical article
Documentation from Apple explains that using text rather than images for buttons allows the text to scale with Dynamic Type. This means that users can increase the text size without compromising the usability of your buttons.
13 Feb 2022 - Apple
Are image-based emails a good practice, and what are the deliverability and accessibility implications?
Are image-only emails bad for deliverability?
Can images in emails cause them to go to spam?
Do images in email and PDF attachments affect email deliverability?
Do images in emails affect deliverability?
How do image-heavy emails impact deliverability and accessibility for telecom companies, and what are the legal implications?
