Windows 10 Mail Email Rendering Support + Quirks

[ 0 By

Windows 10 Mail is one of the newest email clients to be added to Previews. To help you get the most out of your email previews, we’ve highlighted what its email rendering support is like and any quirks you can expect to see in it.

Windows 10 is the successor to Microsoft’s Windows 8 operating system, released to consumers in July 2015. Initially Windows 10 was offered as a free upgrade to any customer with a legitimate copy of either Windows 7 or 8. By October 2015 Microsoft reported that there were over 110 million devices with Windows 10 installed, and as of June 2016 that number has risen to nearly 350 million devices.

While Outlook is usually the email client you would associate with a Windows environment, Windows 10 has its own default mail app–Windows Mail. The Windows Mail app has been included in Windows Vista, 8, and 10 operating systems.

Users can use their Gmail, Yahoo, iCloud, AOL and custom IMAP accounts–there’s no need for a Microsoft account. This, combined with the fact that the Mail app is free with Windows 10, makes the app an incredibly accessible email client.

Windows 10

Overall desktop opens in Windows 10 Mail have increased from just under 3% in March 2016 to nearly 6% by July 2016, with each month seeing an increase over the previous month’s market share. This steady rise in market share is an indication that email marketers need to be aware of this increasingly popular email client.

Do your subscribers open in Windows 10 Mail?

Find out where your subscribers open email and focus your development & testing efforts on the clients and devices that matter most.

Explore email analytics →

 

App View

There are very few app view customization options available to users in Windows 10 Mail. For example you can’t add any folders to the left-hand window pane. The default view shows three columns, with the email selected by the user shown in the right-hand pane.

The entire Mail window can be made smaller by collapsing the left-hand column.

Windows 10 Mail

With this three-column view, the right-hand pane where emails will be viewed could be restrictive in width, depending on the resolution set by the user. To have as little horizontal scrolling as possible for Windows 10 Mail users, keep the max-width of your emails to 650px.

The Envelope

Your email’s from name, subject line and preview text are all visible to Windows 10 Mail users in the inbox listing view. The from name is the most visible part of the email envelope in the email listings view. Using a recognisable and consistent from name will help subscribers find your emails quickly.

As for your subject line and preview text–you’ve got 34 characters for both, to engage your subscriber enough to open your email. The preview text is displayed directly underneath the subject line, so be sure to craft your preview text with your subject line in mind.

How do your emails look in Windows 10 Mail?

Email developers should be familiar with some of the quirks of how Windows 10’s Mail app renders HTML. Since it uses Microsoft Word as its rendering engine, many of the rendering quirks email developers experience in Outlook will also be experienced in Windows 10 Mail.

Background Images

Background images are, as in Outlook, not supported. The go-to solution to combat this issue in Outlook 2007/10/13 uses a combination of VML and HTML to enable background images. However, this doesn’t work in Windows 10 Mail.

This should act as a reminder to not use background images to visualize important messaging in your email. However, they can be used as an added bonus, or finishing touch to email designs. If you do use background images in your emails, be sure to thoroughly test and have fallbacks in place, such as a background color, for when background images aren’t supported.

Web Fonts

Web fonts are sadly also not supported. However, unlike Outlook, where a hack has to be used so that web fonts don’t fallback to Times New Roman, this isn’t needed in Windows 10 Mail. As long as there is a web safe font in your font-family, that font will render in Windows 10 Mail.

font-family: ProximaNova-Regular, Arial, sans-serif;

In the example above, the web safe font Arial will render for Windows 10 Mail users.

Now available in all Litmus accounts

Sign up for a Litmus account today to start testing your emails in Windows 10 Mail app.

Try Litmus free →

 

Auto-Linking and Underlining

Another rendering quirk that’s not new to developers is auto-linking of mailing addresses and telephone numbers, in blue and with a dashed underline.

Windows 10 Mail

A useful feature for users on mobile devices but an annoyance on desktop devices. Rather than using a hack to remove this functionality entirely, these links can be styled to match your email’s design.

Wrap addresses and telephone numbers in <span>s, and in the <head> of your email create a class to style these links:

.addressLink a {color:#c0c0c0!important; text-decoration:none!important;}

In the HTML wrap any address in a <span>, which you’d like to be styled to match your email design, with the appropriate class name:

<span class="addressLink">123 Avenue Road, USA, Earth</span>

Learn more about this quirk at the Community, where Community member James White has dug into why this happens in Windows 10 Mail.

Windows 10 Mail is also guilty of automatically underlining links in your email, even when inlined CSS for a link explicitly defines the link to not have an underline. The fix is simple.

Place:

a {text-decoration: none;}

In the <head> in your <style> block of your email code. Now all links in your email won’t have an underline. The unfortunate downside of this is if you do want some links in your email to have an underline, the “text-decoration” attribute needs to be reset inline, per link.

While you’re adding the above bit of CSS into your <style> block you may also want to consider adding CSS to style visited links too as these will have default styling attached to them.

Simply add:

a:visited {color:#c0c0c0; text-decoration:none;}

To your <style> block to style visited links.

Animated gifs

It shouldn’t be a surprise to hear that animated gifs are not supported in Windows 10 Mail. Similar to Outlook, only the first frame of the animation in the gif will appear to the user. So make that first frame count.

Send us your bugs

Submit your feedback and rendering bugs by sending an email to outlook@litmus.com. Litmus is collecting bugs the community finds in an effort to make email better. Learn about the Microsoft Partnership.