Thursday, August 29, 2013

What is X-UA-Compatible meta tag and its use ?

The X-UA-Compatible meta tag allows web authors to choose what version of Internet Explorer the page should be rendered as.

Here are your options:
"IE=edge"
"IE=10"
"IE=EmulateIE10"
"IE=9"
"IE=EmulateIE9
"IE=8"
"IE=EmulateIE8"
"IE=7"
"IE=EmulateIE7"
"IE=5"es 

Detailed explanation about X-UA-Compatible meta tag options:
Internet Explorer supports a number of document compatibility modes that enable different features and can affect the way content is displayed:

IE10 mode provides the highest support available for established and emerging industry standards, including the HTML5, CSS3 and others.

IE9 mode provides the highest support available for established and emerging industry standards, including the HTML5 (Working Draft), W3C Cascading Style Sheets Level 3 Specification (Working Draft), Scalable Vector Graphics (SVG) 1.0 Specification, and others. [Editor Note: IE 9 does not support CSS3 animations].

IE8 mode supports many established standards, including the W3C Cascading Style Sheets Level 2.1 Specification and the W3C Selectors API; it also provides limited support for the W3C Cascading Style Sheets Level 3 Specification (Working Draft) and other emerging standards.

IE7 mode renders content as if it were displayed in standards mode by Internet Explorer 7, whether or not the page contains a directive.

Emulate IE9 mode tells Internet Explorer to use the directive to determine how to render content. Standards mode directives are displayed in IE9 mode and quirks mode directives are displayed in IE5 mode. Unlike IE9 mode, Emulate IE9 mode respects the directive.

Emulate IE8 mode tells Internet Explorer to use the directive to determine how to render content. Standards mode directives are displayed in IE8 mode and quirks mode directives are displayed in IE5 mode. Unlike IE8 mode, Emulate IE8 mode respects the directive.

Emulate IE7 mode tells Internet Explorer to use the directive to determine how to render content. Standards mode directives are displayed in Internet Explorer 7 standards mode and quirks mode directives are displayed in IE5 mode. Unlike IE7 mode, Emulate IE7 mode respects the directive. For many web sites, this is the preferred compatibility mode.

IE5 mode renders content as if it were displayed in quirks mode by Internet Explorer 7, which is very similar to the way content was displayed in Microsoft Internet Explorer 5.


Edge mode tells Internet Explorer to display content in the highest mode available. With Internet Explorer 9, this is equivalent to IE9 mode. If a future release of Internet Explorer supported a higher compatibility mode, pages set to edge mode would appear in the highest mode supported by that version. Those same pages would still appear in IE9 mode when viewed with Internet Explorer 9.

Footnote:
When using the tag <meta http-equiv="X-UA-Compatible" content="IE=Edge"> you will not be able to validate the page successfully. I would say to ignore this but if you must have page validation change the > to /> and it will validate without issue and still work.

If I don't have "X-UA-Compatible" in headers, what would happen?
Basically what happens is when you have the X-UA-Compatible it tells IE how to behave in regards to the value you set (IE=edge etc.) if it is not there IE will show the site how it thinks best it should be shown. That could be compatibility mode or that could be the latest version of IE. Whatever Microsoft/IE thinks is best. Make sense?