Email Image Best Practices
Most images from cameras and graphic designers are very large and are not optimized for an email format. If these images are included in an email, often your leads and members can see an image is in the email, but the image loads quite slowly. This can be a frustrating experience and may mean your email is trashed, not read!
Recommendations
Use images sparingly. Research shows that most users won't wait longer than a few seconds for an image to load before moving on to the next email. If an email contains mostly text, then that text is visible immediately in the email and the user may allow time for the pictures to load.
It is also important to know that most email programs, including Hotmail, Outlook, Yahoo, and Gmail, block images. If your email is made up of mostly images it could be that users are seeing absolutely nothing but a white square!
Keep your image file names simple, like HappyBirthday.jpg or Lead_BDay.png. It's best not to include special characters or spaces as these may effect the deliverability of your image.
If images are required in your emails, they should be optimized for email delivery. This primarily involves resizing the image to be the correct size before adding it to the email. The maximum recommended width for email is 600px. The image height can be larger, but you generally don't want too tall of an image as the user will have to scroll to see it. If the image is larger than the recommended size, it should be opened in an image editor and resized to the desired width and height before adding it to your InTouch Follow Up email.
In Summary
- Use images sparingly
- Don't use spaces or special characters in your image filename
- Remember that often your target users won't even see images by default unless they have explicitly allowed it
- Emails that are one big image should definitely not be used
- The maximum width of any image should be 600 pixels wide
- The maximum file size should be 100KB
- Use an image editor to scale your images down to the desired size (e.g. MS Paint is available on most Windows PCs- follow the tutorial here to resize an image http://windows.microsoft.com/en-CA/windows7/Resize-a-picture-using-Paint)
Resources
- http://www.catswhocode.com/blog/best-practices-for-coding-html-emails
- http://kb.mailchimp.com/article/how-to-code-html-emails
- http://bostonid.com/blog/best-practices-for-html-email/
- http://blog.socialsourcecommons.org/2011/04/image-best-practices-for-html-newsletters/
- http://www.amplifymarketinggroup.com/blog/email-design/image-usage-email-marketing-best-practices-part-3/