As you design your email with images, we recommend applying the formats and measurements below to optimize their appearance. These best practices apply to all of our accepted image formats, including .JPG, .PNG, and .GIF.
Image measurements
Although images can be up to 5 MB, smaller images load more quickly. We recommend keeping images under 500 KB. Use the measurements below to size your images based on their dimensions.
Evergreen - 3 Columns: 161 x 208 @ 2x png |
|
Evergreen - Wide Image: 520 x 208 |
|
Evergreen - 2 Columns: 244 x 292 |
|
Evergreen - Criss Cross: 330 x 330 |
|
Evergreen - Square - 2x2: 250 x 250 |
|
Image Section - Default: 660 x 337 |
|
Image Section - 16x9: 660 x 371 |
|
Image Section - 1x1: 660 x 660 |
|
Image Section - 2x3: 660 x 990 |
|
Logo: 250 x 520
|
|
Display issues
If your images don’t appear as expected, there are a few things you can do to help ensure subscribers see images the way you intended. Here are some common issues and ways to address them:
- Images appear blurry on a retina display: Retina displays use a higher ratio of pixels. This can result in smaller images appearing fuzzy.
- An image under 5 MB appears blurry: An image under 5 MB can still appear blurry if the dimensions aren't appropriate for the image. Use the recommended dimensions above to help ensure images appear clearly. All images are exported at 1x png unless otherwise specified.
- Image colors don’t appear properly: Images need to be formatted in RGB, a color scheme optimized for web display. Images formatted in CMYK, a color scheme optimized for print, don't always display well on screens.
- Background images don’t appear: Background image support varies across email clients. Because of this, we recommend choosing a fallback background color for the content area. Then, incorporate alt text for optimal results.
-
Images load too slowly: Large images can take a long time to load. To help images load faster, try compressing the image. Images should be less than 1 MB for optimal load times. You can also try breaking up large images into a series of smaller images, as in the example below.
Learn more about Attentive Email
If you're interested in learning more about Attentive Email, please submit your information here.