How Do Your Emails Look When They Are Delivered?

By Clifff Guy

As many as 19% of email recipients will not open an email that hasn’t rendered properly, as they assume it is spam. So it’s critical for email marketers to design and code their templates to ensure they render correctly in all relevant email clients.

In our newly published 2009 Hitting the Mark benchmark survey, we used the Inbox Preview tool within dotMailer to test how consistently the email campaign templates of 43 major name retailers rendered in over 20 different email clients (for full list of email clients included in the Inbox Preview report, download the full report).

We found the results were mixed across the retailers when it came to deliverability, with an average score of 7.2 out of 12. Whilst 12% of those surveyed achieved top marks for their emails rendering correctly in all email clients tested, 10% of the retailers scored just 3 marks out of the 12 available.

Best practice leads to best results

Not adhering to the coding best practice rules laid out below meant that many of the templates we studied did not render correctly in certain email clients, even with images switched on.

Remember that as a default, emails are delivered with images turned off by many email clients. So it’s important for marketers to include a balance of web text with any imagery used so the template is still legible and meaningful when viewed with the images turned off.

Here are dotMailer’s best practice guidelines for ensuring your emails render correctly and consistently across the key email clients:

  1. Ensure images are imported into your template at the correct size you want them to render – do not rely on the HTML height and width settings as some email clients may not support these
  2. Make sure your HTML height and width settings match the actual dimensions of the image
  3. Ensure an equal balance between web text and images – image heavy emails may attract high spam scores and are less effective when images are switched off
  4. Design your template with preview panes in mind – ensure your brand, key message and/or call to action are visible and above the fold
  5. Include a link to a web version of the email to help solve rendering issues for the recipient
  6. Test how your emails look when viewed using mobile broadband connections. We found different ‘dongles’ lead to some emails being rendered differently for different members of our panel
  7. Use an ‘Inbox Preview’ tool (provided by many leading email marketing providers) to test quickly and easily how your email template renders with and without images switched on in all relevant email clients and through different preview panes
  8. Focus on the relevant email clients for inbox preview testing, depending on whether the email is B2B or B2C
  9. Make sure your designers are experienced and qualified in email design and are aware of the issues of designing for the inbox

Best practice guidelines for coding to ensure renderability

  1. Avoid using cascading style sheets (CSS) in your code – not all email clients support them, and your email may not render correctlyUse background colours as an alternative to background images behind text – not all email clients support background images, and your email may not render correctly

And our top tip is:

Segmenting your database into regular openers and non-openers means you can send less image-heavy emails to non-openers, and increase the chance of these recipients reading the email with images turned off.