Find out recommended width for images in your campaigns, how to enable retina support, and how image compression works.
This article covers:
- Recommended image widths
- How to add horizontal padding
- Retina images in emails
- Image compression in Upsales emails
Recommended image widths
For images covering the column width, with zero horizontal padding:
| No. of cells in row | Recommended width | Retina screen support |
|---|---|---|
| 1 | 580px | 1160px |
| 2 | ||
| 3 | ||
| 4 |
How to add horizontal padding
Calculate how much padding is to be added on one or both sides of the image. Subtract this figure from the recommended width above.
For example:
- Number of cells in a row: 2
- Recommended image width (per row): 290px
- Horizontal padding: 10px either side of the images, so 20px of padding per image
- New recommended image width (per row): 270px (290px - 20px)
Retina images in emails
These screens show 2X the number of pixels. So you'll need to double the recommended width to keep images looking great on retina displays.
How to enable retina support for emails and templates created before June 15, 2020:
Remove the image from the cell and then add it again:
- Open the email or template you'd like to optimise
- Click image cell
- Clear cell
- Add image cell
- Add the same image again from the image library (for retina support your image width needs to be twice the width of the image cell)
- Repeat and save
Image compression in Upsales emails
The smaller the number of px in an image, the faster it loads. This is good for your recipient, and their mailbox (Microsoft Outlook blocks emails over 20mb).
That's why Upsales will compress images for you, to 2X the original file size (so that it's retina-ready).
Example 1:
- Image width: 2000px
- Cell width in email: 300px
- To fit an image with 2000px width into a cell of 300px, Image width will be compressed to: 600px
Example 2:
- Image width: 300px
- Cell width in email: 300px
- No compression needed