It’s every email marketer’s least favorite inbox, and yet for B2B email marketers, the Outlook inbox is the most likely place our emails will land. Outlook is notorious for wreaking havoc on design elements, blocking attractive images, and making email marketers cry, but despite the problems it causes, it’s still the fourth-most popular inbox in the world, according to Litmus’ http://emailclientmarketshare.com/:

Email Client Market Share

 

While we can’t change the fact that Outlook is the bread and butter inbox for B2B, we do hope our B2B email marketer’s guide to Outlook can ease your pain, even if just a smidge. Here’s what we’ve learned from sending to Outlook over the years:

 

First, is this guide for you?

The best way to know is to check a device report, which you might find in your marketing automation platform. In the emfluence Marketing Platform, for example, you can look under the Device Report to see what percentage of your recipients are opening your emails in Outlook (remember there are multiple versions of Outlook as well—each with their own thorny issues). If you find that a number of your recipients are opening your emails in Outlook, then yes, this post is for you!

Device breakdown

 

Incorporate Outlook Images with Care

By default, most Outlook users have automatic image download turned off—which of course limits which parts of your design your recipients will see. If the majority of your recipients are using Outlook, then you’ll want to plan your designs accordingly. Definitely don’t go with an all-image email, like below:

Images Turned Off

 

For the images you do use you’ll want to create an image with the exact pixel width you plan to use in your design. Generally speaking, that means a banner with a width of 600px. Outlook has a tendency to ignore resizing in code AND will take you at your word if you use width=”100%” (you’ve seen those emails with gigantic header images suffering from this). If you use the emfluence Marketing Platform, you’ll see a warning if your image size exceeds the layout, like so:

Outlook Rendering Image

 

Something else that’s important to know about images: most marketing automation platforms or email service providers use pixels to track when an email is opened. With Outlook, you might not get the full report on everyone who has opened your email if they don’t download images. One way to get around this is to make sure your text introduces an image that adds value to the overall email—this might entice your recipients to download images.

 

Don’t forget to use alt text on ALL of your images as well. Not only does this improve the experience for recipients using screen readers, but leveraging alt text also tells recipients what the image is—and whether or not they want to download it.

 

A note about splicing images

Think you’ll be crafty and splice images so your content will load quicker? Outlook often adds padding between spliced images, which can lead to bizarre renderings. There are some code tips to get around this, but ultimately, image-focused layouts are not a great choice if the majority of your list is using Outlook.

 

GIFs and Videos

Moving visuals and embedded videos offer a ton of value to an email, but they’re difficult to execute in Outlook. Most versions of Outlook will only show the first frame of your GIF, which means you’ll want to get that first frame spot-on perfect. GIFs can contain a maximum of 256 colors, so animation should be kept to a similar color palette to prevent ugly results, and be sure to keep your file size below 2MB to avoid deliverability problems.

 

For video, be sure to set a fallback image and remember that most versions of Outlook won’t play the video within the email—you might consider embedding the video in a landing page if you’re not comfortable sending the recipient to a video platform.

Video Image

 

Background Images

You guessed it, Outlook won’t display these by default either, and sometimes, applying these with a traditional HTML structure won’t work. Use background colors as a backup or consider using Vector Markup Language in these cases.

 

No, You Can’t Unsquare Your Buttons

Rounded corner buttons are indeed lovely, but in Outlook, they won’t display correctly. Even if you code your buttons with rounded corners or use emfluence’s drag and drop buttons with rounded corners, the result is the same: Outlook will not support your rounded corners.

 

How Emails Render in Outlook (Design Tips)

Fun fact: Outlook renders emails in Word format, which means your email design will translate about as well as a Word document. Formatting can’t be forced, and modern formatting (e.g., divs) that would otherwise allow you to code attractive emails aren’t always supported on various versions of Outlook. You can use tables, table cells, and table rows, or if you’re using the emfluence Marketing Platform, you can take comfort in the fact that our drag and drop email builder will correct formatting issues like this for you.

New Drag and Drop Editor

 

This Word-based rendering can also create problems for long emails, which Outlook might treat as long text documents. If your email is longer than 1800 pixels, there’s a chance Outlook will render a page break (e.g., white space) at 1800 px intervals. To avoid this, ask yourself if the email really needs to be that long, and if it does, then strongly consider how your tables are playing together. Embracing the scroll is fine, as long as your content is worthy of a very long scroll.

 

Font Rendering

Fonts require a little extra love in a number of inboxes, so Outlook isn’t alone in this. If you want to avoid your email text from falling into the default Times New Roman, set a fallback font (or several) like Arial, Tahoma, Trebuchet, Veranda, etc. If you do want to use a brand or custom font, Outlook isn’t fond of Google Fonts. In some cases, your font stack won’t work and you’ll wind up with Times New Roman. To work around this, we recommend:

<!–[if mso]>

<style type=“text/css”>

body, table, td, span {font-family: Arial, Helvetica, sans-serif !important;}

</style>

<![endif]–>

For more information on fonts in Outlook, check out this post from Email On Acid.

 

A Special Note on Hyperlinks

Did you know that you’ll need to include the full URL on your links if you want them to display correctly in Outlook? Add the https:// to your hyperlink, and if you want hyperlink text, know that Outlook will likely turn your links purple or blue and that your text will likely show as underlined. In the emfluence Marketing Platform, you can override this with:

code-url-underline

 

Preflight EVERYTHING in Outlook

We always recommend using preflight and rendering tools like Email On Acid, but if you’re sending to a lot of Outlook inboxes, preflight is crucial. An integration with Email On Acid is included with every emfluence Marketing Platform account, and we especially like that it offers preflight tools specific to Outlook, like the ability to preview what your email will look like with images turned off:

Email Pre Flight LG

 

We also recommend spending a little time with the text-only version of your emails as well as a preventative measure for rendering issues.

 

How Outlook Fits in Your CRM Strategy

Is your CRM tied into your email marketing strategy? If you’re leveraging your marketing automation platform to do some lead nurturing work for you, create an Outlook-style email template that you can use to automate sales messages from. You’ll want to pull in record owner (from your CRM) and dynamically send your emails from the person who owns that record, for starters. For deeper personalization, consider pulling in custom data points from your CRM (like contract dates, competitor names, regions, and more). You may also want a dynamic version of your email signature saved as a content block for easy use.

With variables:

Populated:

 

And Finally…

We know that B2B email marketing comes with its own set of issues (okay, mostly just Outlook), and if you’re in need of a friendly ear to brainstorm or commiserate, reach out and let us know!

Leave a Reply

Your email address will not be published. Required fields are marked *

 

Ready to give it a go?

Request a demo