Which doctype should I use?

Anyone who's viewed the source of a modern webpage will be familiar with the DOCTYPE declaration that begins a HTML document. Here I'll explain what they're used for, why they're important and which form is correct.

Quirks mode

If your company is hiring a web developer, ask at the interview if they understand something called Quirks Mode. If they've never heard of it, you have a problem. Understanding this browser rendering mode and how to avoid it is critical to creating webpages that render consistently across browsers.

Lesson One of modern web development is that Internet Explorer has never quite done things properly, but it's improving. It will still give you more trouble than any other major browser today. Thankfully, a significant portion of your IE troubles go away if Internet Explorer detects a correct doctype declaration.

It works like this: Prior to Internet Explorer 6, IE didn't support web standards with any sort of consistency. Yet it was such a popular browser that most people designed their webpages to work with its quirky, non-standard rendering mode. We call this Quirks Mode.

In order to allow developers to build websites for IE6's new modicum of web standards compliance—we call this one Standards Mode—it was declared that websites with a correct and current doctype declaration would render in Standards Mode, while sites using an old doctype or none at all would continue to use the old Quirks Mode.

At current, Internet Explorer holds perhaps half the total market share of installed web browsers. If you expect your webpage to function with any sort of consistency between web browsers, you need to set a doctype that triggers Standards Mode.

The correct doctype

If you're in a hurry, any of the following doctypes will suffice:

In order to function correctly, you can have nothing before the doctype, except whitespace. Whitespace includes spaces, newlines and HTML comments. You must not include the <?xml prologue, regardless of how often you've seen "Web 2.0" sites do it. Internet Explorer 7 might understand it, but a significant number of people still use Internet Explorer 6, which doesn't.

But which is the One True Doctype?

The ideal doctype depends on what you want to achieve. In general, I prefer HTML 4.01 (Strict). It's the most straightforward modern doctype, as XHTML offers no benefits in most cases and raises certain minor issues that have to be addressed. Don't be put off by the name "Strict"; your browser is no more or less fault-tolerant in Strict as in Transitional.

HTML 4.01 Transitional is much like Strict, except backwardly compatible with certain elements and attributes you generally only want to use on old pages that already use them. Extra elements supported by Transitional include <applet>, <basefont>, <center>, <dir>, <font>, <isindex>,<menu>, <s>, <strike>, and <tt>. Transitional also supports certain attributes like <p align="right"> and <body bgcolor="FFFFFF">, generally things you should now be using CSS for instead.

Once touted as HTML's successor, XHTML is really just high-maintainence HTML. Most browsers simply interpret XHTML as HTML by ignoring the extra markup, meaning you need to adhere to both the Differences with HTML 4 list and the Appendix C: HTML Compatibility Guidelines. Use XHTML if you're using a content management system that only generates XHTML markup.

The difference between XHTML 1.0 Strict and XHTML 1.0 Transitional is much the same as in HTML, with Transitional supporting a few deprecated elements and attributes. XHTML 1.0 Transitional appears to be the more popular XHTML doctype, although it's hard to tell if this is from demand for deprecated elements, web developers copying doctype declarations from each other, marginally better IE compatibility, or an unfounded fear of Strict doctype being too 'strict' on errors.

Frequently Asked Questions

I get these a lot:

Should I use HTML, or XHTML?
Use HTML, unless you have a good reason to use XHTML. "It's more standard" is not a good reason—in fact, it's not even true. Good reasons include working with a system that requires XHTML and making use of XHTML or XML specific features. Less pure but still valid reasons include working for clients who ask for XHTML, impressing future employers by having another acronym on your resume, keeping yourself in line with XML's well-formedness rules, and enjoying all the extra markup you get to add.
Why not use the newer XHTML 1.1?
Even though you're writing XHTML pages, odds are your webserver is sending it out as type text/html. The web standard for XHTML 1.1 forbids you from doing this. Even if you did, the differences are minor and provide no practical benefit. XHTML 1.1 is not "better" or "more standard".
What's wrong with sending my page as application/xhtml+xml?
Again, I see people do this because they imagine that it's "more standard". All it does is to cause your page to break in Internet Explorer, since IE (even IE7) doesn't properly support XHTML. You can use browser detection to send text/html to IE and application/xhtml+xml to more standards-compliant browsers, but then you can't rely on any XHTML-specific features, which most webpage authors won't use anyway.
What do I do if I don't want to support Internet Explorer 6?
You support it anyway. IE6 still holds a significant browser share, perhaps 5-20% of the total market. Failing to support such a large percentage of users is unprofessional at best, and plain foolish if you're earning money from the site. At any rate, making your site work in IE6 helps ensure that it also works in IE7, which holds a much greater browser share.

Further reading

Page created: 19th August 2008

« Home