If you have images that are appearing blurry, we're here to help you determine why. Review the background of this issue, take a look at our best practices, and then follow the troubleshooting steps. We've also provided additional resources for you to review.
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.
- 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.
- Make sure the resolution is between 72 PPI minimum and 120 PPI maximum.
- File Types
- JPEG: Don't use this image type for text images. See below for an example of what a large, text-only image looks like as a JPEG. Use this for photographs, colorful graphics, and smaller size images.
- PNG: This image type is high quality and produces good color. It's ideal for logos and graphics due to the sharp edges.
- GIF: Use this file type for animations only.
The following is a large, text-only image that is a JPEG file. It is noticeably blurry. If you are experiencing this with one your own images, try saving it as a PNG instead.
The following troubleshooting steps can help you to determine the cause of blurry images:
- 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