Common email display issues with Outlook

Overview

Although our templates are crafted to display correctly across various email clients, users may encounter common display issues when viewing emails in Outlook, particularly versions 2007, 2010, or 2013.

Common display issues

• Images appear skewed.
• Background images do not appear.
• Unwanted horizontal white lines.
• GIFs appear as flat images.
• The email looks different when forwarded.
• Rectangular buttons instead of round ones.
• Images not rendering.

Images appear skewed

Outlook does not resize images that are 1000 pixels or wider. Instead, these images are displayed at their actual size, which can distort the width of your template. We suggest using images between 400 and 650 pixels wide for optimal display.

Learn more about adding images to your file manager.

Background images do not appear

Background images may not display in some versions of Outlook. To ensure your emails appear correctly to all recipients, we suggest choosing a fallback background color. This color will display in place of the image in email clients that do not support background images, like certain versions of Outlook.

Unwanted horizontal white lines

Unwanted 1px horizontal lines are a known issue in certain versions of Outlook. A reliable fix hasn't been found yet, but efforts are ongoing. The problem appears to be linked to factors like:

• Line height.
• Font size.
• Content length.

While a definitive solution isn't available, adjusting the font size and line height may help reduce the occurrence of these lines.

GIFs appear as flat images

Outlook doesn't support GIFs in emails. Instead of animating, Outlook displays only the first frame of your GIF as a static image.

The email looks different when forwarded

Forwarding emails, especially in Outlook, can frequently disrupt their original layout and functionality. When subscribers forward emails using their email client's forward button, several issues may arise:

1. Layout alteration: Email clients often apply their own formatting or remove certain styles, leading to misalignment of images, text, and buttons.
2. Duplicated elements: Elements such as buttons might appear duplicated after forwarding, affecting the email's appearance and functionality.
3. Image display issues: Images may fail to display correctly due to broken paths or removed HTML attributes, impacting the visual content of the email.

While these issues can occur with other email clients, they are more common and pronounced with Outlook. It's important to consider these factors when designing emails to ensure consistent display and functionality across different email clients, especially when forwarded.

TIP: Adding a View Online link to your emails is recommended. This allows your subscribers to easily share the email while preserving its format. It also provides an alternative way to view the email in a web browser if it doesn't display well in their inbox.

Rectangular buttons instead of round ones

In Outlook, buttons designed with rounded corners appear as rectangles because Outlook doesn't support the CSS property "border-radius." To ensure your buttons have rounded corners in Outlook, we recommend creating an image of the button and inserting it into your email. Attach a link to the image so recipients can click it to go to the intended URL.

Images not rendering

Images may not appear in certain versions of Outlook because external images are blocked by default. Subscribers using these versions need to click the Download pictures button to view images.

Subscribers can change this default setting to automatically download images.

TIP: To ensure recipients understand the content even if images are blocked, add ALT text to your images. This helps convey the image's message and encourages recipients to unblock them.

How to mitigate the impact of such issues

While we cannot resolve all of these issues completely since some are beyond our control, you can consider the following suggestions to minimize their impact:

• Test your emails thoroughly across different email clients using platforms like Litmus.
• Optimize image display by keeping images between 400 and 650 pixels wide, and use JPEG or PNG formats.
• Ensure GIFs communicate the main message clearly in the first frame.
• Include a "View online" link in your emails to facilitate easy sharing and avoid display issues associated with forwarding emails.