Internet Explorer 10 to No Longer Support Conditional Comments

We use conditional comments to target specific versions of Microsoft’s Internet Explorer browser (MSIE), mainly through our ie_conditional_tag. This returns a block of markup that applies various class names to the tag, like this:

    <!DOCTYPE html>
    <!--[if lt IE 7]><html class="ie ie6 some-custom-class"><![endif]-->
    <!--[if IE 7]><html class="ie ie7 some-custom-class"><![endif]-->
    <!--[if IE 8]><html class="ie ie8 some-custom-class"><![endif]-->
    <!--[if IE 9]><html class="ie ie9 some-custom-class"><![endif]-->
    <!--[if gt IE 9]><html class="ie some-custom-class"><![endif]-->
    <!--[if !IE]><!--><html class="some-custom-class"><!--<![endif]-->
        <title>New HTML5 page</title>
        <!-- your content -->

This lets us target older versions of MSIE specifically to improve our experience across browsers. Microsoft’s development team intends to remove "the less-successful legacy features" in Internet Explorer 10, and one of those is conditional comments.

The main reason for conditional comments and targeted styles has been the slow pace at which enterprise IT departments upgrade their systems. There are just a lot of users on older browsers, and by ignoring them, we are ignoring customers. That may be considered a good thing for certain markets, but not everyone has that luxury

Many enterprise companies recently upgraded to IE7, which was initially released in 2006. This is due to large amounts of legacy enterprise software ("legacy" and "enterprise" being two words which keep us up at night) that rely on browser specific code, mainly in versions of JavaScript or other proprietary scripting. That code must be rewritten to an open standard (ideally) before it is usable in newer browsers.

Playing Nice While Looking Forward

It’s almost impossible to have a stylesheet targeted at new browsers work flawlessly in old ones. We can use Modernizr to provide HTML5 elements and access to other polyfills.

Internet Explorer 9 is already a very robust browser and has support for many of the cutting edge elements in HTML and CSS that we’ve started to explore. Microsoft has also announced that it will begin doing automatic updates on browsers in Windows XP, Vista, and 7

This doesn’t mean that our conditional tag won’t continue to do what it’s always done. Older browsers will self-register and add the class to the tag. And by writing valid markup, we can avoid a lot of the issues between browsers. For those of us who still have to make MSIE6 and it’s younger cousins work, there’s a lot of documentation out there to get us there.

If we need to target in the future, we can use a browser detection javascript and then use a conditional array to add classes on document.ready to our page. While it requires javascript, the default rails applications do as well for the destroy method, so this shouldn’t be a major problem for most of us.

Have fun in the trenches!