Outlook is a popular email client used by millions of people worldwide. However, there are some nuances that can affect your email design and formatting. In this article, we'll discuss some common issues and provide tips to help you avoid them.
Before you gest started
It should be noted that Audience Republic makes every effort to resolve any problems on our platform that are under our control. Audience Republic cannot, however, alter how emails appear after they are sent in Outlook because these are Outlook-specific problems.
Like most marketing platforms, Audience Republic supports the most recent versions of Outlook. They are optimized for modern HTML and CSS in emails. Unfortunately, older versions may not fully support these standards, which can lead to more issues.
My text appears squished in Outlook
If your Text appears pushed against an image/button or is squished amongst other content, try this:
- Click on the Content
- In the Sidebar, under Block Options, decrease the Left & Right Padding
- Also, change the Content Padding
My image or text content is being cut-off, rescaled or isn't loading
This occurs in Outlook when a very long image is inserted into an email. The limit for image length is approx. 1728px tall and Outlook will clip the excess off the top of images larger than 1728px.
- An alternative to this is to crop the image into separate images and insert each image into one Row.
- For content issues, avoid using inline styles or unsupported CSS: We recommend checking out Microsoft's documentation on what HTML and CSS are supported in Outlook. You can find more details here: MSDN Documentation for Office CSS and HTML Support.
- Additionally, if you're using a version older than Office 2007, an upgrade is highly recommended, as there are significant differences between the 2007 version and earlier editions.
- Lastly, try saving the email as a file and viewing it in Firefox. This will allow you to see how Outlook alters the email content.
My image isn't the right size
Outlook doesn't recognise the HTML that constrains images. So if you use HTML to resize an image uploaded to an email or template, it will likely display at the original size in Outlook.
Make sure you resize the image before uploading them to the email builder, or use the "Apply Effects & More" image editor to resize them in the email builder:
There are gaps in my email content
This is usually because of how Outlook marks the page breaks in your content, creating a ‘page break’ in really long content, approx. 1800 pixels down the page.
- We suggest editing the layout and content of your email
- Make sure you duplicate your email before making changes
- Try moving your images
- Continue making changes and testing your layout until the white space is gone
Background image - Email client compatibility
According to our tests, the following clients do not support background images:
- Outlook desktop on Windows (However, background images work on Outlook 2011 & Outlook 2016 on OS X, and on outlook.com)
- Lotus Notes 7
- free.fr email client
- T-Online.de email client
- Xfinity / Comcast email client
We always recommend setting a background colour similar to your background image. This way your design will still work if your background image fails to display.
My background image doesn't appear
This is an issue with Outlook as well as many other email clients. Without altering the template code, there isn't a quick fix to force the background image in a custom-coded template to display.
My animated GIF doesn't work
Outlook doesn't support animated GIFs. Rather, it will display the first frame of the GIF in your email, so ensure the most essential information is on that frame.
Extra white space is showing in my content
Since Outlook renders HTML using Microsoft Word, white spaces are often inserted above an image. This happens because Outlook displays email on a computer screen - like how 'print preview' displays. If the image falls between what Outlook recognises as two separate pages for that particular section, extra space is inserted above the image which moves the image down to the next page.
Removing the extra white space requires re-organising your content:
- Firstly, duplicate your email
- Determine where Outlook is marking the page break in your content: If there's an image beneath the white space, move the image to another area in your email layout
- Send a test email to see if this fixed the issue.
- Continue moving the image around and testing your email until the white space is removed.
*Please note: Audience Republic cannot fix the way Outlook or other email clients display HTML emails*
White lines are appearing in-between text
- Why is this an issue? While Microsoft knows about the bug, testing suggests the bug appears when Outlook converts pixels to points and ends up with a decimal number. As a pixel is 0.75 of a point (at 96DPI), our pixel values can end up uneven (e.g 18px X 0.75 = 13.5pt).
Prevention:
- Make sure your email's font size, line height, padding, margin and any other coded pixel numbers are even-numbered
- Split the text into smaller paragraph sections
Unicodes are appearing in-between text and paragraphs
Unicodes are used to indicate problems when a system is unable to render a stream of data to correct symbols.
The Unicode (replacement) character � often appears in place of space between text and paragraphs.
Example 1: 
Example 2:
To correct this, remove the spaces and add a new text box for each new paragraph to create natural spacing:
Then use the Padding tool to add extra spacing in-between the text boxes:
Avoid Copy-Paste: Do not copy and paste directly from programs like Microsoft Word or Outlook, as these can include hidden formatting that doesn't work well with emails.
Paste as Plain Text: If you need to use text from these programs, they should first paste it into a basic text editor like Notepad, which removes any special formatting. After that, they can copy from Notepad and paste it into Beefree.
Format in Audience Republic: Once the text is in Audience Republic, format using the tools provided.
Check and Set Character Encoding in Microsoft Outlook:
- Open Microsoft Outlook and go to File > Options.
- In the Outlook Options window, select Advanced from the left-hand menu.
- In the International options section, ensure Automatically select encoding for outgoing messages is set to Unicode (UTF-8).
- Click OK to save the changes.
To Check Character Encoding Settings on a Mac:
- Open System Preferences and navigate to Language & Region.
- Click on the Advanced button.
- Under Character Encodings, select Unicode (UTF-8).
- Click OK to save your changes.
To Repair Microsoft Outlook:
- Close Outlook.
- Open the Control Panel and go to Programs and Features.
- Select Microsoft Office and click Change.
- Choose Repair and click Continue.
- Follow the on-screen instructions to complete the repair.
To Reinstall Microsoft Outlook:
- Uninstall Outlook from your computer.
- Download and install the latest version of Outlook from the Microsoft website.
My images appear oversized in Outlook
Outlook has identified this issue and recommended the following fixes:
1. Make sure that your image size settings are set to Manual width rather than Auto width.
2. Try to change the DPI settings of your image files. DPI stands for "dots per inch," and it affects how large or small an image appears on your screen. If your DPI settings are too high, you may end up with enlarged images in your email signature or messages. You can use an image processing tool such as Photoshop to change the DPI setting on the image. Alternatively, you can use an online tool such as [this one] to resize your images and reduce their DPI. 3. Another option is to disable the automatic resizing of images in Outlook. Outlook may resize large images to fit the message window, but this can cause distortion or quality loss. You can turn off this feature by going to File > Options > Mail > Compose messages > Editor Options > Advanced > Display email content. Then, uncheck the box that says "Automatically resize pictures to fit the message window" and click OK.
4. Ensure your Outlook is up-to-date. Sometimes these issues are resolved by software updates.
Still need help?
Contact us at [email protected]