Let IE6 Die With Dignity

February 28, 2010 By: Leo Templin

Some people advocate dropping complete support for IE6 and even using pop-ups to convince users to switch to their browser of choice. Other web designers suggest we enhance IE6′s capabilities with external scripts and create alternate designs to accommodate it’s flaws. But where’s the balance between IE6 support, cost and user torture?

IE6 & Grids

The case FOR support: Supporting IE6 grids tend to give beginners a lot of problems but in reality supporting IE6 to a usable level can be passive if you remember a couple simple rules. Getting IE grids to look identical to working browser grids can be tricky but shouldn’t take to much time. One tip here is to make sure your grids work before you have them full of content and design elements. For help with IE6 rendering problems check out this tutorial: 9 Most Common IE Bugs and How to Fix Them.

The case AGAINST support: I can’t really make one, it only takes a couple lines of CSS to make your grids usable and ignoring that is just lazy, plus if you’re using a grid framework like 960 Grid or Blueprint then your grids probably already work. I will say this however, if your IE6 user demographic isn’t high then worrying about aesthetic level problems probably isn’t the best place to spend your valuable time.

Conclusion: Supporting IE6 to the point it can render your site’s structure is to easy not to still do at this point. Don’t waste valuable time on making small aesthetic issues work when you could make things better for compliant browsers.

Conditional IE Style Sheets & Hacks

Conditional style sheet includes Vs Css hacks is an old issue, should I use IE’s conditional statments to include seperate CSS files depending on it’s version or should I use hacks? This isn’t really a case for or against as if you’re doing this then you have decided that you have to support IE6 in some manner and now you need to decide how that support will be implemented. For a while now I had sided with Hacks as they were usually two or three lines in my entire CSS file and they were right there along with everything else about the style. I don’t like having to break up my CSS based on browser detection which shouldn’t even be happening anyway. I believe now though the best solution is outlined by Paul Irish over at his blog PaulIrish.com. What Mr Irish has known for year’s apparently is that it’s a lot easier to use the same IE conditional statements to include a class in your body tag and then simply write CSS selectors for the IE specific body class.

Conclusion: Neither hacks or conditional includes turn out to be the right choice, instead go with the solution outlined here by Paul Irish: conditional-stylesheets-vs-css-hacks-answer-neither.

IE6 PNG-Fix

The case For use: Some designs just can’t be done using opaque JPGs, if you have to support IE6 to this visual level you probably need therapy and if you don’t now, you will later. At any rate a PNG-fix is basically your only option for high color alpha transparency, there are so many options out there for PNG-fixes there’s no point going into it all, use the Google.

The case AGAINST use: Consider what you’re doing with transparency, is there any reason not to achieve the same effect using progressive enhancement in a compliant browser instead of performing black-magic in an antique? I have yet to see a PNG-fix that didn’t mess with complex CSS or add load times and over-head.

Conclusion: I think it’s much better to assume your IE6 users don’t have the extra horsepower for big images and complex solutions. Assuming your compliant users can handle well though out progressive enhancement is probably better and in the end you will be offering a better experience to more people. 8-bit PNGs should also be considered as many times they can accomplish the same effect as their high color counterparts as pointed out by Alex Walker over at Site-Point.

Upgrade Dialogues & Vague Threats

The case FOR harassment: Everyone sane that works in web design hates IE6, it’s punished us all to much and it’s probably the pit-of-despair in your test scenarios. Getting people to stop using IE6 should be encouraged, most of the time this means downloading a non Microsoft browser like Firefox or Opera. By using a pop-up dialogue with download links, instructions and rude comments we can help people make the right decision and help the web move forward.

The case AGAINST harassment: Most people using IE6 have on thing in common, they have no choice. So while you think your doing the right thing by educating people on how old, insecure and broken their browser in reality you are just reminding them of the thing they are by now acutely aware of.

Conclusion: Don’t harass people about using IE6 unless it’s necessary, your clients probably don’t wish to be an active participant in the browser wars unless it’s mandatory the user have a modern browser to get on the ride, and example of this would be something like a bank or online-games site.

Conclusions

Grids:
Take the time to keep them from exploding, don’t waste time on perfection in IE6.
IE conditionals and separate style sheets:
Use conditionals instead of hacks but instead of including separate style sheets use the conditions to modify the class of your body tag.
PNG-Fixes
Think with progressive enhancement in mind rather then making IE6 do things it wasn’t meant to.
Upgrade dialogues
Don’t rub salt in the wounds unless it’s necessary, at this point your users probably can’t upgrade.

2 Responses to Let IE6 Die With Dignity

  1. Jester says:

    I was sort of hoping that there was some sort of needle based solution to this. Can’t we just inject something fatal into IE6′s veins and call it good?

  2. Well, great experience,dude! thanks for this great Articles wow, it’s very wonderful report. :)

Leave a Reply

Your email address will not be published. Required fields are marked *

*

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>