When uploading images, it's important to keep in mind the size of the images. Large images will often create unexpected results, so here are some general guidelines to use when composing emails in Breeze.
When you save images, use PNG, JPG, or GIF format. You can use PNG format if you need to retain transparency.
- Color Mode or Profile
Colors used online are different from those used in print, so it's important to make sure the colors in your images are set correctly. Web images should be saved with the RGB color profile or mode. CMYK, which is what designers use for print, doesn't render accurately online and can sometimes break your embedded image.
- Alt Text
It’s a good idea to add alt text to your images. Alt text is essential for accessibility and for viewers who might have trouble downloading your images. It can also help with search engine optimization for your landing pages.
- High-Definition Screens
Many smartphones, tablets, and laptops feature high-definition screens, such as retina displays, that offer a higher ratio of pixels per inch. This means that some images may appear fuzzy on these displays. To make sure your images appear clearly on all screens, you can use a higher resolution photo in an Image content block, and constrain the dimensions.
- File Size
It's best to avoid overly large images, both in file size and pixel dimensions. We recommend a maximum file size of 1MB for images. 72 DPI is generally sufficient for the web, but isn't required. We don't recommend uploading images that are significantly larger than your content area or template.
- Image Size
Emails and landing pages have a limited amount of width for images. For specific width recommendations, check out the following sections based on the type of content you’re creating.
Image size requirements vary based on the number of columns in your email template.
|Columns||Recommended Image Width|
|Full-width template images||500px|
|2 column template images||264px|
|3 column template images||164px|
Requirements can also vary depending on the type of content block you’re working with.
|Content Block Settings||Recommended Image Width|
|Set Edge to edge||564px|
Again, these are just guidelines. Depending on the template/usage scenario, you may be able to use a larger image. However, given that so many users view email on their mobile devices, larger images usually don't equate to more engaging content.