Testing sites with Browser Mode vs. Doc Mode

  • Article

With site developers verifying that their sites run well in IE9 and taking advantage of the new HTML5 capabilities and better performance in IE9’s Standards mode, now is a good time to recap how to use Browser Mode and Document Mode to test sites for IE9 and previous IE versions.

In summary, developers can use IE’s Developer Tool’s Browser Mode menu to test how their site will run in different versions of IE. The Document Mode menu is what developers use to determine the best rendering mode for their site in an IE8 and IE9 browser. As we’ve mentioned before, we want sites to run well in the latest standards document mode - IE9’s standards mode in IE9 and IE8’s standards mode in IE8.

Before diving into more detail, let’s start with an overview of IE’s versioning and compatibility system…

Diagram of IE's versioning system

As illustrated above, versioning and compatibility start with Browser Mode. Browser Mode sets how IE will identify itself to web servers and how websites will be handled by default. An important detail to remember is that Browser Mode is chosen before IE requests web content. This means that sites cannot choose a Browser Mode. Instead site developers choose a Document Mode for their site, which overrides IE’s defaults and declares how a website is rendered. If a site does not specify a document mode then IE assumes the default document mode, which is IE9’s standards mode in IE9.

  • Developers can change Browser Mode through the “Browser Mode” menu in IE’s F12 Developer Tools. This setting only applies to the developer’s local machine. For example, developers can have IE9 emulate an IE7 browser, IE8 browser or IE9 in Compatibility View. IE9's F12 Developer Tools Browser Mode menu
  • Users can change Browser Mode by clicking on the Compatibility View (CV) button, which causes IE8 and IE9 to emulate the IE7 browser. This is why it’s important for site developers to test their site in the Compatibility View Browser Mode.
  • IE’s Compat View List can also change the Browser Mode for specific sites.

The Browser Mode determines

Browser Mode

Description

IE9

IE9 reports a UA string, version vector, and document mode to match the default browser behavior, which is the most standards-compliant mode in IE9. Use this mode to test how IE9 users experience your site.

IE9 Compatibility View

IE9 reports a UA string, version vector, and document mode, as if it is IE7; however, the UA string also includes the Trident/5.0 token indicating that the browser is really IE9. Use this mode to test how IE9 users experience your site if they click on the Compatibility View button.

IE8

IE9 reports a UA string, version vector, and document mode as if it is IE8. Use this mode to test how IE8 users experience your site.

IE7

IE9 reports a UA string, version vector, and document mode as if it is IE7. Use this mode to test how IE7 users experience your site.

The Document Mode declares what mode IE’s Trident engine will render the markup in such as IE9’s Standards Mode. Changing the Document Mode through IE’s Developer Tools refreshes the page, but does not resend the UA string or retrieve new markup from the server.

As mentioned before, developers declare the document mode that IE will use when rendering their site. The default document mode is IE9’s Standards mode in IE9. Developers can use the doctype and X-UA-Compatible Meta tag or HTTP Header to change that default as they see fit.

  • Developers can change the document mode on their local machines for testing with the Developer Tools. IE9's F12 Developer Tools Document Mode menu
  • Users cannot independently change the document mode for a site (users can click on the Compat View button, which changes the document mode to IE7 for the site)
  • IE’s Compat View List can change the document mode for specific sites.
  • Developers have ultimate control over what document mode their site runs in by declaring a doctype and X-UA-Compatible Meta tag or HTTP Header.
Document Mode

Description

IE9 Standards

This is the latest standards-compliant behavior available in IE9, and is the default mode used by IE9 to render a webpage that has a strict or unknown document type.

IE8 Standards

This behavior matches IE8 when it renders a webpage that has a strict or unknown doctype.

IE7 Standards

This behavior matches IE7 when it renders a webpage that has a strict or unknown doctype.

Quirks

This behavior matches IE when rendering a document with no doctype or a Quirks doctype. It is similar to the behavior of IE5 and the Quirks mode behavior of IE6, IE7 and IE8.

Call to action for site developers:
Blog readers have asked why IE9 has document modes for previous versions and when we’ll remove them. As mentioned in previous posts, we have document modes for the IE versions that developers target. These document modes enable developers to update their sites on their own schedule. As long as developers need document modes to run their sites, we’re going to support them. We want to remove document modes as soon as the web transitions to run in the latest standards mode. The timing is really up to developers.

We want as many sites as possible to run in IE9’s Standards mode, which is the default. Many developers really want this too - to make the most of modern capabilities and better performance across the web platform. The best way for a site to do this is to use a standards doctype and no X-UA-Compatible Meta tag or HTTP header. If you’ve determined that the best document mode for your site is not the default, publish the correct X-UA-Compatible Meta tag or HTTP Header on your site so that users experience your site in the mode it was designed and tested for. If your site isn’t running in IE9’s Standards mode, decide on an update plan and get your site running the same standards-based markup across browsers.

After verifying that your site works well in IE9, use IE Developer Tool’s Browser Mode to verify that your site continues to work well in previous IE versions by changing the menu options to IE7 and IE8. If you find an issue, use feature and behavior detection to get your site running well in IE9 and previous IE versions.

Marc Silbey
Program Manager