You did everything you thought was right, but the page doesn't behave correctly in the latest browsers. That's because you wrote invalid XHTML and CSS. You used the W3C standard Document Object Model (DOM) to manipulate dynamic elements on the page. And when browsers try to implement these standards, your site fails. This is most likely caused by a wrong document type (DOCTYPE). This article is to provide you with how DOCTYPE works and explain some actual real-world usage of these document types.
Why a DOCTYPE?
According to the HTML and XHTML standards, a DOCTYPE (short for "document type declaration") is used to tell the browser which version of (x)HTML you are using, and must appear at the top of every page. DOCTYPEs are an important component of web pages: without them, your CSS will no longer be valid.
As mentioned in the ALA article mentioned before (and other interesting points as well), DOCTYPE must also be adapted to other browsers, such as Mozilla, IE5/Mac, or IE6 or IE7.
A new DOCTYPE contains an entire URI (sconf Note: Universal Resource Identifier, Universal Resource Identifier) (a complete URL), which tells browsers to parse (render) the page into a model compatible with the standard. Process (X)HTML, CSS and DOM into what you expect.
Using an incomplete or old DOCTYPE, or even no DOCTYPE at all, will cause the browser to convert it into a "Quirks" model, where the browser assumes that you are writing outdated, broken post-90s code.
With this setting, the browser will try to parse your page using the old standard and parse your CSS into the IE4 standard. And replies to the owner with a special DOM (IE replies to IE's DOM, while Mozilla and Netscape 6 reply to the model they think it is).
Undoubtedly, this is not what you want. But it’s something you get often. So this article wants to correct these incorrect or incomplete DOCTYPEs.
(Note: Opera browser does not support these rules. It always tries to parse web pages into standards-adapted ones. On the other hand, Opera does not provide strong support for W3C's DOM. But they can also run well) Ed: Since this article was first published, Opera has added DOM-compliant functionality to Opera 7.
Where did DOCTYPE go? (Where HAVE ALL THE DOCTYPES GONE?)
Although document types are an important integral part of WEB standards in browsers, and although W3C leads the creation of WEB standards, you also expect that W3C sites can provide some appropriate document types, and you may also want to find this information more quickly and easily. , however, as I write this, you can’t yet. {Ed: The W3C now lists a series of standard DOCTYPEs on its website. You can see these in the W3C Guidelines, such as "My Web site is standard. And yours?"}
W3.org is not a List Apart, WebReference or Webmonkey. It was not originally intended to help WEB designers, developers, and civil society organizations accelerate their understanding and use of the latest technologies. This is not his job.
The W3C publishes a series of guidelines, although most web designers are unaware of them. #
You can search for DOCTYPEs all day long on W3.org without having to look at the dedicated lists. And when you do download a DOCTYPE (usually related to some specific proposal or working draft), it doesn't work properly on your site.
Throughout the W3C site are DOCTYPEs with missing URIs (sconf note: not complete URIs), which point to the W3C's own website. Once these are moved from the W3C to your own web pages, these URLs will become non-existent documents.
For example, the DOCTYPE of many sites is directly copied from W3.org:
The following is the quoted content: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" |
If you see the last part of this DOCTYPE ("DTD/xhtml1-strict.dtd"), you will find that this is a relative link to the W3C site. This is on the W3C site, not yours. So this URI has no effect on the browser. (sconf note: When you visit W3.org, this only works because this is a relative link).
This DOCTYPE should actually be changed to:
The following is the quoted content: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" |
Note that the DOCTYPE behind contains a complete URI. This displays a valid resource on the network so that the browser can find it and parse your document into standards-compliant form.
HOW TO USE DOCTYPE(DOCTYPES THAT WORK)
So how to use DOCTYPE? Glad you asked. The complete DOCTYPE below is all we need:
HTML 4.01 strict, transitional, frame
The following is the quoted content: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" " http://www.w3.org/TR/html4/strict.dtd "> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" " http://www.w3.org/TR/html4/loose.dtd "> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" " http://www.w3.org/TR/html4/frameset.dtd "> |
XHTML 1.0 strict, transitional, framework
The following is the quoted content: <!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 "> |
XHTML1.1 DTD
The following is the quoted content: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" |