The Best Practices for Client Experience in Email Marketing

By Lucie De Almeida

Ever had the frustrating experience of opening an email on your mobile device only to be unable to access its content because the call-to-action buttons are inaccessible?

This sometimes also happens to persons with disabilities when they are faced with digital content that was not created with accessibility in mind. However, as a universal communication tool, it’s important for email to comply with certain accessibility principles.

For this reason, today accessibility is directly related to email deliverability. Anti-spam filters and email systems are increasingly considering errors in accessibility (such as poorly programmed HTML formatting, overly small or stylized fonts, missing alt text or insufficient colour contrast) as spam indicators, which may cause certain emails to be blocked and directly affect the campaign engagement rate.

What is accessibility?

Accessibility aims to remove obstacles that may prevent people with disabilities from fully participating in society. It’s about creating environments, services, and products that can be used and appreciated by every individual, irrespective of their physical, sensory, cognitive, or intellectual abilities.

To create a fair and equitable society, the idea of accessibility is closely related to the notion of inclusivity, although there are differences. Inclusivity goes well beyond the concept of accessibility by creating an environment in which people feel welcomed, valued, and respected. It involves promoting a culture of acceptance and understanding.

In the digital world, the guiding principles for ensuring the accessibility of web content (WCAG 2) were developed and standardized by W3C in collaboration with individuals and organizations around the world, the goal being to provide a single set of standards that fulfill the needs of individuals, organizations, and governments no matter where they are located.

Each principle is accompanied by testable criteria for success, ranked according to three levels:

A: Minimum level of conformity
AA: Recommended level
AAA: Most accessible level

The A and AA conformity levels are the most commonly used for evaluating accessibility on the web.

Why is accessibility important?

According to the WHO’s World Report on Disability, approximately one billion people are currently living with a disability and close to 200 million of them have very serious functional issues. In the years ahead, disability will become a growing concern as its prevalence increases due to aging populations and the increased risk for disability amongst the elderly.

In Canada, according to the Canadian Survey on Disability, 27 percent of Canadians aged 15 and over have at least one disability: 10.6 percent have limited mobility, 10.9 percent have limited flexibility, 7.4 percent have visual impairments, and 5.6 percent have auditory impairments.

To enable everyone to access content online despite their disabilities, legislation to this effect has been established in countries around the world.

Main regulations and legislation on accessibility

Many countries have implemented laws and regulations to enable people with disabilities to exercise their right to educational, professional, and social integration and to consume digital content based on their needs.

A few examples of established laws and regulations:

The Act to Secure Handicapped Persons in the Exercise of Their Rights with a View to Achieving Social, School and Workplace Integration, established in 2004, provides for certain sanctions for organizations that do not comply with its measures. These sanctions may include notices of violation, corrective measures, fines, and legal proceedings.

The Accessible Canada Act (ACA), implemented in 2019, includes sanctions for non-compliance that can reach up to $250,000.

The Americans with Disabilities Act (ADA), established in the U.S. in 1990, requires companies and online services to be accessible to disabled people. The ADA includes directives on the accessibility of websites and mobile applications, particularly the use of assistive technologies such as screen readers.

The European Accessibility Act (EAA), established in 2019, requires member states of the European Union to implement the directive within their own national laws before June 28, 2022, and to enforce it as of June 28, 2025. The Act covers a variety of products and services that aim to enable disabled people to efficiently access digital content in an independent way.

The principles of digital accessibility

The four main accessibility principles are perceivable, operable, understandable and robust.

Perceivable means digital content must be able to be perceptible to users with visual, auditory, motor and cognitive disabilities. This can be accomplished by using assistive technologies such as screen readers, speech synthesis systems, audio descriptions and video content descriptions. Operable means content must be easy to use, to allow users to accomplish their tasks regardless of their disability. Users must be able to understand how to use the site and to be able to click on an element without being blocked by an interaction that is not accessible to them. Understandable means content must be comprehensible to everyone, including people with particular learning or reading disabilities. Text content must be understandable, legible, and correctly translated. In addition, site visitors must be able to easily orient themselves within the text they are reading. Robust means the content must be able to be reliably interpreted by existing technologies and future assistive technologies. This means the content must be sufficiently robust, properly structured and regularly updated. As assistive technologies for the disabled evolve, online support must be sufficiently agile to keep up with this evolution.

Keys to Building the Email

A. Structured Page Layout

1. Hierarchical titling to facilitate reading

Best practices: Page layout that is structured and hierarchically ordered using titles: a different font size used for titles, subtitles, and running text which distributes the information throughout the text, thereby avoiding cognitive overload; Clear and concise titles; Titles that serve as anchors to facilitate reading.

2. The efficiency of single-column page layouts

Best practices: Content is presented in one column, which facilitates reading and offers better visibility of information in the email; The user’s eye is guided through the email’s key information (titles, product images, call-to-action buttons), as opposed to layouts with several columns which may seem more complex and create cognitive overload; Single-column layouts also make it easier for screen readers to navigate through the email.

B. Understandable and readable text

1. Text and typography that is clear and easy to read

Best practices: The vocabulary used is simple and enables readers to easily understand the topic; Even if the text seems a bit long, it is clear and concise and limited to key information; The syntax perfectly encapsulates the subject of the article to which the user will be redirected; Typography is simple and easy to read (lines are neither too thick nor too fine, the font is not overly stylized); The line height and font size do not complicate reading; Text is aligned on the left.

Additional tip: To ensure text displays well on all email platforms, use a pre-installed web-safe font. Practical tools like Google Font can help you choose an appropriate font.

C. An intuitive interface that facilitates navigation

1. Fluid navigation within emails, even when using a keyboard

Navigating between the various elements of an email can be effected using the Tab key and arrow keys; A visible and clear keyboard focus highlights the elements being hovered over, such as call-to-action buttons. Apply CSS styles to indicate the keyboard focus (border, underline) and to indicate active elements.

2. Design intuitive buttons

Best practices: The button uses the button format and not an image, which allows it to be displayed when images are being blocked; The use of margins between the button and other elements in the email makes it easier to locate the button; The colour of the button provides good contrast with the background colour (for example, white on black); Button text is clear and simple (ex., “Sign up now” instead of “Learn more”); Hypertext links are underscored and accompanied  by the visual indicator “>”, which indicates the text is clickable.

3. Ensure adaptability on many devices—computers, mobile phones, etc.

Best practices: The email adjusts correctly and offers the same experience for both desktop and mobile; There is no loss of information, the call-to-action button is accessible, the layout adjusts, the text and the order of information do not change.

Additional tip: Test every email by sending test versions to different email addresses and devices, or use email testing tools like Litmus or EmailsOnAcid

D. Content optimized for assistive technologies and email loading

1. Alternative descriptive text for all non-text content.

Best practices: All images have alternative text (also called “alt text”); The alt text gives as much information as in the blocked image and enables easy comprehension of the information shared in the image.

2. Optimize images for email loading and reduce the risk they will be clipped in Gmail

Poor practices: Email size is greater than 102 kb and is cut off (clipped) in Gmail; Overly long loading time for images; The user must perform an extra click to see the whole email.

Additional tips: Use the JPG format for photos and images as a general rule; Use the PNG format for illustrations and images on a transparent background; Use GIF and APNG formats for animation; Use tools like JPEGmini (paid), TinyPNG or iloveimg to reduce the size of images without compromising their quality.

E. High-contrast colours and palettes adapted for visual impairments

1. A palette adapted for visual impairments

Poor practices: The email contains a large colour palette, which may make reading harder for people with a visual impairment; All the titles, text, and call-to-action buttons are in different colours, which may complicate reading and be detrimental to a proper understanding of the information.

Additional tip: Test your emails using a tool like Litmus to ensure that the colours used do not complicate reading for people with a visual impairment.

2. High colour contrast between different elements of the email

Poor practices: The colours for the title (pink) and the background (white) don’t have enough contrast, which makes reading more difficult; The colour of the text does not contrast enough with the colour of the last call-to-action button (white on pink), which makes the text hard to see and complicates reading.

Additional tip: Test the colours used in the email with tools like accessible-colors.com.

F. Enriched, structured HTML code

1. Structure and arrange the HTML code for emails

A few examples of HTML code elements that promote accessibility: Ensure your HTML elements are complete, that they start with an opening tag <> and end with a closing tag </> ; Also verify that the HTML elements do not contain duplicate attributes; If you are using an extension module (plug-in) or an element created by a third party, ensure it uses valid HTML markup; HTML language codes must correspond to ISO language codes to ensure correct interpretation by assistive technologies; Logically structure your email by using semantic tags, such as <H1>, <H2>, <H3> for titles and <p> for paragraphs; Avoid specifying the title attribute for links, since this complicates reading by screen readers; Separate content by using subtitles for each new section and mark headers with the HTML tag <header>.

Remember, email accessibility is much more than just a legal requirement. It’s for everyone.

This article was written by Lucie de Almeida with valuable support from Maxime Philippon. De Almeida specializes in customer experience and CRM at Adviso. Passionate about digital marketing, she didn’t hesitate to choose CRM as her specialty. For over five years, Lucie has guided a range of businesses in developing their email marketing strategy, for both B2B and B2C. Sources used for references include Standards et guideline WCAG 2, Association W3C, Guide d’accessibilité – Behance, Litmus, Association Canadienne des centres de science, Nation Unies droits de l’Homme, Passe Muraille and Microsoft.