---

Meta tags are a mysterious topic in the world of email development. Many tags are included “for good measure” without the developer knowing quite why it’s there. In normal HTML development, meta tags cover any metadata not already covered by <base>, <link>, <script>, <style> or <title>.

I’ll cover some of the common uses for these tags in email, as well as some commonly seen tags that you may not really need.

Format Detection

<meta name="format-detection" content="date=no">
<meta name="format-detection" content="telephone=no">

These simple tags stop iOS from turning your phone numbers and dates into links. You may or may not want to use them. Personally, I think that linked numbers can be very helpful if you want a customer to contact you or save your information to their calendar. On the other hand, Apple’s default blue may not go well with your email’s color scheme. These make for an easy way to prevent this behavior without trying to override or fool iOS.

Viewport

<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=no;">
<meta name="viewport" content="width=600,initial-scale = 2.3,user-scalable=no">
<meta name="viewport" content="width=device-width">

These metatags can be used to control the size at which a browser displays your email. In our testing in 2013 as well as during my research for this article, I found that the various viewport meta tags had no effect on the initial display or responsive behavior of the email. The max-scale attribute can prevent users from zooming in, but that’s not very helpful to people with vision problems.

When smartphones and tablets were just coming out, the purpose of the viewport tag was to tell browsers that your content was coded to adapt to smaller device widths or to a specific width. This helped to enable responsive behaviors in those clients, by letting the browser know you were ready for smaller display screens. On the other hand, adding this tag to a non-responsive site would force the browser window to display only the top-right corner of the zoomed-in content. So the tag had to be used carefully. Read this blog for more info on that.

If you have found a use case where the viewport metatag improves the customer experience on email, please let me know!

Charset

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

This tag is important for preserving your character encoding across various email clients. However, regardless of this tag, some email clients will force you to use their encoding (UTF-8) upon receiving your email, and ESPs will use their default encoding upon sending. Check out our blog on The Importance of Content-Type Character Encoding in HTML Emails for more info. The solution? Use our free character converter to ensure that your characters are preserved across various encoding formats. The character converter tool is also available for use within our free Email Editor.

TRY THE EMAIL EDITOR

So why include this tag at all? It’s important to include for display in browsers, especially if you include a “View as webpage” link. Most browsers default to UTF-8, but not all will. Some versions of Internet Explorer default to ISO-8859-1, and some Chinese browsers default to Big5. If you’re not using UTF-8, then it’s especially important to declare the charset.

IE=Edge and IE=X

<meta http-equiv="X-UA-Compatible" content="IE=7" />
<meta http-equiv="X-UA-Compatible" content="IE=8" />
<meta http-equiv="X-UA-Compatible" content="IE=9" />
<meta http-equiv="X-UA-Compatible" content="IE=edge">

The IE=Edge tag enables responsive behavior in Windows phones, which is VERY welcome for email developers. However, it will also break all of your images in Live Mail (God knows why, thanks Microsoft!). The solution is pretty simple though: just wrap your IE=Edge meta tag in a conditional comment to hide it from Live Mail, as I have it below. Check out our blog on that topic for more info.

<!--[if !mso]><!-- -->
  <meta http-equiv="X-UA-Compatible" content="IE=edge" />
<!--<![endif]-->

The various IE=X tags (IE=7, IE=8, IE=9) are used to force a browser to display the code in a “legacy document mode.” Usually, though, email developers have no desire to turn the clock back to the days of Internet Explorer 7. I would not suggest using these in email code, though there may be some edge cases.

Did we miss any meta tags?

That covers all of the meta tags that I regularly see used in email. If we missed any tags, or any uses for the tags listed above, please let us know! We’d love to make this post as complete a resource as possible.