Image optimisation for email

Image optimisation is the process of reducing the file size of an image while maintaining an acceptable level of quality. 

See also: Images in email templates best practices

Optimising images in an HTML email:

• improves loading times
• enhances deliverability
• provides a better experience on mobile devices
• ensures consistent rendering across email clients 
• reduces bandwidth usage. 

All these factors contribute to a successful email campaign and increase the likelihood of recipients engaging with your content.

Optimising your images

To optimise your images, follow these techniques and best practices:

Choose the right image format

Selecting the appropriate image format can significantly impact the file size.

JPEG is generally suitable for complex images with many colours, while PNG is ideal for images with fewer colours or transparency. 

GIF is commonly used for animations.

Resize and scale 

Scaling down larger images can reduce their file size without compromising quality. 

We recommend having the dimensions twice the size of the display size. 

E.g. If you're optimising an icon displayed at 40x40px, try sizing it to 80x80px - this way it will still look good on high-quality and retina screens. 

Crop unnecessary content

Crop your images to remove any unnecessary areas or empty spaces. 

By focusing on the essential content, you can reduce the file size further.

Use an optimisation tool

There are several image optimisation tools and software available that automate the optimisation process. 

These websites offer free image optimisation tools that can help you reduce the file size of your images and improve the load times of your emails.

• TinyPNG - TinyPNG is a popular image compression tool that uses smart lossy compression techniques to reduce the size of your PNG and JPEG images. It's easy to use and can reduce the file size of your images without losing quality.
• Compressor.io - Compressor.io is another image compression tool that supports multiple file formats, including PNG, JPEG, GIF, and SVG. It offers both lossy and lossless compression options and can help reduce the file size of your images by up to 90%.
• Kraken.io - Kraken.io is an image optimisation tool that offers both compression and resizing options. It supports multiple file formats, including PNG, JPEG, and GIF, and can help reduce the file size of your images without losing quality.

Why is it important to optimise images in my emails?

It is important to optimise images in an HTML email for several reasons:

Faster loading time 

Images with large file sizes can significantly increase the loading time of an email.

Optimising images by reducing their file size without compromising quality helps ensure that the email loads quickly for the recipients. 

Faster loading times lead to a better user experience and increase the chances of recipients engaging with the email content.

Mobile-friendly experience

Many people check their emails on mobile devices, where bandwidth and data usage may be limited. 

Optimised images help reduce data consumption and provide a better user experience for mobile users. 

Lower bandwidth usage

Optimised images consume less bandwidth when being downloaded by recipients. 

This is particularly important for users with limited bandwidth or those accessing emails on slower internet connections. 

By reducing the size of images, you minimise the amount of data required to load the email, making it more accessible to a wider range of recipients.

What happens if I don’t optimise the images for my email?

Slow loading time

Emails with large images take longer to load. 

Slow loading times can lead to a poor user experience, as recipients may lose interest and abandon the email before it fully loads.

Display issues

Email clients have different guidelines and limitations regarding image size. 

If an image exceeds the maximum display width or height specified by the email client, it might get resized or distorted, affecting its visual quality. 

Oversized images can break the email layout, causing horizontal scrolling or overlapping of other email elements.

Limited accessibility

Some recipients may have slow or limited internet connections, particularly when accessing emails on mobile devices. 

Large image sizes can consume significant bandwidth and take longer to download, making it difficult for these users to access and view the email content. 

This can lead to frustration and lower engagement.

Increased data usage

Large images consume more data when downloading an email. 

This can be problematic for recipients with limited data plans or those accessing emails on mobile devices. 

Increased data usage may result in additional costs for recipients or cause them to avoid opening or downloading the email altogether.