Creating an effective email is not just about design. It also depends on how the message behaves, when it is triggered, and how users interact with it as part of a wider journey.
However, even when these elements work as expected, emails can still present problems for recipients. Content may be difficult to read, hard to navigate, or inconsistent across devices and assistive technologies. In many cases, these issues also relate to recognised accessibility standards that organisations have a legal obligation to follow.
The Web Content Accessibility Guidelines (WCAG) provide a framework for making digital content more accessible and are often used as the technical standard worldwide to measure compliance with digital accessibility laws.
While originally written for web pages, the same principles apply to email content, so understanding how WCAG works (and which parts are relevant to email) helps teams create messages that are more usable, inclusive, and compliant.
This guide breaks down the key WCAG principles for email and highlights the most important guidelines to follow in practice.
What is WCAG 2.2 (and how does it apply to email)?
There are several iterations of WCAG in circulation because the guidelines are iterated upon to keep up with advances in technology and additional accessibility considerations that arise as a result. The current ‘standard’ model is WCAG 2.2, created in 2023, and Mailosaur can check your emails against WCAG 2.2 to the AA level.
There are three levels of compliance with WCAG, each building upon the previous one. Level A is the minimum level, where baseline accessibility issues have been rectified. Level AA is the widely accepted ‘standard’, where more of the guidelines have been met and content is accessible to a wider range of people. Level AAA is the highest level of accessibility, requiring significant effort and resources for things like sign language adaptations of audio.
The four WCAG principles explained for email
An extensive and comprehensive view of web accessibility, WCAG is split into four principles, forming the foundation of digital accessibility:
- Perceivable: requires your content to be presentable to users in a format that they can perceive, which also includes the ability to adapt your content to different formats, for example, the ability to increase the font size, or the inclusion of subtitles in videos.
- Operable: requires your content to be workable for users, without demanding a form of interaction that they may not be able to perform, for example all elements need to be keyboard accessible.
- Understandable: requires your content to be understood by all audiences, and for it to operate in predictable ways.
- Robust: requires your content to be compatible with current and future user agents, including assistive technologies.
Key WCAG 2.2 email guidelines (with examples)
Perceivable
| Specific guideline | What’s included | Example |
|---|---|---|
| 1.1.1 Non-text content | Non-text content has to have a text alternative that serves equal purpose (with some exceptions) | Images require ALT text to explain their purpose, in case they don’t render or can’t be viewed |
| 1.2 Time-based media | There should be alternatives to time-based media (this may apply to email based on embedded media) | Providing captions for embedded videos |
| 1.3 Adaptable | Content needs to be able to be presented in different ways, without compromising information or structure | When content is presented in a sequence impacting its meaning, users can programmatically determine its intended reading sequence |
| 1.4 Distinguishable | Users can distinguish content appropriately, including being able to separate foreground from background and adapt sizing etc to suit their needs | Text can be resized up to 200x without loss of content or functionality |
Operable
| Specific guideline | What’s included | Example |
|---|---|---|
| 2.1 Keyboard accessible | All functionalities can be operated through keyboard, without requiring specific timings for individual keystrokes | A user can use keyboard keys, often the ‘tab’ key to navigate through the email |
| 2.2 Enough time | Where emails include moving, blinking or scrolling content which starts automatically and lasts more than five seconds, the user must have the ability to pause, stop, or hide it | A gif within your email must provide users the opportunity to pause it should it fit the criteria |
| 2.3 Seizures and physical reactions | Emails contain nothing that flashes more than three times per second, and flash should be below the general flash and red flash thresholds | A moving banner or gif within your email cannot break these limitations |
| 2.4 Navigable | Users can navigate and find content, as well as determine where specific content is listed | The anchor text on a link is descriptive, such as “read more on our accessibility page” rather than just “read more”. |
Understandable
| Specific guideline | What’s included | Example |
|---|---|---|
| 3.1 Readable | Content is readable and understandable to users, with mechanisms implemented to boost their understanding of unusual or disproportionately complex information where necessary | A mechanism is available for identifying specific definitions of words or phrases used in an unusual or restricted way |
| 3.2 Predictable | Emails appear and operate in predictable ways | Changing the setting of a user-interface component doesn’t automatically lead to a change of context unless previously specified |
| 3.3 Input assistance | If the email requires user input, there’s effort to assist users in avoiding and correcting mistakes | Forms within your email include labels or instructions |
Robust
| Specific guideline | What’s included | Example |
|---|---|---|
| 4.1 Compatible | Compatibility with current and future user agents, including assistive technologies, is maximised | Interactive elements of your email must include programmatically associated labels |
Which WCAG guidelines do not apply to email?
Not all WCAG guidelines are relevant to email. Many are designed for complex web applications, such as navigation menus, multi-page workflows, or interactive controls.
In email, the focus is on content, structure, and readability rather than full application behaviour. This makes it important to prioritise the guidelines that directly impact how users read and interact with messages.
Common accessibility mistakes in emails
- Missing ALT text
All non-text elements of your email need ALT text- not just because it's beneficial to those using screen readers, but also because this will provide context to any user whose email blocks images by default. As such, you should provide concise, descriptive text conveying the image's meaning.
- Low text colour contrast
WCAG requires you to achieve a specific minimum contrast ratio of 4.5:1 for normal text. This means using light grey text on a white background, for example, will make your email inaccessible.
- Vague link text
Using ambiguous phrases such as “click here” or “read more” without providing specific context is insufficient because it doesn’t provide enough clarity around where your link is or where it’ll take a user who clicks it.
- Lack of structural formatting
Using correct structure (for example, h1 tags for headers, actual bullet points in lists (rather than copied and pasted symbols) helps screen readers and users with certain disabilities digest the flow of information better.
- Using colour alone to convey information
Some readers will not be able to distinguish colour meaning that as well as avoiding low contrast colours, email designers should avoid using colour as the only way of sharing or emphasising information.
How to test email accessibility
If you’re an existing customer, to test accessibility in Mailosaur:
- Open an email in the ‘Designer’ or ‘Message Viewer’
- Navigate to the ‘Compliance’ panel
- Review accessibility and compatibility results
- Fix issues and re-run checks
If you’re not a customer yet, you can start a free 14-day trial, where you can take a look at Mailosaur’s extensive capabilities for testing both email and SMS, including device native screenshots, and OTP testing among countless other use cases.
If you’d prefer a walkthrough before you start your trial, it’s quick and easy to request a demo which can be personalised to suit your needs.
WCAG for email: quick summary
WCAG 2.2 helps ensure emails are accessible and usable for all recipients. For email, this means:
- Adding alt text to images
- Using sufficient colour contrast
- Writing descriptive, meaningful links
- Structuring content clearly with HTML
- Ensuring compatibility with assistive technologies
Following WCAG 2.2 Level AA helps reduce compliance risk and improve usability across devices and users.