Is your site ready for IE8?

  • Article

UPDATE: Note the update to the META tags here. (June 16)

Since I'm having several conversations with customers about preparing for IE8, I wanted to share a few links so I don't lose them. This is not a post about the cool new features like WebSlices and Activities, but about information on preparing an existing site.

I'm using the IE8 Beta everyday on my main machine. It works reasonably well. While I look forward to when the next releases come out, my experience would be pretty satisfactory except for 2 issues typically - sites that incorrectly detect my browser version, and sites that are applying IE7 CSS rules against my browser that has CSS 2.1 compliance.

Incorrectly detecting browser versions, or User-Agent Sniffing

There are a couple of ways to get this incorrect, and the basic issue is that some sites did not code for a future version past IE7, which is understandable. Even internally, we have some sites that require modification because the version check does not fall within the coded range of IE5-IE7. Just note that in this version, IE8 is emitting "MSIE 8.0" in the user-agent string, and it's a frustrating thing to get a message that says that this new browser version is not supported on this site, and to go download IE7. Very easy to fix though.

Related resources:

 

Applying IE7 Rules against IE8, a CSS 2.1 Compliant Browser

As I mentioned this is the other issue that I'm having, and it deals with a change that we are making. To understand this, there is a little background required to explain the scenario .

The IE8 team recognized that their layout engine was not getting it done, specifically with CSS compliance; so, they rewrote it with the CSS 2.1 specification in-hand. (see Chris Wilson presentation below for background). The IE8 browser supports 3 layout modes:

  • Quirks: Backward compatibility with Microsoft® Internet Explorer 5 rendering behavior.
  • IE7 Standards: Backward compatibility with Internet Explorer 7 JavaScript and layout behavior.
  • IE8 Standards: The latest features, including the CSS2.1–compliant layout engine and DOM/HTML breaking changes.

The great thing about the IE8 Standards mode is that the IE8 team is fully committed to CSS 2.1 compliance. As an example, consider the announcement about IE8 satisfactorily passing the ACID2 test. There are challenges in meeting this goal, due to ambiguity and lack of official validation tests. Passing the ACID2 test is one validation. The IE8 team is also publicly sharing 700+ tests with the W3C to show their interpretations and allow the public to question / clarify the team's interpretation of the spec's. More detail here on this story including access to the tests, from the IE Team blog. Scott Dickens also comments on ACID3 test during his MIX presentation and says they most likely will not be passing by RTM (see the presentation below, about 55 min's in, also note that no popular browsers today have hit this mark either). Back to my point...

As announced at MIX, the default rendering mode for IE8 is IE8 Standards mode, which I think is a great step. Yes, it causes problems because some sites will have rendering problems, but these issues are easily addressed, and a necessary step to correct our compliancy position.

The core issue is that for sites that attempt to apply their IE7 layout (with the baggage of our past CSS bugs) to an IE8 browser in IE8 Standards mode, some sites will not render correctly. This leads to two steps to correct the situation:

  1. Apply the META tag (or a DOCTYPE, or call a script function) to tell the browser to render in IE7 mode. Very easy to implement. Here's a meta tag example: <meta http-equiv="X-UA-Compatible" content="IE=7"> .
  2. Or, let IE8 use the other CSS files that you created for other compliant browsers (and use the IE8 Standards mode). Since we will be rendering with the CSS 2.1 rule set, this will be better solution in the long term.

One last note on this. If you want to support IE7 and IE8 modes on their corresponding browsers (basically 2nd point above), you will also want to check out the guidance on Conditional Comments, specifically when assigning CSS stylesheets to your pages. (See the Scott Dickens presentation for better explanation.)

Conclusion

There are a bunch of other reasons for adopting IE8, but existing sites supporting IE7 can get there quickly. For more detail, consider the following resources. I'd start with the MIX videos and then the IE8 Readiness Toolkit.

I highly recommend the Scott Dickens presentation below (Advanced Cross-Browser Layout) for the best background. For my anti-IE religious friends out there, this is where they should start.

As well, contact your local DPE evangelist, start a discussion about IE8, and send your questions/feedback.

Resources

Unrelated Learning

In IE8, one can drop in JavaScript commands in the address bar. One of the documents mentioned this. Example: javascript:alert(document.documentMode);