Email Creatives (Standard)

The Home Depot

Helpful Content leading to Products

Desktop

Mobile

What we like about this email

This email from The Home Depot was received during the COVID-19 pandemic and is perfectly on message for the time it was sent – hitting on people being at home and the rise in DIY being done because of this lockdown situation.

The content starts with practical tips on how to complete specific tasks such as fixing a toilet (jobs you may usually outsource but are unable to due to social distancing) as well as leading to some key products you may need. It then goes on to detail three ways in which they can help to make shopping with them easy.

Unfortunately, the email doesn’t seem to be mobile responsive and simply shrinks, which makes the information in columns more difficult to engage with on a small screen. All the text in the email is also in as images which means that with images disabled, or slow to load, the main message and CTAs will be lost.

Accessibility Results

This email doesn’t feature ‘presentation’ roles set for screenreaders: Adding a ‘presentation’ role to tables tells a screen reader to skip reading the code that creates a table and only read the customer-facing text.

General Tips:

Ensure a good colour contrast ratio with text on background colours so that they are readable for those with visual impairments or colour blindness. Web Content Accessibility Guidelines (WCAG) 2.0 recommend a contrast ratio of 4.5:1 between colours for body content and 3:1 ratio for bolded text larger than 18px or 23px without a bold.
Be sure to remove ‘title’ attributes from images: A title attribute gives additional information about elements in your email, such as a tooltip that appears when a user hovers over part of an email. To improve accessibility, you should avoid using title attributes. They will disrupt the order in which screen readers read content. Instead, consider using alt text to describe an element.
Include a mix of bulletproof buttons and text links that are clearly defined using colour and underline features
Ensure all images have descriptive Alt text: Alt text allows you to describe images to users with visual impairments; screen readers can read the alt text to give details about the campaign. For images that don’t need text, simply add a blank alt attribute to ensure screen readers do not read the image’s URL path.

Results supplied by Email on Acid

Rendering Testing