As the title describes, what are the different doctypes available and what do they mean? I notice that the layout looks a little different in IE7 when I switch from
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" >
to
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
Are there any others and what are the effects or ramifications?
Thanks!
In HTML version 4, there are three types of DOCTYPES can be used: strict,transitional and frameset.
The HTML document type declaration, also known as DOCTYPE , is the first line of code required in every HTML or XHTML document. The DOCTYPE declaration is an instruction to the web browser about what version of HTML the page is written in. This ensures that the web page is parsed the same way by different web browsers.
Types: In the previous versions of HTML, there were different kinds of Doctypes that were declared in each version of HTML, but in HTML5 there is only one type of Doctype available.
Traditionally, a Doctype, or Document Type Declaration associates the document with a Document Type Definition.
The Document Type Definition is a standard for a specific XML or SGML document. XML and SGML themselves doesn't have much of a schema or a very specific set of rules aside from how tags and attributes work in general. You can think of a DTD a description of the rules for a particular kind of document (like HTML, SVG or MathML). They say what tags are allowed where (e.g. that an html
element must contain exactly one head
element followed by exactly one body
element).
There are alternatives to DTDs such as XML Schemas that are more commonly used today.
Browsers, however, do not use DTDs at all. They read the Doctype to determine the rendering mode, but the rules for parsing the document are entirely baked into the browser.
This is why HTML 5 has a Doctype (to determine the rendering mode) but not DTD.
Rendering Modes
Early web browsers were very buggy. When new versions were released they had to maintain compatibility with their predecessors and rivals. This made it very hard to fix bugs because websites were built that depended on them.
To resolve this, modern browsers have different rendering modes (standards mode, for rendering your document and css according to standards, and quirks mode, wherein the browser emulates the bugs of earlier browsers, and almost standards mode which sits between the two).
Choosing a Doctype
There are two factors to consider when selecting a Doctype:
Generally this means you should use HTML 5. It is the current standard and best reflects how browsers actually work:
<!DOCTYPE html>
Failing that. Strict doctypes avoid most features that should be handled with CSS.
When writing in XHTML 1.0, this Doctype is common:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
More obsolete features are available via:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">
When writing in HTML 4.01, this one is common instead:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
With the obsolete features being in
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
and
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN"
"http://www.w3.org/TR/html4/frameset.dtd">
Note that most of the above have variations (e.g. you can omit the URL and rely on the public identifier) which have implications for the support of standards mode. This article includes an extensive list.
Debate on Strict versus Transitional Doctypes
(Note that the following is much, must less true in 2021 than it was in 2008)
Standards evangelists have called for web developers to stop using the Transitional Doctype on new pages and instead use Strict. Again, this is a case where the theory and the practice have some difficulties being reconciled. The original hope of the transitional Doctype was to provide a halfway house for transitioning legacy websites toward standards-compliance. With transitional doctypes, the restriction on elements and attributes is literally "less strict", so developers would be able to get their work running under standards mode sooner, and phase out the outstanding differences over time.
Controversy exists because it isn't always quite so simple for a developer change the Doctype in an enterprise environment. Freelance developers and makers of small- or medium- sized websites may often have an easier time determining their Doctype and making this transition. In an enterprise production environment for a highly-demanded web-based service, there are inherently more complicated dependencies on legacy systems and 3rd party code products, which themselves may be on a roadmap for removal or redesign, but the execution of such changes must be done methodically and incrementally.
Helpful Tools
The W3C (World Wide Web Consortium) is a group which plays an active role in defining these kinds of standards. They maintain a helpful online tool at http://validator.w3.org/ for verifying and validating documents against their standards. There are many other 3rd party tools and browser extensions with similar functionality.
Browsers don't care what doctype you use (well, almost true), they use it for one thing and one thing only: to decide which render mode to use. See e.g. the Fx or Opera documentation for real-world examples on what algorithms is used to decide which mode to use (I guess there is some documentation for IE buried somewhere in MSDN too ... [This may be the correct page](http://msdn.microsoft.com/en-us/library/ms535242(VS.85).aspx), I don't know, sorry).
There are however two major modes in most browsers (some browsers have an almost standards mode too):
You can use (the non-standard) document.compatMode
property in previous mentioned browsers to check which mode that was used to render the current document.
(Note on XHTML: I assumed that you serve you documents as HTML (text/html
), if you serve you document as XHTML (probably application/xhtml+xml
) most browser jumps into standard mode directly and don't care about the doctype at all AFAIK.)
BTW: the recommendation (or, what looked like a recommendation) in the other answer is broken, the transitional DTD should not be used on new documents. Always use strict (the term "strict" is kind of misleading, should be "default" or something else non-scary), period:
Authors should use the Strict DTD when possible, but may use the Transitional DTD when support for presentation attribute and elements is required. -- HTML 4.01: 22 Transitional Document Type Definition.
We recommend that authors write documents that conform to the strict DTD rather than the other DTDs defined by this specification. -- HTML 4.01: 4 Conformance: requirements and recommendations
And there are many blog post about this, e.g. no more Transitional DOCTYPEs, please (from 2006, but some, obviously, still have problems with this :).
This post started out with pointing out that browsers don't care what you choose, and then developed into a rant about how to choose the correct DTD, interesting ... But if you are going to spend(/waste?) time and energy to choose a DTD you might as well choose the correct one (from a HTML 4.01 standard perspective that is).
Or, you can ignore all this and use the following instead, soon anyway:
<!doctype html>
(This answer to "any reason not to start using the HTML 5 doctype?" was kind of related to the last part.)
Here is the official explanation of the various DTD's from the W3C:
http://www.w3.org/QA/2002/04/valid-dtd-list.html
You might also find the following beneficial:
http://www.freedivs.com/tutorials/Choosing%20a%20DOCTYPE/
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With