Importance of Image Optimization in Email

Hopefully most of you already optimize the images of your website for better performance. But do you a make the same effort to polish your images for best performance in emails?

You should! Since large images might cause some frustration and disappointment for your email subscribers especially when they open your email on their mobile while they are using slower mobile internet connections.

Email load time matters

The next illustration gives you an idea about how much time it might take for a 1 MB email to load on different connections.

Image source: Chamaileon.io

It should load seamlessly on modern 4G or 3G connections, but in case of remote locations with limited access to modern networks, the email load time might be simply unbearable for most.
People are always in a rush and are super impatient with websites, apps and email too. According to a recent blog post by Hobo-web.co.uk your website should load in maximum 4 seconds but 47% of consumers expect a web page to load in 2 seconds or less.

I think, emails should load even faster, since they are definitely less complex than a website. So what happens if your email loads for over 2 seconds on a slower 3G connection?

Your subscribers will simply close the message, and that’s it: a lost opportunity, a lost prospect and a lost conversion for you.

Does image size influence email deliverability?

In case of marketing emails the images you use in your email are not actually attached to your email message, they are only linked into the template from your web storage.

Email deliverability depends mostly on:

– Your IP and domain reputation
– Quality of your list (double opt-in vs single opt-in)
– HTML code quality
– Subject line and email copy

So generally speaking the size and weight of your images don’t influence the deliverability of your emails.

But the number of images do!

Too many images might cause you trouble

A while ago most SPAM emails used to contain just one large image, or many little images with very short text in order to fool SPAM filters that were looking for spammy words in the text of the email.

These days SPAM filters use more sophisticated methods to check the quality of an email message and the senders reputation is the most important scoring factor.

But text to image ratio is still among the SPAM factors and on top of that, if your message consists of purely images, those users who have images disabled by default won’t see a thing from the content of your email (only ALT texts).

When you create a new email template it’s always worth testing the SPAM score of your email. Thankfully there are couple of free services online that you can use.

Image source: Mail-tester.com

These tools won’t give you guidance on image optimization but will give you an idea about the text to image ratio, which should be around 80% text compared to 20% image.

Heavy images = higher hosting costs

If you use a web based email service provider that takes care of image hosting for you, the hosting costs are not really a factor for you… rather for them, I admit.

But if you have your own self hosted email software and image server, you’ll need to cover the hosting costs as well.

In case of a cloud provider (like AWS or Cloudinary) you’ll be charged based on the bandwidth your servers use. The larger images you have the more bandwidth your messages will consume.
This is one of the reasons why most email service providers have some kind of built-in limitations when it comes to image size and weight.

What about retina screens?

Image source: Designmodo

Retina screens display double or more pixels in the same amount of space than a traditional display. It makes texts and images sharper and more enjoyable for the eye.

Most smartphones, even the cheaper ones use some kind of retina screens. Some might even add 4K, 8K or even higher resolution screens to their freshest mobile devices. So it’s a question we need to tackle.

The easiest approach for optimizing your images to retina screens is to double the size of your images. What does it mean?

If you want your logo to display in 200 px width on a desktop screen add a 400 px wide image, and size it down to 200 px. This approach will work on mobile screens too.

But yes, this way you’ll end up with significantly larger images buy default, so tools like Shortpixel have an increasingly important role in helping you to reduce file sizes.

Typical image sizing issues in email

– Print quality (300 dpi) emails
– Use of large, 2000 px+ wide images – It’s easy to make this mistake if you upload images right from your DSLR camera or even from modern smart phones with 10+ Megapixel cameras.
– Wrong file format – PNG is not always the best

How to optimize your images for email?

Export web version

Always export web version of your images with max 72 dpi – If you download a stock photo, makes sure you open it with an appropriate image editor and resave in desired quality.

Choose the right format for the right purpose.

– JPG for photographs,
– PNG-8 for simple images,
– PNG-24 for images and photographic elements combined.

Always resize images for email

If you obey the limitations of email design, the content of your email should stay under 650 px, most likely at 600 px.

Even if you take into account retina screens the content images in your email should not be wider than 1200 or 1300 px max.

If you want to add stylish full-width background images to your emails, you’re better use repeatable patterns.

If you really insist to use large full-width background images, please thoroughly test for ideal image quality and width, since there’s no “one size fits all” rule to apply here.

Use an image optimization tool

After you made sure that your images are sized properly and are saved in satisfactory quality you should use an image optimization solution like Shortpixel.com to further decrease the weight of your images with up to 90%!

With the rise of retina displays I believe that image optimization becomes an increasingly important issue not only for websites but for email templates as well.

Author: Roland Pokornyik, CEO / Co-founder @ Chamaileon.io & EDMdesigner.com
Working on a standalone email builder for teams which brings easy to use – Canva like – design experience into email template production.

Twitter: https://twitter.com/RolFic
Linkedin: https://hu.linkedin.com/in/rolfic