Using the DOCTYPE Tag
Having trouble with your Web pages? Can't get them to display correctly in your browser? It might be that your page is a little "quirky."
Even if you take care of all these errors, something else may be causing your
Web pages to display incorrectly or even not at all: failure to use a
statement or, if used, failure to use the right one.
A large number of Web pages don't use the
<DOCTYPE>statement (Interestingly, many of them are Web development sites). Does it really make a difference? For the most part, not much. But if you want to make sure your Web site renders correctly in various browsers, then it's best to use it. You'll also need it if you plan on validating your Web pages.
In an effort to contend with Web pages written for older browsers, the newer browser versions (Mozilla-based browsers, Netscape 7, Windows Internet Explorer 6, Mac Internet Explorer 5, Opera 7, and Safari) have two types of presentation modes: standard and quirks. Using the standard mode, the browser tries to follow W3C recommendations. When the browser goes into quirks mode, it's trying to emulate an older version of the browser. This could cause the browser to ignore your page's style sheets and render the page unusable (Mozilla and Safari also have a third mode: almost standards modes, which mainly pertains to the vertical sizing of tables).
What Is It?
<DOCTYPE> declaration tells the browser what version of
(X)HTML is being used so it will know how to display the page. The declaration
may also provide a link to a text file (i.e., the
loose DTD) which the browser uses to obtain further information. It's similar
to having a tune-up done on your car. In order to perform it correctly, the
mechanic must know the make, model, and year of the car. He must also know how
many cylinders the engine has and its horsepower. Once he knows this, he can
move forward and properly tune the engine.
The W3C sets the specifications for common protocols used on the Web. This helps to ensure that each Web site is accessible to the various user agents (browsers/viewers/readers). Technically, there are no standards regarding Web site development in relation to coding. There are only "specifications," or, as the W3C calls them, "recommendations." These specifications, however, are seen by most Web developers, as well as the creators of user agents, as being on a par with standards. Most of the current browsers (i.e., Firefox, Opera, Safari) are beginning to closely follow the specifications.
If you follow the recommendations, your Web pages (for the most part) will work correctly. If they don't, it's easier to get help when you are following the rules instead of having to explain the way that you did it. If the specs are not followed, it's more of a hit-and-miss game. You'll need to figure out what works and what doesn't. Then you'll have to recheck all of your Web pages on all of your Web sites each time a new browser hits the streets to make sure that your non-standard code works in it.
<DOCTYPE> declaration must be the very first thing in
your document, before the
<html> tag. Then, when the browser
begins to load the page, it knows how to treat the code within the page.
There are three different document types for HTML 4.01: Strict, Transitional, and Frameset. The Strict type is used with Cascading Style Sheets and helps to ensure clutter-free coding.
The Transitional type is used when HTML presentational features are included in the document instead of in a style sheet. This is done to accomodate older browsers that don't support CSS.
The Frameset type is used in documents that have frames.
The same three document types are also used in XHTML 1.0:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<!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">
<DOCTYPE> declaration is actually a comment tag,
it won't confuse older browsers that don't understand the statement.
- Mozilla's DOCTYPE Sniffing
- Mozilla Quirks Mode Behavior
- !DOCTYPE [Internet Explorer]
- Doctypes and Their Respective Layout Mode
- Validation Tools