Outlook 2010 Beta


First, the good news: Outlook 2010 Beta is now available for email testing within Litmus. The bad news: this version of Outlook still uses the Microsoft Word rendering engine to display emails.

This means, sadly, that Outlook 2010’s support for email standards is just as poor as Outlook 2007’s. In fact, there’s no discernible difference between the two.

So what’s new for email designers?

One particular feature stands out. Some emails get special treatment—a link to view the email in a web browser. This link shows up within the Outlook interface itself, above the email. Here’s an example:

Outlook's view in browser link

When this link is clicked the recipient sees a security warning, then the email’s HTML version is opened in their default browser. Any browser’s rendering is going to be significantly better than Outlook’s native rendering, so this is bound to be an improvement for your readers. It’s quite a neat feature (of course, it also serves as a tacit admission by Microsoft that their rendering engine is broken).

How do I get this special link to appear?

Not all emails get this special ‘view in browser’ link. It’s not immediately obvious what triggers it, so I spent a few hours experimenting. I’ve now discovered the magic CSS code you need to include that’ll ensure this link is shown for all your emails. Here it is:

#ForceOutlook2010BrowserLink span { padding: 0px; }

Show expanded example

Place the above line of CSS code inside your <style> tags, within in the <head> of your HTML. The ID can be named anything, but using something long and self-explanatory is a good idea. (Note: this code won’t affect your design.)

Update: March 26
After some further investigation with Edward Williams I’ve found that including the following line of HTML at the bottom of your message also achieves the same thing.

<span style="padding: 0px;"></span>

If you’ve already got a <style> block in your email I’d favor the CSS option. If not, the HTML option is probably cleaner.

How will my email render in their browser?

Since some Outlook 2010 users may now view your email in their web browser, it’s a good idea to test your email template in a few common web browsers, too. You can do this using Litmus. Just host your email’s HTML on the web and point Litmus to it in a new browser test. I’d recommend checking in at least Explorer 7, Explorer 8 and Firefox 3.

I’d love to hear about your experiences with Outlook 2010. If you have any tips to share, drop me an email.