Problems with X-UA-Compatible meta tag and browser redirect

0
votes

I'm currently working on a new web project and have some issues optimizing it for Internet Explorer (huh, who would've thought that?) ... I want to support IE8+ but redirect IE 7 and earlier to an alternative page, recommending the download of another browser. For IE8 I want to display a message, recommending another browser, but not redirect it. In IE 9+ everything's fine. First problem I came accross was, that IE10 always rendered the page in Compatibility Mode, using IE7 Standards and making the page look shitty. So I introduced the X-UA-Compatible meta tag like this:

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

Then I tried to realize the redirect for IE7 and below using

<!--[if lte IE 7]> 
        <script type="text/javascript"> 
            document.location.href = "outdated.html"; 
        </script> 
<![endif]-->

Testing the page in IE11 in the different modes using F12 just wouldn’t do the redirect and displays the page crappy in IE7 and below, so I assume the X-UA-Compatible meta tag breaks the conditional comments. Nonetheless, without the tag all IE versions lower than IE10 are redirected even if the conditional comments says "lte IE 7" ...

I don't seem to be able to solve this myself, so any help will be appreciated! :)

Cheers, Rob

1
internet-explorerredirectconditional

1 Answers

0
votes

IE by default uses compatibility mode if the website is served from localhost or intranet.

You can read more about it here

In an enterprise environment, some areas have lower risk for compatibility issues. For example, Intranet Zone websites use Compatibility View by default.

You can not override that using meta tags like you do.

Instead you need to send HTTP Header:

X-UA-Compatible: IE=edge

Similar question is answered here

If you are using .NET then you can add this header using IIS configuration or making changes in web.config file:

<httpProtocol>
    <customHeaders>
        <clear />
        <add name="X-UA-Compatible" value="IE=Edge" />
    </customHeaders>
</httpProtocol>