Making emails is a fairly seamless process in Retention Science, but in the realm of email marketing there are a variety of factors that can contribute to the final appearance of an email in an inbox (including but not limited to):
- image file type
- image resolution
- structure of the email
- email type (HTML vs. Drag and Drop editor)
- mobile platform type
- browser type
We have researched this topic extensively, and image issues almost always lead back to one specific problem. This page is intended to help empower marketers to troubleshoot image quality that think may be lacking and to gain a full understanding of all considerations involved.
Example Best Practices
- To make sure your images appear clearly on all screens, you can save your web-ready images at double the size needed for the image block you’re using in your campaign.
- For example, if your header image is 600 x 200, you could upload a 90 ppi image that is 1200 x 400 pixels.
- Resolution is key, 72 PPI minimum with 120 PPI as a maximum
- File Types
- JPEG: Don't use for text images!!!! Use for photographs and colorful graphics and images where size should be small
- PNG: High quality and good color, great for logos and graphics due to sharp edges
- GIF: Only for animations
Example 1: Text in a large JPEG image file
Example Troubleshooting workflow (See attached file at bottom of page in "Resources" for sample plan that you can adapt and expand)
Examples of how to walk through an image problem in emails from A-Z and help determine what may be causing the issue.
- Where is the image currently being hosted?
- Is it hosted in our Drag and Drop editor, or externally hosted?
- Does a test with one hosting method vs. the other change the quality?
- Audit your images
- What is your source resolution?
- Right after you hosted the image online, compare to the offline image
- Did the image de-grade right at that moment, or is it the same as the offline copy?
- If yes: trying changing resolution and re-uploading to see if base quality can be improved
- Audit templates in sends
- What resolution is the image displaying at in the final email?
- How would you grade the image in the app first in browser and mobile opens?
- test iphone vs android
- test chrome vs firefox
- Consolidate findings from all steps to isolate the problem
- compare high quality results vs. low and find common factor in low quality images