<!DOCTYPE> | NN all IE all HTML 3.2
<!DOCTYPE...> | HTML End Tag: Forbidden
The DOCTYPE element is not an HTML element, but rather a comment in the Standard Generalized Markup Language (SGML) format (as are so-called HTML comments in the <!-- ... --> style). This element must be the first element in a document, except as noted below for XHTML documents, and must always precede the <HTML> tag element. It advises the browser as to the document type definition (DTD) that the HTML source code is designed to follow. All browsers have a default document type that defines which elements and element attributes the browser supports (and that the browser has the internal programming to supportbuggy or otherwise). Specifying a document type for a more modern DTD does not empower an older browser to support elements and attributes for which it is not coded. Conversely, specifying a constricted DTD does not prevent a browser from recognizing and supporting backward-compatible or proprietary elements and attributes.

A DOCTYPE element contains several unlabeled attribute values that specify such details as the name for the outermost document tag (html for our purposes), the organization responsible for the DTD, the address of the actual DTD file (called a system identifier), a plain-language name for the definition (including version number, if necessary), and the like. For example, the following DOCTYPE refers to an HTML 4.01 DTD that includes all deprecated elements and attributes:

The next example points to the XHTML 1.1 DTD, which does not include deprecated items nor frames:

Additionally, if you specify an XHTML DTD, you should include one of the following SGML-processing instruction tags prior to the DOCTYPE declaration:

The latter version includes a setting for character set encoding, which may alternatively be set in a <META> tag. The W3C HTML and XHTML validators encourage documents to declare their character-encoding type in one way or the other.

For the most part, web authors include a DOCTYPE element to facilitate validation of the HTML source code prior to publication on the Web. But some modern browsers behave slightly differently based on the details of the DOCTYPE comment at the start of the document. Both IE 6 and Netscape 6 operate in one of two "modes," depending on the details of the DOCTYPE attribute values. One mode points to backward compatibility with implementations that came before, and diverge from, the W3C standards; the other mode causes the browser to behave more in keeping with W3C recommendations. The differences between the two modes lay primarily in fine layout details that are more carefully defined in modern-day CSS and DOM specifications. For simple layouts, you probably won't notice the difference in modes. But if your pages rely upon style sheets or backgrounds for tables, form control alignment (especially in tables), precise font sizing or spacing, and, in IE, pixel-perfect CSS positioning with respect to the document edges and positioned element sizes, you need to pay attention to the DOCTYPE details in your documents.

It is difficult to guide you through every compatibility detail, but a couple of broad recommendations should keep you on track. First, if you are pleased with the layouts of your current pages or templates, you will probably be best served by continuing to use DOCTYPE settings that keep you in backward-compatible mode (the Mozilla engineers call it "quirks" mode; Microsoft has no particular name for the mode). But if you are generating new content, especially for the newer browsers (ideally, Version 6 or later), you should gravitate toward the "strict" (Navigator) or "standards-compatible" (IE) mode settings.

The number of DOCTYPE attribute values in common use today is mind boggling, and the rules that govern which attributes force each browser into a particular mode are not 100% in sync across browsers. But here are a few of the more common DOCTYPE tags that force Version 6 browsers into backward-compatible mode, regardless of browser:

A couple of points worth noting. First, all of the above examples declare HTML DTDs no later than HTML 4.01, and none are XHTML. Second, none of the above examples includes a system identifier URI to a reference .dtd file. Also, if you omit the DOCTYPE element entirely, the browser applies the equivalent of the old internal DTDs.

Now here are common DOCTYPE tags that force Version 6 browsers into the modern, standards-based mode:

All HTML 4.x/strict and XHTML DTDs switch on standards-compatible mode, with or without the URLs. Including the URL with HTML 4.x transitional and frameset DTDs invokes the standards-compatible mode.

To learn more about the impact of the DTD choice on DOM and CSS features in the latest browsers, see Chapter 9 (client- and offset- properties, the body object, the document.compatMode property) and Chapter 10 (height and width attributes). Appendix E shows which HTML 4 elements and attributes are supported by each of the most popular HTML 4.01 and XHTML 1.0 DTDs for validation purposes.

Object Model Reference
    [window.]document.firstChild
Element-Specific Attributes
Attributes are unlabeled.
Element-Specific Event Handler Attributes
None.

lang | NN 3 IE 4 HTML 4
lang="languageCode" | Optional
The language being used for the element's attribute values and content. A browser can use this information to assist in proper rendering of content with respect to details such as treatment of ligatures (when supported by a particular font or required by a written language), quotation marks, and hyphenation. Other applications and search engines might use this information to aid the selection of spell-checking dictionaries and the creation of indices.
Example
    <SPAN lang="de">Deutsche Bundesbahn</SPAN>
Value
Case-insensitive language code.
Default
Browser default.
Object Model Reference
    [window.]document.getElementById(elementID).lang