Making sure your online content is neurodiversity friendly (or “Digitally Accessible”) is an important topic these days as more and more businesses switch on to the importance of reaching as many customers as possible. By understanding the barriers customers face and the related impact this has on businesses, organisations can work to create clearer communication and customer journeys that benefit all parties.
Thankfully there are rules and guidelines available that can direct organisations on the path to delivering high quality, accessible services. These guidelines take into consideration the many individual situations that customers approach digital services from.
The focus of this article is to help improve email communications by utilising already established accessibility guidelines. Below you will find an overview of the best practices when developing your email content. Note, there are more steps that can be taken through the code of your html email, but this article will concentrate on the content and layout guidelines.
In order to move towards more neurodiversity friendly content, we will be looking at:
- Structure
- Text
- Images
- Links
![A view from above of a man with blonde hair tied back in a ponytail. The man is sat at a desk using a laptop. Beside the man on the desk is an open notebook with pen, a pair of glasses and a coffee.](https://tohealthltd.co.uk/wp-content/uploads/2023/02/Untitled-design-2023-02-09T122640.099-1024x553.png)
STRUCTURE
Responsive
When you first setup your html email template the first thing you’ll want to ensure is that the email is responsive. If you are using an email builder such as Mailchimp your email will likely be responsive by default. Responsively structured emails will adapt to the device size ensuring no content is inaccessible and it will also allow for the user to zoom in or out on the content without the layout becoming unreadable or overlapping other areas of content. This is important for users with low vision.
Plain text
Ensure you have set up a plain text version of your email, again this may be done automatically by your email builder. Some users will request the plain text version only and if it isn’t available, they will not read your email.
Subject lines
Try to consider all users when writing your subject lines. Keep them short and to the point. All cap words can be difficult for people with low vision or dyslexia and punctuation is read out by screen readers so should be avoided in the subject line if possible.
Here’s an example:
Original subject line:
[WEBINAR] Fri 1/18 at 12 PM GMT – Start off 2023 right!
Improved subject line:
Webinar Fri 18th Jan at 12PM GMT. Start off 2023 right!
Use of colour
Your use of colour should not be the only indicator for important content such as links and if you choose to use emojis, do not replace words with them as they may not show for some users or read properly for those using a screen reader. Colour contrast should also be considered and tools such as the Web Aim contrast checker can help you to find colours that pass the WCAG requirements.
You can view the contrast checker tool here
TEXT
Text layout
When writing your email copy avoid large blocks of text, instead look to break up your content with titles. When you do add your titles, look to apply H tags to them so that screen readers can identify them properly.
Alignment
One guideline that is often broken in html emails is center-aligning text. This makes your content difficult to read and should be restricted to short titles only if required. Equally, justified text is also inaccessible to many users and should be avoided. Although many people may think it looks nicer, justified text creates large gaps of white space in the copy called rivers which can make reading the content difficult for low vision and dyslexic users.
Legibility
To ensure your copy is easy to read there are several guidelines you can follow. Look to keep your body text at 14px or larger, use an accessible typeface such as arial for maximum legibility and when emphasising words use bold rather than italics or caps.
Finally, try to write your copy to a level that’s easy to read, avoiding unnecessarily long words. Tools such as Readable, Grammarly and Hemingway can assist in creating accessible copy for all reading levels.
![A finger pressing on the home screen of an iPhone. The iPhone is sat on a table. Above it are floating envelope icons representing email.](https://tohealthltd.co.uk/wp-content/uploads/2023/02/Untitled-design-2023-02-09T122741.081-1024x553.png)
IMAGES
Context
Images in emails can be great for capturing the reader’s attention, breaking up content and adding context to your communication. But when adding images to your email, you should never rely on your users seeing them to understand the message, especially when it comes to neurodiversity friendly content. The reason for this is that not all users will have the means to receive those images. High email security, low bandwidth or user visual restrictions can all mean that the image is never seen.
Text in images
You should never put any important text into your images such as body text or titles. Not only can they not be seen if the image does not load, but the text can’t be read by a screen reader.
Alt tags
When you do add images to your email, ensure you give them descriptive alt tags. These descriptions are read out by screen readers to allow low vision users to understand what the image shows so make sure you describe them well.
Animated Gifs
Modern emails often make use of animated Gifs to add motion to an email. Animated Gifs are best avoided but if you do wish to use them, try to ensure that flashing is kept to a minimum and a suitable fall-back image is available with a descriptive alt tag.
LINKS
Text
Often the most important aspect of an email are the calls to action. You want as many conversions as possible and the best way to achieve this is to create an accessible link. Writing your link text in a descriptive manner is important and a key requirement for screen readers. Instead of a button with ‘click here’ which doesn’t tell the user anything, aim to describe the action e.g. ‘download the 2023 report’ or ‘visit the service webpage’. This will also help to differentiate your links for low vision users who are tabbing through them without reading the body copy.
Size
Always optimise your button size and spacing. According to WCAG, the minimum size for a call to action should be 44 by 44 pixels. Google, however, advises that buttons should be bigger reaching 48 by 48 pixels.
![A group of young adults in casual dress sit around a long table. The people are having a relaxed meeting. Some people are working on laptops while others hold iPads.](https://tohealthltd.co.uk/wp-content/uploads/2023/02/Untitled-design-2023-02-09T122836.061-1024x553.png)
Keep going!
Creating and maintaining digitally accessible content can seem like a lot of work but the benefits are huge. The important thing to remember is that you are working towards reaching as many customers as possible and providing them with clear communication. Including accessible guidelines at the start of digital projects saves time and lost customers later down the line and with continued application you will see the results through engagement. By following these steps, you can ensure your content is as neurodiversity friendly as possible.
Looking for more from ToHealth?
Looking to find out more about our Health Screenings? Or interested in our huge variety of webinars and workshops on offer? ToHealth can support you with all of this and more.