IE6 is now two versions behind the current release.

IE6 is almost 8 years old (it was released in 2001).

IE6 is lacking in many capabilities that all other modern web browsers have, in web technology, in security, and in features you can use.

You can read a review at Wired, a write-up from the IE team, or a summary of technical changes from WaSP.

Of course, Internet Explorer isn’t the only option out there. There’s Firefox, Opera, Chrome and a host of other alternative browsers that are worth checking out.

If you’re still running Windows 2000 or some other old version of Windows that can’t run IE7 or IE8, I’d absolutely recommend Firefox or Opera. Either will be much better than IE6, both will run on Windows 2000, and Opera will even run on Windows Me and Windows 98 (but you really ought to move to something more current than Windows Me.)

Back when I wrote the original post, I had a series of 5 or 6 milestones in mind, but decided to keep it simple and only post the first two. The next one after Firefox passing IE6 was for Firefox 2+ to pass IE6. I should have been checking in more frequently, since it already has.

So what’s next? Well, I expect to see the following in the next year or two:

• Firefox 3 replacing Firefox 2. It’s already got a strong pre-release following. (Fx2 will stick around while there are still Win98 and WinMe users, but they’re already at less than 1% here and falling.)
• Firefox 1 fading into the sunset in favor of newer, more capable releases.
• Netscape disappearing into history. (It’s already below 1% here.)
• IE6 dropping below 25%, 20%, 10% (watching it go to single digits will be satisfying), and finally 1%.
• Safari approaching 10%. It’s holding steady here, but keeps climbing globally.

Things I’d like to see, but am less confident about in the near-term:

• IE6 disappearing from the radar. There are hold-outs, both at the user and the sysadmin level, plus a sizeable minority on Windows 2000. Plus I think Microsoft is committed to supporting IE6 through the lifetime of Windows XP, which means they’ll keep shipping security fixes until 2014. On the other hand, IE 5.0 is technically still supported as part of Windows 2000, but I see very few IE5 visitors these days.
• IE8 replacing IE7, for most of the same reasons it’s taking so long for IE7 to replace IE6.
• Opera breaking out of its steady marketshare and hitting a solid 5%. That would make them much harder to ignore. (10% would be better, since Safari’s still struggling for recognition at 6%.) Of course, to get there they’ll have to pull off a major publicity coup.
• IE dropping below 50%. Could be done, but it’ll be tough. If there’s no majority browser, it’ll be very difficult to justify building a site for one browser only.

Of course, these will probably all happen faster locally than globally, since the audience seems to skew slightly toward the alternatives, but then local stats are the ones that actually matter for a specific site.

Well, yeah. That’s our job.

And a bunch of random websites blocking IE6 aren’t going to convince people to change. If I were to block IE6, or only allow Firefox, or only allow Opera, I’d have to have seriously compelling content to get people to switch. Mostly, people would get annoyed and move on. Who’s going to install a new browser just so they can read the history of the Flash? Or choose an ISP? Or buy a product that they can get from another site?

Slapping the User in the Face

It’s so easy for someone to walk away from your site. One of the tenets of good web design is to make the user jump through as few hoops as possible to accomplish whatever you want him/her to do. Every hoop you add is an obstacle. Too many obstacles, and they’ll just go somewhere else more convenient.

Back when I was following Spread Firefox, every once in a while someone would suggest blocking IE. Every time, people like me would shoot it down. And think about it: what does the average Firefox user (or Opera user, for that matter) do when confronted with a site that will only run in IE? Fire off a complaint, or move on, unless it’s something they can’t live without, like, say, their bank. Only then will they bring up the site’s preferred browser…just long enough to do their business and move on.

Plus it goes against the grain of the concept that a website should be viewable in any browser. It offends my sense of… I don’t know, egalitarianism.

Recommend vs. Demand

My current tactics: I target the latest versions of each browser (or rather, the overlap in their standards support), toss in enhancements where I think something would be nice, but not critical (off-site link icons using generated content, for instance, which works in everything except IE≤7, or rounded corners, which only work in Gecko and WebKit so far). And I take that, and make it look reasonably good in IE6. I don’t try to make it perfect anymore (case in point, the header of this blog), but I try to make sure it’s functional and doesn’t look broken.

Then I include a polite notice recommending that people upgrade to something a little more capable or modern for a better experience, but I don’t require them to do so. I don’t pop up anything that moves, or blocks content, or forces them to click through an extra page.

Enter: PayPal

Now, remember what I said about banks? PayPal intends to block “unsafe” browsers from accessing their site (via Slashdot). They aren’t technically a bank, but PayPal is actually in a position where they might be able to do it: they’re the most well known online payment service where two random people can send each other money. Probably more people will switch browsers and keep PayPal than switch payment services and keep their browser.

They’ve since indicated that they don’t intend to block “current versions of any browsers,” but will focus on “obsolete browsers on outdated or unsupported operating systems.” So you IE4 users on Windows 98? Upgrade already! (And since you can’t install IE7, try Opera. It still runs on Win98!)

They’ve also cited such safety features as phishing protection (present in IE7, Firefox 2, and Opera 9) and support for Extended Validation SSL Certificates (present in IE7 and the upcoming Firefox 3 and Opera 9.5).

Hazards of Browser Sniffing

Of course, once you start actively blocking browsers, you have three choices:

• Keep track of every single browser out there, and every version.
• Let most browsers in, but only block a few problem browsers (similar to Yahoo’s Graded Browser Support)
• Unfairly block browsers that might be perfectly adequate just because you can’t be bothered to investigate them.

The last seems the most prevalent. Just ask any Opera user today, or any Firefox user of 3 years ago. (I remember using Firefox and being told to “upgrade” to Netscape 6, even though NS6 was based on an older version of the same engine. Remember: Gecko is Gecko.)

Whitelist approaches to browser detection are, by their nature, either going to require constant updating or block too much. In this case, issues would include:

• Less well-known browsers, like Flock, which uses the same anti-phishing features as Firefox
• Browsers that don’t do phishing detection themselves, using third-party plugins to do the job.
• Changes in status, when browsers add the capabilities required to get on the list.

Thankfully, it looks like PayPal is going with the most minimally-intrusive approach: blocking only the most troublesome browsers, and letting the rest connect normally.

Will it Work?

There’s still the question of whether it’ll actually make users less likely to land on a PayPal phishing site.

For one thing, it’s not clear whether they’ll block IE6. The initial report would definitely have excluded it, since it lacks both EV support and anti-phishing (without an add-on). But the follow-up statement was focused on Safari. Does PayPal consider IE6 to be a “current” version since Microsoft still supports it? Or do they consider IE7 to be current, and IE6 to be obsolete?

Certainly, if they don’t block IE6, this will really only impact the tiny fraction of users running horribly outdated software. (Well, more horribly outdated.)

The thing to remember is that the features PayPal is promoting will only help if users switch for general browsing. In fact, anti-phishing will make no difference at all on PayPal’s actual site, unless it gets hacked (at which point the user is screwed anyway.)

So let’s suppose that they do block IE6. As much as I’d like people to switch to Firefox or Opera full-time, I’m sure there will be some people who only fire up an alternative to use PayPal, and who stick with IE6 the rest of the time. They’re just as likely as before to click on a bogus “Pay with PayPal” button, or a link in a phishing email. If they weren’t going to do that in the first place, the browser requirement wasn’t needed. If they were, the browser requirement doesn’t help. The bogus sites won’t require phishing detection, or EV certs. Imagine the user saying, “Hey, PayPal fixed the problem where it wouldn’t let me use IE!”

And of course it won’t stop someone with a stolen login and password from connecting using an “approved” browser.

The ISC has also weighed in re: limitations of EV certificates. Among other things: it may be easier to get an EV cert than suggested, in which case it won’t indicate any greater degree of trust than a standard SSL certificate. And it doesn’t prevent other issues, like keyword loggers or trojans that simply hijack a user’s session.

I apologize for the rambling nature of this post (yeah, site title and all that). But I worked on it on a succession of late nights, and decided it was time to just post the thing. Also, I should have a somewhat more concise post up on OperaWatch soon now.

The ISC reminds us that IE7 will be pushed out to WSUS next week, which should help get rid of IE6. Yeah, I’d rather more people switched to Firefox or Opera, but I’m at the point where I’d love to be able to stop worrying about IE6’s shortcomings when trying to build sites. IE7’s shortcomings are much easier to work around. (Sorry to keep harping on this!)

The inventor of Norton Antivirus talks about computer security and has some rather interesting ideas on what policies are worth pursuing…and what policies aren’t. Long passwords? Great for protecting a stand-alone machine, but on a 10,000 machine network, they only need to crack one. Patch everything? Not every vulnerability gets exploited. I’ll have to read the Slashdot thread when I have time; that should be really *ahem* interesting.

Finally!

Breakdown of major browsers according to AWStats:

The gap between IE7 and IE6 is solid, nearly 6 percentage points. That’s Safari and Opera combined. And the gap between Firefox and IE6 is closing, with Firefox climbing and IE6 falling. With any luck, it won’t be long before Firefox overtakes IE6 here.

Of course, stats here always seem to skew higher for alternative browsers than global stats. I think it’s because most of the traffic is for a comic fan site. Visitors are probably a bit geekier than average, and therefore more tech savvy than average, and therefore more likely to have installed something other than the default IE.

If you’re still running IE6, and you aren’t required to for policy or compatibility reasons, it’s time to look into a change. The web is moving on. I highly recommend that you either upgrade to IE 7 or switch to an alternative like Firefox or Opera.

Really, the only things holding me back from jumping up to Firefox 3 on my main computers at home and at work were Firebug and some of the HTML validator extensions. Firebug is complicated enough that I didn’t want to rely on the Nightly Tester Tools to disable the compatibility checks. Then I found out that there’s a Firebug beta that does work with Firefox 3. That was enough. Last night I took the plunge.

Meanwhile, things look good on the ditch-IE6 front. After last month’s false alarm due to a local maximum, it looks like IE7 has solidly overtaken IE6 on this site! For the first 13½ days of January, Internet Explorer accounted for 62.5% of total hits. IE7 was 33.5%, and IE6 was only 28.4%. Even better, that’s barely over 1 percentage point from Firefox’s 27.2%!

Most likely, a lot of people got new computers for Christmas. New Windows boxes would mostly be Vista, and would ship with IE7. Another factor might be techies visiting their relatives and helping clean up/update their computers. They might have taken the opportunity to install IE7 or Firefox.

Not by a lot. IE7 has 32.7% and IE6 has 30.3% of the total. And I expect it’ll level out or even reverse as stats from a regular work week filter in. But still, something has finally surpassed that moldering, zombified, shambling heap of a web browser.

Next step: getting Firefox’s numbers (currently 26.8%, also above the global levels) over IE6.

Come on, let’s put a stake in this relic. It’s done.

Update (Thursday): And now Microsoft is finally starting to talk about IE8…even if it is just to say they’ve picked out a name. Whee.

As for the stats, the gap has closed somewhat in the last 2 days, with IE7 at 31.6% and IE6 at 31.2%. This is definitely looking like a home/office split. I’m going to have to write a script sometime to do a daily breakdown of browser versions and see if this actually fits.

Update (Saturday): Yes, IE6 has caught up. 32.2% to 31.1%. *sigh* It turns out I was just seeing a local maximum.

Because Microsoft takes its commitment to help protect the entire Windows ecosystem seriously, we’re updating the IE7 installation experience to make it available as broadly as possible to all Windows users. With today’s “Installation and Availability Update,” Internet Explorer 7 installation will no longer require Windows Genuine Advantage validation and will be available to all Windows XP users.

As much as I prefer alternatives like Firefox and Opera, I’ve been frustrated at the relatively slow uptake of IE7. It’s just insane that 6 years after its release, we’re still stuck designing for IE6 as the world’s most-used browser.

So who’s still running IE6?

1. People running older versions of Windows that can’t run IE7, and who haven’t switched to something else. (This is a pretty small percentage, judging by OS stats.)
2. People who don’t know how to upgrade to IE7, or why they should.
3. People who actually want to stay with IE6 (whether for technical reasons or just stubbornness)
4. People who would be happy to upgrade to IE7, except they can’t/won’t run WGA (on principle, or because it’s broken on their system, or because their OS is pirated).

I don’t know how big each group is, but Microsoft seems to think it’s worth going after #4.

It’ll be interesting to see whether there’s a jump in IE7’s marketshare relative to IE6. Maybe we’ll reach that next milestone sooner than I expected.

A bit closer to home, this site is currently seeing 64.6% IE, 26.2% Firefox, 4.4% Safari, 1.2% Opera (which probably includes both the desktop and mini versions). Splitting IE into versions, we’ve got 35.9% IE6 and 28% IE7. We’re already at the point where IE6 users are a minority (albeit the largest one), and more than 50% of visitors are using something more modern.

I’m looking forward to the next 2 milestones: IE7 overtaking IE6, and Firefox overtaking IE6. Come to think of it, I’d really like to get rid of IE6. Its time has passed, and the web will be better off without it, just as it’s better off without Netscape 4.

• Get rid of the non-working compatibility cruft for Netscape 4 (some of it was actually making things worse in NS4)
• Make navigation easier.

I decided early on that I wanted to move to that old standby, the tab bar across the top of the page. I toyed around with using fixed positioning so it would stay in place like a toolbar, but couldn’t get same-page links to position themselves correctly. I also realized that the tab bar needed something above it, or else it would blend in with the browser’s toolbars. Solution: another old standby, the site logo above the tabs

After trying some more out-there ideas, I ended up with the rest of the page looking about the same as before. Having the logo at the top meant that I didn’t need a giant logo on the main page, freeing up space to add something I’ve meant to do for a long time: Post more obvious links to each of the main Flashes.

Something interesting I noticed: I’m now considering IE6 a second-tier browser. I’m building for IE7, Firefox, Opera and Safari first. I no longer care about minor issues in IE6, just major ones. I realized this when I decided to use an alpha-transparent PNG at the top of every page. Sure, I was able to use PNG Behavior to get it to look right in IE6, but that requires scripting, and it’s not the same as native support. (Now that I have that linked on every page, though, I can use alpha-PNGs anywhere without additional effort.)

I also decided to switch from XHTML, which I’d started using in the 2000 redesign, back to HTML 4.01. The site had never benefited from using XHTML, and HTML still has wider support, so I figured if I was going to be changing code anyway, I might as well take the opportunity.

I posted the new layout last Sunday, and I swear, within 10 minutes someone had sent a comment on it.

Monday was time for fixing bugs. Not surprisingly, the biggest ones were both in IE. They were two related bugs involving floats and italics that had the opposite effect in IE6 and IE7. They were also intermittent, only affecting particular pages and only with certain window sized, which is why I hadn’t caught them before launch.

IE6 encountered the Peek-a-boo Bug. On certain pages, text next to a floated image would not appear. IE7 encountered another disappearing content bug, in which the floated image itself would stop displaying below any line with italics. (What is it with IE7 and weird problems with italics?) It turned out both could be fixed by setting width or height on the article DIV, instead of letting it take the size of the container (which includes the footer), so I just made it 97% (since 100% confused IE6 even more) and had done with it.

Finally, I’ve added some enhancements for certain browsers using experimental CSS3 features. People visiting with Firefox or other Gecko-based browsers will see rounded corners on the tabs (it looks much better than the square-cornered version, but isn’t necessary), along with people using nightly releases of Webkit (with any luck, the feature will be in the next version of Safari). Really neat was box-shadow, so far only in Webkit. I was finally able to add the drop-shadows to the article and sidebar the way I wanted to back in my last redesign in 2002! I’m looking forward to seeing other browsers implement it.

The first thing I realized was that the technique isn’t suitable for large, arbitrarily-sized regions, because you need to have a background image as large as or larger than the area being given the shadow. When you’re trying to apply it to most of the page, you need a multi-thousand pixel image. That’s not only hard to work with, but even if it compresses well it’s still going to take up a lot of unnecessary room in the browser’s memory.

I wanted to keep the markup simple, so I shopped around a bit more and came across a CSS drop shadow example at W3C which was very simple: all you do is put a shadow-colored div behind the area and mess with margins.

Well, that worked great in Mozilla, Opera, Konqueror and Safari. Then, the dreaded Internet Explorer test.

No dice. IE on Windows has a problem dealing with negative margins (which explains why it thrashes the layout on my software page). It shrank the containing div down to one line, but spread its background all the way down, and duplicated the top of the inner div so that there were two borders. (Note that IE for Mac worked fine.)

So I thought, how about using positioning instead of margins? That actually worked, keeping margins intact and everything. So I had a simple drop shadow that worked in all the major modern browsers! Next step: What would it do in Netscape 4?

I’m at the point where I don’t worry about design appearing right in Netscape 4, I just worry about the content being visible and clickable. If things don’t line up, or the background is missing, I don’t mind, but if you can’t read it, or you can’t follow navigation, I try to fix it. Well, Netscape 4 is picky about applying background colors, and it had decided to show only the shadow’s background color — which, of course, was black, the same color as my text! Fortunately, there is a very simple, validating hack to hide CSS rules from Netscape 4, so I used the Caio Hack to hide the background color for the shadow div.

So now I’ve got a test page that looks good in all major modern browsers, and is at least usable in Netscape 4 (for the die-hards who won’t or can’t upgrade to Netscape 7.1 or Mozilla). I proceed to update all my pages to add the nested div. Story done, right?

Of course not! The first problem was with IE, which took some files – but only some – and actually double-layered the text! After a bit of experimenting I realized it was only doing it to the largest files, and it seemed to be wrapping the text around from the bottom to the top as if it had some sort of maximum length on nested and/or relatively-positioned blocks. It looked just like a sheet of paper that’s been run through the printer twice. By this time I wasn’t really interested in starting over with a new design, so I just added another class and reverted those pages back to a shadowless layout.

So was I finished now?

No, Netscape 4 – despite being fine with the page I had used for testing – was royally messing up the rest of the pages, somehow deciding that a negative position for the left edge of the inside block should be measured against the right edge of the container instead of the left. And once you move something in NS4, chances are the links either haven’t moved or have moved somewhere else. So I had unclickable menus off at the right edge of the page instead of the middle, and poems you couldn’t see without scrolling to the right. Very much not in the mood to fsck around with this, I just moved all the positioning inside the Caio hack.

Done?

Nope! A few pages have images floated off to the right. IE/Win would flash the image briefly, then paint the background over it. Really. On the one page where the image matters, I just resorted to a table. A table inside an otherwise CSS-based layout, just because one browser is too buggy to display floated images right.

Now, let’s go back to the beginning. Remember, I wasn’t trying to do anything complicated. The HTML change consisted of going from <div>...</div> to <div><div>...</div></div> — that’s all — and the CSS change consisted of (first try) setting margins or (second try) setting positioning. Mozilla, Opera, Safari and Konqueror all got it right the first time. Not once did I have to tweak anything. But IE/Win and NS4 both exploded, repeatedly.

Microsoft, unfortunately, has the browser market sewn up and has gotten lazy. I wouldn’t mind so much if they were willing to fix their bugs, but they aren’t. These aren’t new or advanced standards I’m working with here, these are basic features that have been around for 7 years. I can understand Netscape 4 screwing up — it’s old, and the only reason I’m even bothering is that so many people were scared off of upgrading by the crap that was Netscape 6 or the hardware/OS requirements for the much-better Netscape 7 and Mozilla. But IE 6 is supposedly current (even if they haven’t done much with it but plug security holes for the last few years). It ought to be able to handle this stuff.

This minor site upgrade should have been a half-hour project at most, instead of using up an entire evening and prompting me to write several pages detailing the experience.