Notes and guidelines to follow to support IE6_问答_开发者

Are there any good notes and guidelines that one should think about when developing sites that must support Internet Explorer 6?

I'm not looking for explanations of the abundance of bugs that we have all learned by now. I need some general informations on, e.g., elements that one should prefer for certain tasks, things that simply does not work in开发者_如何学C IE6, CSS tips, etc.

here are the biggies i can think of right now:

No Alpha Transparent PNG Support
No Hover States except for the <a > tag
CSS floats behaving unexpectedly.
Can't use max/min width/height.
The Box-model conflict (padding is not added to the width of elements).
sometimes doubles margins.
IE6 doesn't support position: fixed.

...and i'm starting to get depressed so i'll stop here.

I'm fortunate in that I don't have to support IE6 any more. However it is a recent memory, so you have my sympathies.

Go to Quirksmode.org. This is an excellent resource for finding out what features various browsers support. (seeing all the red in the IE6 column will depress you though!)
If you plan to do any scripting at all, use jQuery rather than trying to work with plain Javascript: jQuery makes considerable efforts to be cross-browser compatible, even in IE6. It isn't 100%, but it makes a pretty good go at it, and give you features that would otherwise be completely impossible in IE6.
The following tools will make your life easier:
- Dean Edwards' ie7.js - a JS library aimed at making IE6 more compatible with standards (he's also written "ie8.js" and "ie9.js" which extend the original ie7.js to add more features missing in various versions of IE)
- Modernizr - a JS/CSS library aimed at helping you work around incompatibilities in old browsers.
- IEPNGHack - allows you to use PNG graphics with transparency in IE6.
- Whatever:Hover - allows you to use the :hover CSS style with any element type (IE6 normally only allows :hover for <a> tags).
- CSS3Pie - a library aimed at giving IE6/7/8 some modern CSS3 features, including border radius.

There's probably more, but that should give you a start.

One thing to make clear to your employer though is that as long as they insist on using or supporting IE6, you will be unable to produce a modern feature-rich web site. There are limits to how good you'll be able to make it, even with all those hacks. Plus it'll be slow: IE6 is painfully slow at the best of times, and all those hacks will only make it slower.

Best of luck.

While simply saying "Don't Support IE6!" might sound real nice and easy to those who do not have to deal with reality, it remains a fact that many web developers/designers simply have no control whatsoever over that decision.

With that said, obviously the ideal would be "don't support ie6".

If you must support it, how much you have to support it depends on why you must; Is it because your web app is for a company which has many IE6 installations that it knows it won't be upgrading any time soon at all, or is it just for a client who wants to maintain 'support' for every possible user out there? Or is it something in between?

Generally speaking, I aim for "functional, non-totally-ugly, but certainly not pixel-perfect" appearance on IE6. I use IETester to check all versions of IE (differences abound between IE7 and IE8, for instance), so I include IE6 too, and just worry about making things look mostly functional for them.

For my clients, that has been sufficient. A couple have asked about IE6 support, and I have been able to show them that 1) the set of general users on the Internet who still use it is relatively small and 2) those users probably see so many glitches everywhere on the web anyway, they probably do not notice them anymore. I know that #2 probably sounds extremely dismissive, but I have plenty of anecdotal evidence that backs it up.

The basic idea comes down to; how much time will you really spend tweaking a site to make it perfect for an old, long-since-unsupported browser which use keeps going down more each day, when you could just make it acceptably functional, and then devote the rest of your time to more modern browsers.

But again, the extent to which you can take that route depends on how important IE6 support is to those who employ you, and why it is that important to them.

but anyway, IETester is a definite recommendation for testing it: http://www.my-debugbar.com/wiki/IETester/HomePage

Poor you having to support IE6, we've all been there I guess...

Unfortunately I cannot point you to some general guidelines, besides the KISS principle (keep it simple stupid). Just stick to CSS 2.1 and don't use any fancy new technologies such as HTML5. Also don't even think of using any kind of special CSS selectors like blabla > blabla.

Let me point you to some sites which might help you in your endeavor:

CSS contents and browser compability (good overview of what to do and not to do with CSS)
ie6fixer (you actually WANT to use opacity, transparent png's? this tool will help you)
universal-ie6-css (good starting point for your custom css)
Ultimate IE6 Cheatsheet: How To Fix 25+ Internet Explorer 6 Bugs (fixing the shortcomings the manual way)

For testing I recommend setting up a small virtual machine (I'd suggest using windows xp) with IE6 running. Testing tools like IETester may use the engine of the particular browser, but I have had differences between a full blown IE6 and the IETester tools - ~~oh also there is instant virtualization with Spoon.net browser sandboxes~~ (they had to remove IE, because MS said so...).