How I Might Deal with IE6

Eight years ago (almost to the day), Jeffrey Zeldman wrote, To Hell With Bad Browsers, signaling the dawning of “The CSS Age”. Explaining how the use of @import for referencing stylesheets is ignored by Netscape 4, was an important step in shedding away the problems related to supporting an ancient browser. Eight. Years.

Completely ignoring a browser in terms of CSS is a wonderfully freeing thing. It certainly can’t be done on every site. The important thing to remember is that it’s a site’s statistics that should determine what level of support you decide to offer.

Later, IE5/Mac became a problem. I began giving it the same “talk to the hand” treatment that NN4 was receiving by using the backslash comment hack years ago:

/* import stylesheets and hide from ie/mac \*/
@import url("screen.css");
/* end import and hide */

Now, in 2009, IE6 has become the source of our frustrations — and for certain sites, giving it an unstyled, naked view is exactly what I want to do. Alpha-channel PNGs, min-width, max-width, rendering bugs galore — there are plenty of sites I’ve designed and maintain where the IE6 stats are low enough to drop the axe and move on. Now is the time!

So what’s the easiest solution? I was chatting with Ethan about using conditional comments to hide styles from IE6 only, and after a bit of Googling, we found Simon Clayson’s article, where he cleverly does the following:


<!--[if !IE]><!-->
  <link rel="stylesheet" type="text/css" media="screen, projection" href="screen.css" />
<!--<![endif]-->

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

This hides all styles (assuming they’re all contained within screen.css) from all versions of IE, but then re-applies them for IE versions 7 and greater. Lucky visitors that are using IE6 or lower will get an unstyled view of the site, just like the lucky visitors using NN4 have been getting for close to a decade.

Simon’s method also serves up a bare-bones CSS file specifically for IE6, but I think that’s being too polite :) Another real-world example of this method in practice, is The Rissington Podcast, which cleverly serves an IE6 stylesheet complete with Comic Sans.

What’s nice about this approach is that you’re not having IE6 import all your styles, having to worry about overriding them later. You could serve IE6 with a minimal stylesheet starting completely from scratch. Or none at all.

Is it a bit hacky? Sure. But in certain situations, not having the burden to worry about IE6 seems well worth it.

Have a better solution? Let us know in the comments.

Update: Commenter Daniel James might’ve simplified things down to a single conditional comment, like so:


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

I’ve tested in Mac: Safari, FF3, Opera and PC: IE6, IE7, IE8beta, FF2. More testing required, but this looks very promising.

103 Comments

  1. Stephanie says:

    Right when you posted this on Twitter I was venting anger at IE for Windows Mobile as I venture into establishing a standard of development practices for my company. I’m about to start building a new version of my own personal website and have decided not to support IE6 and instead serve up something similar to the above. Time for people to move on, even if a little push is needed.

  2. Totally agree.

  3. Joff says:

    This strategy gets my vote although why worry about what IE6 users see at all? Just design for IE7 and everything else, never opening IE6.

  4. I think a uniform method for serving up naked semantic markup to any desktop browsers pre Firefox, Safari, or IE7 is a very reasonable idea. A web page with accessible semantic markup, that degrades gracefully because progressive enhancement and progressive enrichment principles were used, will function just fine without any CSS. It will look just like everything on the web looked in 1994.
    (If your JavaScript stuff for these sites doesn’t work without the CSS, then the pages should be served up sans JavaScript as well… or the JavaScript should check for the required CSS styles itself, and if they are not there, fail gracefully.)

  5. Kael says:

    Good method to trash IE6

  6. Scott Jehl says:

    Cool tip. I guess it depends on whether the client is up for building this ‘cold shoulder’ into their site, though. When some IE6 user hits a site and it comes through in ascii glory, they probably won’t think they’re browser is at fault…
    how bout adding…
    <!–[if lte IE 6]>
    <p>This site looks bad because you’re using IE6. <a href="http://firefox.com">Get Firefox</a>
    <![endif]–>

  7. Bernd says:

    How would I solve this problem? Well, I would add a “less than IE 7 stylesheet” with conditional comments, which hides all children of the body. Then an image will be applied to the body that shows an explanation for the user. Since JS might also be an reason to ban IE 6, this could be more useful.
    I’m currently working on a bigger site and came across some other problems related to IE. It looks like IE 8 still slows down the web evolution. Just think of SVG, HTML 5 or new JavaScript standards. The problem itself is not IE 8, its IE 9 or even 10 which might fix these issues in 3-5 years. This is long way to suffer. Imagine IE 8 would use the Webkit rendering engine :-)

  8. Karl says:

    And to really put the boot in if the site is WordPress powered, you can use this fun little plugin :)

  9. I’m curious what everyone considers to be the threshold for supporting or not supporting IE6. That is, how low should the IE6 visitor percentage be before you drop support? Obviously, the number will vary depending on what kind of site you’re dealing with, but I’m sure we could come up with a range.

  10. This may be a feel good move on the select few sites its possible to do, but should you?
    I’d ask you how big of a problem IE6 is, and where specifically you’re running into issues. And then I’d ask which issues are simply blemishes or warts that you can live with IE6 users seeing and which ones can you not.
    There may be something better then the all or nothing approach in many cases and often it may not have to take much time. For example: just giving IE6 a 10 line CSS file that tweaks column widths so they don’t wrap funny or send you from a flexible layout using min/max width into something fixed is all the level of “support” a site might need while letting warts like lack of rounded corners or png transparency go out.
    For some sites I’ll agree that the time for bending over backwards for IE6 should probably be long over, but the flip side of that is that as professionals we need to look hard at whether we’re being practical and serving our clients well or just being lazy.

  11. mike says:

    IE6 “chumping” taken to the extreme. very nice.

  12. Michal Ordon says:

    I have recently started to serve my pages black and white for IE6 (browsesad.com) but the idea of 365 days of naked CSS day for IE6 sounds just much, much better.
    Also, lol @ The Rissington Podcast.

  13. eraevion says:

    Nice solution.
    But still lot of people are using IE6. I guess our best chance is Microsoft to force every user to update their browsers. Not sure how is it possible to do it with illegal OS, but that would mean a *lot* for webdesigners. And even for those in Microsoft – come on, don’t tell me that they are not having problems while coding for IE6.

  14. I agree with Scott. You HAVE to be upfront with a client before taking this route. A site’s past statistics will obviously show you past use…but it won’t show who will hit it in the future.
    It IS quite exciting though to finally have reached the point where we’re actually leaving IE6 behind!

  15. For clients, I think you should have a clear set of browsers you support, and charge extra for IE6 support.
    If you don’t have clients, but are the web developer for a company or product, obviously look at your server logs. If your audience is 50% IE6 you are pretty much stuck.
    I’m pretty confident that in general the IE6 numbers in January 2010 will be low enough such that “time to upgrade” messages will be more justifiable than the time it takes to make your site look good in IE6. (Especially when combined with the time you can save using CSS techniques that IE6 doesn’t support.)
    I’m already seeing sub-10% numbers at work.

  16. Big D says:

    Nicely done! However, imagine working for an in-house team, developing web apps for company intranet where internal IT standards force entire company to use IE6. Ughhh!

  17. Scott Jehl says:

    argh, sorry. comment foul.
    they’re/their
    missed a closing p tag too. Perhaps IE6 wouldn’t mind… :)

  18. Bohdan Ganicky says:

    Pushup is a useful script as well, recommending upgrade to users with outdated browsers.

  19. Tim says:

    Yet interestingly, they might not need a separate stylesheet. The site appears to render fine in IE 5.5 (as viewed via IETester).

  20. Dave McNally says:

    This is probably the best approach I’ve seen so far. I was recently looking into other articles about giving IE6 a minimal treatment and using this method would make that so much easier than overwriting every other style.
    Consider it bookmarked!

  21. Tim Merrill says:

    IMO this should be a client’s decision, based on statistics when available. We tell clients we are able to charge them less by skipping IE6 development, and offer them a choice to support it or not (for extra money). Seems to work great so far!

  22. Pete says:

    No styles at all for IE6? That’s quite an aggresive put down, should work a treat!

  23. Tim Merrill says:

    Does anyone know why MS doesn’t just send out a patch to IE6 on autoupdate that fixes the damn rendering engine? Where’s the harm in that?

  24. Love that money says:

    I agree with Zachary Johnson.
    To phase out IE6 you have to make it more expensive for the client. From their perspective, they want the site to work for as many people as possible, so they can get more money. If they see that their return for supporting IE6 is is less than the cost, then its an obvious choice to lose it.
    However, if we profit from supporting IE6, by charging extra, then we have to make the decision, how much do we love that money?

  25. Adam Harvey says:

    I’d love to do this. Unfortunately, around 40% of the visitors to the sites I work on still use IE6.

  26. Matt Sanders says:

    I would prefer you send them a stylesheet with “display:none;” applied to the main containing div.
    Thank you.

  27. I agree to a point. For example, when it comes to my personal website or websites that are for things outside of work, I design for IE7 and up. When it comes to web projects for work, I find it hard to shed the need to design for IE6 and higher.
    I remember in a tweet, Eric Meyer posted that there are STILL approximately a million people using IE5. INTERNET EXPLORER 5. I couldn’t believe that. It’s hard to shun the browser when you openly know that so many people are still using a version LOWER than the one you’re shunning. I still feel like I have to “stupid-proof” my website for the sub-par browsers, due to the fact that I don’t want my clients’ website userbase to see an unstyled (or lightly styled) website.

  28. Dan Boland says:

    If only it were that cut and dry. At my company, our stats still show a solid 30-35% of hits coming from IE6, so we can’t ignore these people. So what I do is once I’m done with the design and have to investigate the carnage in IE6, I fix it until it’s just good enough. I don’t break my neck trying to solve everything, I just get it to the point where it’s more or less coherent. The way I see it, they’re probably used to websites looking like shit in their browser anyway.

  29. Jason Beaird says:

    It’s definitely is a wonderful feeling to completely ignore a bad browser, especially with all the cool things we can do with that one browser crossed off the support list.
    When I redesigned my own site I opted to get it as close as I could with as few * html hacks as I could and insert the following disclaimer at the top of the page: “Warning: You are currently using Internet Explorer 6 or lower. While I have done my best to make sure this site does not break in your browser, I am not actively supporting it. Please upgrade your browser or consider switching to Firefox or Chrome. Thank you!”
    If we could provide (at the very least) this kind of nudge with every client project we work on, it wouldn’t be long before IE6 use becomes negligible.

  30. Chris says:

    For personal/small/niche sites this idea is fun and somewhat liberating. BUT. I manage the web presence of a $2 billion company and as someone said above, if my sites look like shit, then my company looks like shit. The poor buffoon using IE 6 and getting a crap experience may be a schlub no one cares about, or the CEO’s golfing partner. Even though IE6 and below on our main site is only about 24%, you never know who’s in that 24%. Odds are it’s the CEO himself…

  31. Tim Hettler says:

    @Tim Merrill: Because many Intranet sites are developed specifically for IE6 and all it’s foibles. The IE Blog talks about “not breaking the web” quite a bit.
    I don’t like the sites that are condescending about people using IE6. Realistically, if someone is coming to your site with that browser it’s because A) they can’t upgrade (work restrictions), or B) they are such computer novices that they don’t know how to do a Windows Update. It’s not because they don’t respect you as a professional and personally want to hold back the State of the Web.
    Unless you’re doing some hyper-advanced web app it’s not that hard to make things look presentable in IE6. If the site is so messed up in IE6 that you’d rather serve it no stylesheets at all, you probably have some fundamental flaws in your code that should be addressed in other ways. Accommodating for older browsers is frustrating at times, but it’s part of our job. Progressive enhancement is the way to go.

  32. Chris Mahon says:

    I do the same as Dan Bolan said, get it working in other browsers and give IE6 a quick check but as long as the content is legible that’s fine for me, small alignment issues and other such things are left.
    I wonder how other people are treating rounded corners now? I’ve started to simply use the -webkit/-mozilla-border-radius instead of the background image approach and if you’re using ANY version of IE then so be it. Anyone else feel the same way?

  33. @ Daryn St. Pierre: I don’t see how that “1 million users of IE 5″ stat could be accurate. The best stats I’ve seen are here: http://marketshare.hitslink.com/browser-market-share.aspx?qprid=2.
    IE 5 only has a .04% market share. IE6 has a market share of around 20%, which seems pretty accurate for most main stream sites.

  34. Tobias Batt says:

    I suggest using:
    @import “modern.css” screen;
    for modern browsers and then in a conditional comment for IE7 import the CSS like normal, seeing as IE does not understand the rule IE6 wont get any styles.

  35. Paul Redmond says:

    Dan,
    Another viable option is a Google Code project by Dean Edwards called ie7-js.
    http://code.google.com/p/ie7-js/
    While I like the idea of banishing IE 6 forever, sometimes the user-base warrants its usage. This has come in very handy!

  36. Tim Merrill says:

    Sounds like we need to take our campaign for change to the intranet developers. Upgrade your lousy intranets!

  37. In general, I share Tim Hettler’s philosophy (above). That said, here’s a nice clean way to deprive all IE versions lower than 7 of any CSS:
    <!--[if IE]><![if gte IE 7]><![endif]-->
    <style type="text/css">
    @import/**/"/css/main.css";
    </style>
    <!--[if IE]><![endif]><![endif]-->
    Only IE7+ and non-MS browsers will fetch the CSS file. The empty comment in the @import statement keeps IE/mac (which doesn’t do conditional comments) from getting the CSS.

  38. Tim,
    I keep thinking that Microsoft should just adopt either Mozilla or WebKit for their rendering engine moving forward, and then sell an IE6-compatible rendering engine to all of these businesses who have these locked-in intranet sites.
    Nobody likes that idea but me.
    Heh.

  39. jason says:

    Personally, I couldn’t agree more, and on a personal site I’m on board. What better way to motivate users to move on. And by hiding styles all together, it looks more like the user’s problem. Some broken styles while others working could look like a site malfunction to a user. Professionally, I still see an average of 30% of IE users (which make up 75% of traffic) using IE6 – so I can’t drop support.
    For a recent client though, I did use a conditional statement to put a bar across the top to inform users that their browser was out of date, a link to upgrade to IE7, and another link to skip the troubled content. I thought of linking to FF, but after careful consideration I decided that adding a second browser to a computer where the user is still on IE6 wouldn’t help, they’d still use the blue e for internet.
    I feel this way served the best interest of the client and the user.

  40. It’s unfortunate that IE6 still has such a stranglehold on corporate PC users. I actually just blogged about browser testing recently, explaining when I think you need to make it look good in IE6.

  41. Eric Caron says:

    But there’s more to the failure of IE6 than it simply having poor styles. The fact that http://www.crashie.com does exactly that for IE6 is one point. And also things like the failures of how it handles forms. Try 2 <button type=”submit”> in IE6 and see how IE6′s core flaws are a huge hindrance to evolving our websites.
    I’m all for sticking with IE6 as long as it is just the cosmetic presentations of our pages presenting a problem. But when the browser’s flaws get in the way of developing functionality without a horrendous amount of overhead, then the time has come to draw the line and tell people to get a better browser.

  42. Colin says:

    I really don’t get all the fuss. IE6 is not that hard to accommodate. And besides, every hour I spend tweaking CSS and JS for IE6 earns me the same dollar amount for the hour I spend catering to modern browsers.

  43. Gary Aston says:

    Fair play, man. I love the Rissington Podcast too, although it’s a bit infrequent!

  44. John Faulds says:

    I’m like Colin. Maybe I’m not doing anything that fancy with my designs, but I don’t find I spend all that much extra time to overcome IE6′s shortcomings.

  45. Dean says:

    Why code to support IE6? The web studio I work for has a multimillion dollar account, with a part government owned client that uses IE6 as minimum base requirement for all web applications throughout the entire country. That’s why I code to include support for IE6, and am happy to continue doing so (it’s really not that hard).

  46. Dave McNally says:

    I think rather than just using this technique to completely rule out the browser, we could be looking at it as a technique to give us a clean slate and a chance to implement graded support.
    Paul Boag recently wrote an article covering this and includes a video explanation too. The results are still pleasing and it’s a step forward.

  47. Jaap says:

    On my site I do this, seems to work allright

    <!-- All browsers, IE6 included -->
    <link href="all.css" rel="stylesheet" type="text/css">
    <!-- Conditional comment stops IE6 from entering.
      The second empty comment allows other browsers to continue
      and aslo get the sylesheet. -->
    <!--[if gte IE 7]><!-->
      <link href="modern.css" rel="stylesheet" type="text/css">
      <!-- This is for IE7+ only.
        It is parsed as a comment by other browsers. -->
      <!--[if IE]>
      <link href="ie.css" rel="stylesheet" type="text/css">
      <![endif]-->
    <!-- <![endif]-->

  48. Mike D. says:

    My solution is: do nothing. The way I code, everything almost always looks great right out of the box for Safari, Firefox, and IE7, and usually there are only a few bits of ugliness in IE6. Is there a reason to get rid of (or even care about this ugliness)? I say no.

  49. Jens Meiert says:

    If you don’t want to support IE 6 anymore, then don’t test and do anything for IE 6 anymore.
    Also, there is no point in using Conditional Comments, quite the contrary. IE 6 doesn’t alter the CC problem in any way.
    My two cents, literally.

  50. Patternhead says:

    In an ideal world I’d love to drop support for IE6. I agree that the time is right. The problem is that, in general, my clients don’t agree and insist on support for IE6 even if it adds a considerable chunk to the budget.

  51. Well, if you design and implement websites for your customer, who happens to be an sme with old computers running, THEY still use IE6 and their focal point of reference for your work is their own ancient browser.
    From that practical point of view, there is simply not a good way to ignore the old browser compatible css approach.

  52. Lots of good comments here. A few follow-up thoughts:
    Like I mentioned, abandoning all styles in a browser is certainly not going to be an across-the-board solution. It depends on stats, the client, the company, etc.
    A few mentioned that getting IE6 to behave reasonably is usually not a big deal. That’s often the case for me and client work as well. We’ve spent years perfecting the craft of anticipating what will break down in IE6, and the patches and fixes needed to make things work are well documented. It’s part of everyday life.
    But something nice happens when you take it out fo the picture completely (again when appropriate). You can start thinking progressively. You don’t have to think about workarounds and alternative solutions.
    Getting IE6 to behave is possible. Anything is possible. But leaving it behind for certain implementations just might push things forward a bit. And that was the primary reason for the post.

  53. Keith Bell says:

    Maybe we should consider something similar for IE8, given this. Then nobody will have to worry about “compatibility”. ;-)

  54. CouzinHub says:

    I spent so much tme on IE, I’m pretty sure I could fixe any kind of bug… but the thing is, I don’t see why we should keep supporting IE6…
    My way of supporting it, is instead of stripping down the styles, I strip down the content. On my site, IE users can’t access the content, and are redirected to a simple static html page that tells them to download firefox or else.
    I use this technic on Drupal, but it should work for all kind of php based site.
    paste this in your page template, even before the html tag:

    if (eregi("MSIE",getenv("HTTP_USER_AGENT")) ||
    eregi("Internet Explorer",getenv("HTTP_USER_AGENT"))) {
    Header("Location: http://www.yoursite.com/no-ie.html");
    exit;
    }

    And now you only need to create a simple html page for IE, like this one : http://www.couzinhub.com/no-ie.html

  55. brad says:

    Question: does anyone know the meaning behind the

  56. brad says:

    oops.
    Does anyone know the meaning behind <!--> after <!--[if !IE]>. I looked around for an answer, albeit not exhaustively, and couldn’t find anything.

  57. nick b says:

    I’ve just added an IE6 modal warning to http://www.protagonize.com via conditional comments, too.
    If you’re worried about additional page bloat, you can offload all of your CSS and JS into includes within the conditional statement. It’s all pretty painless to do and it’ll help getting everyone up to date browser-wise. Supporting an 8-year old browser is a nightmare and I wouldn’t wish that on anyone. :)
    -nick / protagonize

  58. Oscar Godson says:

    for my own sites personally I just don’t open IE6. I think it’s funny people still are using hacks etc. I mean jesus, it came out in 2001 :)
    For my sites I don’t have IE6 conditionals at all. If they see enough broken sites they will move on, but we keep supporting it.
    It’s kind of like having this car, it gets your around and works decently, not great, but well enough. Every time it craps out, a team of people fix it right up and keep it going strong. Now imagine if no one fixed it. The person wouldn’t be able to use the car exactly what it’s for and would have to get a new one.
    Imagine going to 10 sites and they all look broken. No one would keep the browser if they can’t read anything!

  59. Nick Toye says:

    Unfortunately, at ground level – the clients require IE6. Why? Because its still got massive browser share, compared to Safari anyway.
    I hate IE6, hate it with a passion, but realistically it still can’t be ignored. I can’t go to my clients and say I am not going to support IE6, because they will find someone who will.
    I will do my best to get IE6 looking as good as possible, but let them know the reasons why.
    We can’t force a revolution. I just feel we need to wait, still.

  60. Tom says:

    I have a better solution, make your site work in IE7 and up. Most people aren’t using legacy browsers anymore, and with the amount of restrictions and added code to make things work in older browsers, it’s not worth the time investment or frustration.

  61. Sam Sherwood says:

    Another option, and one I personally use now, is to create a DIV via conditional comments (for instance, named #hasIE6). I rarely find a use for IE7 specific stylesheets (really, never), and this option keeps the conditional comments out of my head tag.
    Plus, it comes with the added possibility of using only one stylesheet. Only have one IE6 specific rule? Excellent, use #hasIE6 for added specificity, and you’re all set.
    As always, shoot for functional in IE6, not necessarily pretty.

  62. Nick Toye says:

    @Tom,
    Browser Market Share
    19% still use IE6. When you consider that to be 15% more than Safari, and even 1% more than Firefox. It’s still a browser that needs some respect, regardless of how poor it is.
    Unless you are designing and developing sites for an audience who you are fairly sure are not going to be using IE6, then fine. But stats don’t lie.

  63. Action says:

    Even the most complex sites only require a handful of tweaked styles to fix IE6 issues. If something that simple is setting you back long enough to cause this level of frustration, the problem is your mastery of CSS, not IE6.
    Don’t develop your site in Firefox/Safari/Opera then go back to IE6 to fix all the bugs. Develop for all browsers simultaneously from the start. It’ll take a bit longer at first, but save you more time in the end…and save you from whining online about something that really is nothing more than a minor inconvenience.

  64. ozmatix says:

    will IE even die? it aint a friend of mine.

  65. ozmatix says:

    will IE ever die? it aint a friend of mine.

  66. Adrian says:

    I came up with my own method for letting go of IE6 users by inserting a polite message at the top of their browser which encourages them to download Firefox. You can read more about it or download the files in this article:
    How I Chose to Say Farewell to IE6

  67. Graham says:

    Meh, IE6 is not really that hard to accomodate. Maybe I’m just not doing “cutting edge” stuff, but lately the only conditional styles I send to IE6 are those where I’ve substituting an index transparency GIF background for an alpha transparency PNG one. And even then, only in certain situations.
    * { zoom: 1; } seems to be helping me a lot these days, along with the HTC fix for PNGs. Also, display: inline anything you float. Those bits will take care of most of your IE6 bugs in the average site I think.
    And every once in a blue moon, i’ll do a hack for min/max width too, I guess.
    But for pete’s sake, let’s not pretend that serving IE6 unstyled content is in any way acceptable for a user with that browser. And don’t give me the ol’ “semantic web” line either. If the user thinks the site is broken (which they will if its unstyled), then they won’t use it. Period.
    If you don’t care to support ie6 (and I wouldn’t really care if I ran a webdev blog), then just ignore it, but don’t serve it an empty stylesheet. Not sure why, but once every 2-3 projects or so, I’ll have some transparent PNGs that actually look decent natively in IE6 for some reason.

  68. Aaron says:

    We run a few ecommrce sites, and this is an issue we are constantly contending with. Our IE6 users are now around 16% so we might start messaging to them, especially as we add new features and functionality. If it were up to me, I’d drop support for IE6 altogether, but we still need to have sales.

  69. mdcarso says:

    Isn’t using the ie7-js script a more elegant way of solving IE’s deficiencies?
    For those that don’t know, ie7-js is a JavaScript library to make Microsoft Internet Explorer behave like a standards-compliant browser. It fixes many HTML and CSS issues and makes transparent PNG work correctly under IE5 and IE6.

  70. Dan H says:

    For many situations, I figure that if Microsoft has no problem pushing its Silverlight plug-in this way (Screenshot of Microsoft.com), there ought to be no problem for the rest of us to alert IE6 users to an opportunity to have an “enhanced online experience” by installing a different browser of our choosing.

  71. James says:

    Interesting read, especially the comments.
    I have to agree with the majority view that IE6 remains a necessary evil and that to stop completely supporting it is not an entirely viable option at this time.
    I liked Adrian’s solution above and I use a similar “soft upgrade notice” solution on some of my sites which provides a standard notice explaining the availability of newer or alternative browsers but can be dismissed via a cookie if the user can’t (on a corporate network perhaps) or doesn’t want to upgrade.
    Files and instructions are here if anyone wishes to use / preview it
    James.

  72. Daniel James says:


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

  73. @Daniel James: My goodness, that seems to work just the same. Nice work!
    No need to reapply the stylesheet twice. Cleaner.
    Can anyone else confirm that Daniel’s method works the same way?
    (I’ve tested with good results in Safari, FF/Mac, Opera/Mac, IE6, IE7, IE8Beta, FF/PC)

  74. I’m all for pushing bad browsers, like IE6, out of the market. The reality is that I’ll be coding
    statements for years to come. And I don’t have the luxury of being a douche about it.

  75. Mike says:

    I agree with Scott Jehl above that some explanation should be provided to IE6 users; otherwise how will they know that it is within their control to view a better looking site?
    I wouldn’t necessarily push an IE6 user to Firefox though, as it’s even more of an adjustment to a non-tech user than getting the latest IE. It also follows the old pattern of publishers giving preference to one browser, but now it’s FF instead of IE. A more neutral upgrade advice would be better IMO.
    On a side note, what is with this comment text area’s tiny text? Is this 6px? (FF 3.0.6)

  76. @Michael Critz: Uh, what’d you call me?

  77. bryan says:

    i work in higher education. we are slow to change. it’s 2009 and my university still only installs ie6 on its computers (unless you have admin rights like so few of us do) — so i am left to design for ie6 and up.
    i am one of the few stuck, with no choice, but to suck it up and design for the past.

  78. @bryan Until all the large establishments, organisations and corporations get their act together and upgrade then IE6 will remain a main stream browser. We too are stuck with IE6 on our desktops at the BBC and also have to develop for it due to the large number of people still using it.

  79. I’ve enabled comments again on my original post. Which I accidentally hid in a rush a little while ago. Apologies to them. “Suzy” comes up with something similar to @Daniel James
    Good work!

  80. Neil Bradley says:

    I wish we could almost ignore IE6 for all of our websites too. I work for the NHS (National Health Service) in the UK and we are stuck on IE6 due to major national systems not yet compliant with IE7.

  81. Chris Gross says:

    Fantastic post! Great idea! Easy implementation, too!
    At the current point, what I do most of the time is guarantee that the sites will look good in all browsers except IE6 and below. Most people dont complain, but a few have asked for it, and I charge them.
    What I think I’ll do is offer this solution to save them money and get the site developed faster.

  82. Ben says:

    @bryan, you’re not alone. The U.S. Forest Service is still standardized on IE6. Heck there’s still Win2K machines around! I feel your pain. However, I think I’m going to start exploring some incremental enhancements for those folks that *do* use a good browser.

  83. Mark Caron says:

    I’ve been serving IE6 a ‘losers’ stylesheet for a couple years now. I tried out Andy Clarke’s “Transcending CSS” method of using CSS 2.1 to target real browsers and then serve IE6 its own ‘beautiful’ design. Next re-design (due soon) I won’t even bother spending 30 minutes to give a little style to IE6.
    If most of my clients didn’t use IE6 stubbornly I’d have left it in the dust a while ago when developing for them.
    http://www.heyokadesign.com/

  84. @Dan Cederholm Oops! That sounds so much worse when I read it again. I didn’t mean to imply *YOU* were a douche.
    But, I know my clients would think *I* was a douche if I didn’t support what is currently around 20% of the browser market. (A number that is falling, praise Buddha!)
    Sorry for the poor word choice. I’ll buy you a drink next time you’re in Boston!

  85. Chris Mahon says:

    @Mark Caron just loaded your site up in IE6, awesome ;)
    Also tested Daniel James technique and can confirm it works.

  86. @Michael Critz:
    Ha! A misunderstanding then, no worries at all. And I can see where you’re coming from. Certainly not a technique that’s going to fly in every situation.

  87. Erik Vorhes says:

    @brad, you need the extra <! in that conditional comment because IE will otherwise display a nasty --> at the top of your page.

  88. Erik Vorhes says:

    Oh, and the --> is there to end the “comment” part of the conditional comment. In this case you want the stuff before the <!--<![endif]--> to be visible to non-IE browsers. (Which also explains why that <!-- is stuck in front of the <![endif]-->.)

  89. Jeff says:

    @Graham: “But for pete’s sake, let’s not pretend that serving IE6 unstyled content is in any way acceptable for a user with that browser.”
    Exactly. This is totally unrealistic. I appreciate venom for IE6 and the want to get on with things technologically, but the fact of the matter is, as has been pointed out, IE usage is still around 15 percent globally, and in certain sectors, the statistics are much higher. I work in financial services, in which companies often deploy highly restricted systems and networks and are late adopters for enterprise-wide migration (such as browsers) because of security concerns (better to battle the beast you know, etc). Our site is shown in IE6 more than 60% of the time, so we design to that standard and degrade gracefully when we’re doing something unsupported by IE6 (which, uh, we try not to do). Do I prefer such a situation? Of course not, but ours is not the venue to ride in on a high horse, so we’re more or less stuck waiting for adoption (which, given the state of global finance, might be further off than we had hoped).
    I realize you couch by saying this method is appropriate “for some sites,” but frankly I’ve never developed a site or worked on a site on which I’d want to give IE6 users the shaft, just for the sake of doing so (or for the sake of making it easier on the developer, or for the sake of taking a jab at IE6 fuddy duddies, or whatever your reason might be for polluting the experience for a given constituency).

  90. Folks, again… this is not appropriate for every situation.
    IE6 stats for this site are at a measly 3%. I then decided that was a low enough number to server CSS-less pages to.
    Your mileage may vary. And there’s certainly no harm in talking about this solution, whether you choose to use it or not.

  91. I agree that for some sites it’s already becoming appropriate to serve IE6 users unstyled content.
    That’s not true of the majority of sites I work on (which doesn’t mean that it’s not valuable to discuss techniques, as all sites will eventually hit that tipping point).
    I did want to throw in a CSS-only fix for alpha-transparency on IE6, though.
    * html .pngfix {
    zoom: 1;
    behavior: expression((this.runtimeStyle.behavior="none") && (this.pngSet?this.pngSet=true:(this.nodeName == "IMG" && this.src.toLowerCase().indexOf('.png')<-1 ? (this.runtimeStyle.backgroundImage = "none", this.runtimeStyle.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + this.src + "', sizingMethod='image')", this.src = "/path/to/transparent.gif") : (this.origBg = this.origBg ? this.origBg : this.currentStyle.backgroundImage.toString().replace('url("','').replace('")',''), this.runtimeStyle.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + this.origBg + "', sizingMethod='" + (this.currentStyle.backgroundRepeat=='no-repeat' ? 'crop' : 'scale') +"')", this.runtimeStyle.backgroundImage = "none")),this.pngSet=true));
    }

    IE6 is the only browser that will ever try to apply the rule. You just need a transparent .gif, and to add the “pngfix” class to elements which need transparency.
    I did a writeup at http://www.openplans.org/projects/topp-design/blog/2009/01/22/design-pattern-alpha-transparency-in-ie-without-javascript/ a while back, showing some of the limitations – it’s not a perfect fit for all situations, but it never hurts to have another arrow in the quiver.

  92. Flug USA says:

    Forget IE6! I don’t like it at all!… :-P

  93. A method I’ve been using lately for PNGs…
    It requires extra CSS, but reduces load on IE without requiring another stylesheet. Forgive me if this has been stated elsewhere… I’m sure it has.

    #header[id] { /* [id] hides style from IE6 */
    background: url(/img/sometransparentimage.png);
    }
    #header {
    ... the rest of the styles ...
    }

    This method will not load the image into IE6 so you don’t get nasty gray-blue backgrounds. If you don’t mind hacks you can insert the old underscore hack for IE inside the main styles if you want to give the element an opaque background.
    so…

    #header[id] { /* [id] hides style from IE6 */
    background: url(/img/sometransparentimage.png);
    }
    #header {
    _background: url(/img/sometransparentimage.gif);
    }

    This is hacky to be sure, but it does make sure that IE only downloads the GIF and everyone else only downloads the PNG.

  94. with old computers running, THEY still use IE6 and their focal point of reference for your work is their own ancient browser.
    From that practical point of view, there is simply not a good way to ignore the old browser compatible css approach.

  95. It would be nice if we all could forget all versions of IE, but the truth is that the whole corporate world uses this bad peace of software.

  96. Greg Mayer says:

    I guess I’ll have to start viewing this site at home (or stop altogether).
    We’re still saddled with IE6 at work (10,000+ users) and have little say in the matter. I understand that I may be the only one of them visiting this site and I also understand just how awful this browser is, but…
    (And now that I’m in Preview Your Comment mode, I can’t even read the text on the buttons.)

  97. Billee D. says:

    I think that serving-up a plain vanilla version of a website to IE6 is totally acceptable. The content is still usable, it just doesn’t look pretty. This is where I think that some designers fail to see the point; web sites are about information and not slick graphics. If the point of a website is to distribute information then the design is ancillary to the content, right? So what if it isn’t pretty. If it’s usable what’s the fuss about?
    I have started serving naked sites to IE6 (and below) users for almost 3 months now and I tell my clients that if they want IE6 support for their new website it will cost them extra money. We did the same thing back in the NN4 days and I think that it’s time to do the same thing for IE6.
    With IE8 out of beta now I think it’s time to put ol’ #6 to rest. Plus, you have to admit that there is something kind of exhilarating to designing a website and *not* having to cater to IE6. It’s downright refreshing!

  98. Rory Martin says:

    Wow, I never realised you could do this with different css stylesheets for different browsers. Although its extremely annoying having to cater for these accent browsers. Thanks for the knowledge!

  99. IE6 has been the bane of my existence for the entirety of my 7 year web development career. Its time to give the general public a push in the right direction.
    Who is the web industry? We are. Without designers and developers there would be no web.
    We have the power to force audiences to use modern browsers, and we do that by saying “No. We are following web standards to the letter, and will not support a browser that doesn’t. It’s your [the user's] responsibility to upgrade your browser, and not our responsibility to continue this unhealthy enabling.”
    Continuing to support antiquated browsers means continuing to hack code, and continuing to pull our hair simply because we’re following the rules.
    Let’s stand together as an industry and say “NO!” to supporting browsers prior to Firefox, Safari or IE7.
    Scot Jehl had it right in a very early post:
    <!—[if lte IE 6]>
    <p>This site looks bad because you’re using IE6. <a href=”http://firefox.com”>Get Firefox</a>
    <![endif]—>

  100. I love the fact that this conversation is taking place. I can remember when just the thought of abandoning support for IE6 was sacrilege.
    The weight of Dan’s statement “When you take it [ie6] out of the picture..You can start thinking progressively” is huge.
    We all want the best for our clients, but we all want to do great work that pushes the envelope (if not for the industry, then for our ego).
    Getting bogged down in hacks, workarounds – no matter how elegant, bleeds the full potential of any project. without all this worry and advance preparation, suddenly, you’re free to try new things. That’s pretty great!
    The only way that people will abandon their browsers is if there is trickle down effect coming from us. Of course clients will have the last word, but its up to us to at least have the discussion with them and see how amenable they are to the idea.
    I LOVE the idea of showing the user the naked page with a statement telling them that they should upgrade. I do, however, find it ironic, that we are discussing the best hack or workaround to tell IE6 users that they should adopt a newer browser.
    There is no question that now is the cusp of abandonment.
    Thanks for bringing this up Dan!