Image Recommendations for Email

Discover key strategies for optimizing images in Breeze emails, ensuring they're engaging and clear for your audience. This guide covers essential tips on choosing the right format (PNG, JPG, GIF), color profiles for web use, managing file sizes for swift loading, and ensuring your images display crisply on various devices. We'll also tackle the common issue of images appearing rotated and provide a straightforward fix. Ideal for individuals responsible for editing and uploading photos, this article simplifies image optimization in Breeze, enhancing your church's email communications.

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.  Note: Must have permissions to Edit photo in order to edit and upload.

  • Format
    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.

 

Photos are Rotating in Emails

Images Uploaded to an email sometimes are rotated incorrectly and are unable to be manually rotated in the Breeze email composure window.

Likely caused by the operating system (Mac/Windows) auto-rotating the picture in the viewer and leaving the actual picture file still upside down/sideways. When uploading to Breeze, in an environment where auto-rotation isn't supported, original photo file orientation is preserved, displaying the photo upside down/sideways.

To fix this: 

  1. On the device you're using to upload the file to breeze, open it in a photo viewer. Assuming the photo orientation looks correct, save a copy of the photo file. Upload this new file to Breeze
  2. Saving the photo as a copy locks in the auto-orientation magic that the host computer is using.
  3. Then re-upload the photo into a Breeze emails.