Internet Explorer 6, Enough is Enough

The contents of this article may be out of date. It has been archived and will no longer be updated, comments are closed and the page is provided for reference purposes only.

One of the biggest headaches for wed designers is the lack of uniform support for web browser standards. Standards exist and common sense dictates if everyone is using the same standards everything should be the same, however that is not the case. How browsers interpret standards differs and to make things worse others (Microsoft Internet Explorer) either totally ignore or make up their own rules.

The use of @import to reference stylesheets was one of the first techniques web designers used to solve the problem of an antiquated browser causing problems. This technique stopped NN4 from loading the CSS, and displayed an un-styled HTML page.

Later, IE5/Mac became a problem so designers began giving it the same treatment NN4 was receiving by using the backslash comment hack:

/* import stylesheets and hide from ie/mac \*/
@import url(“style.css”);
/* end import and hide */

In recent years IE6 has become the source of our frustrations — alpha-channel PNGs, min-width, max-width, rendering bugs galore. The problem with IE6 has been the number of people still using it. Many academic, government and corporate environments still use IE6, W3Schools reports 14.5% of web browsing is still done on IE6. The issue is IE does not upgrade itself in the same way almost all other browsers do. Firefox, Safari, Chrome and Opera all by default update themselves to the latest version. IE‘s latest and theoretically most stable and secure release IE8 has significantly less uses than IE6.

For a few years I have spent a fair proportion of the time it takes to develop a website dealing with IE6 quirks, and now its time to stop. IE7 has far less issues than IE6 and takes far less time to support.

Conditional comments have been about for a while and have been used in may of the solutions answering problems with IE6.

<!—[if gte IE 7]><!—>
  <link rel=“stylesheet” type=“text/css” media=“screen, projection” href=“style.css” />
<!—<![endif]—>

A combination of the two above techniques hides all styles from IE browsers lower than IE7, NN4 and IE5/Mac. Visitors using IE6 or lower will get an unstyled view of the site, just like visitors using NN4 and IE5/Mac have been getting for years now. An alternative would be to use conditional comments to give IE6 users a style sheet of their own however this involves extra work that in most cases is superfluous.

Completely ignoring a browser in terms of CSS is a wonderfully freeing feeling. However you need to be upfront with clients about the support you offer. Check web statistics if they are available before you start a project and assess the amount of traffic coming from IE6 browsers. I will still support IE6 for my clients but at a cost to them otherwise it is time to move on.

This article was posted on 15 May 2009 in CSS

That's the end of this article. I hope you found it useful. If you're enjoyed this article why don't you have a look around the archives, where you can find some more tutorials, tips and general ramblings.