Document Type Definitions - DTD's
Posted 07 November 2002 - 08:57 PM
Firstly, a DTD is a statement at the top of a web page, which tells the browser what type of page it is. As we are currently in a bit of a transition with HTML4.01 moving onto XHTML1.0 it’s a fair bit more important than it maybe used to be.
I don’t really want to get into the differences between HTML and XHTML here, suffice to say there are quite a few changes in the recommended standards as to how certain things should be done. Moving more away from HTML attributes to CSS styles as the main thing.
The main 3 DTD’s you need to worry about for HTML are:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" http://www.w3.org/TR...l40/strict.dtd>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" http://www.w3.org/TR...ml40/loose.dtd>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" http://www.w3.org/TR...0/frameset.dtd>
If your not familiar with DTD’s then a quick overview of what they mean might be in order.
The main bits to look at are the //W3C//DTD HTML 4.01 Transitional and the end of the http://www.w3c.org/TR/html/
The first part tells you which overall standard you are using. HTML 4 was the first step towards bringing CSS styles into the main overall standards. If you’ve done any research into tags and standards you may keep seeing notes about some of them being deprecated. This basically means that although they are in the standard, it’s a historic thing only and you should use an alternative method.
The URL points to the exact document defining the terms of how the tags in the document should be applied. In the examples above you can see the only differences are at the end of the URL’s mentioning either the strict, loose or frameset.
Using HTML4.01 you should use one of the above tags at the very top of any pages on your site.
The first 2 have fairly nominal differences, however if you use frames you should use the 3rd one.
The differences between the strict and loose definitions are basically how closely you adhere to the recommended standards. Unless your going out of your way to ensure you are using valid HTML4.01 markup I would recommend the loose definition when not using frames.
As with HTML there are 3 main DTD’s for XHTML:
<!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">
Again the first 2 are fairly similar, it really depends how strictly you are sticking to the standards. The main place that this will make a difference is if you run the page by a validator. Using a strict definition where you have used markup that maybe in HTML4 but not in XHML1 with throw up lots of errors when you run it through a validator like the one at the W3C.
As with the HTML DTD’s, if you are using frames you should use the frameset DTD (the bottom one) and unless your are making sure your markup is correct then use the transitional DTD (middle one).
For some more information I would recommend having a look at this article on the Web Developers Virtual Library. Its aimed at XHTML and has some good info on the differences between HTML4 and XHTML1. Several of which I only just learnt reading it!
Although there is a bigger step forward to using things like CSS there are several other differences noted on the ‘Differences with HTML 4’ which maybe minor coding things, it’s the kind of thing that makes the difference between a strict DTD and a transitional one.
Although most browsers are fairly kind if you don’t include a DTD it can throw up problems. Most of the current ones will default back to HTML4.01 transitional loose. NS4.x will probably go back a little further, I’m not entirely sure. Gecko powered browsers though (Mozilla and NS7) can be a bit random if not specified. Gecko is intended to be very standards compliant and as such pretty much expects you to include one I think! Therefore, in some cases, adding an appropriate definition may solve problems.
There is a lot of other information about DTD’s out there, though I have found it difficult in the past to find info on different definitions grouped together. If anyone knows of such a resource please post it!
Posted 08 November 2002 - 03:05 AM
I've collected some, and have listed them below. I have to confess that I've learned more than a little in compiling this list that I wasn't aware of, too.
One important reason to use a DTD is that newer browsers, such as the latest mozilla/netscape, will display a page in slightly different manners based upon which DTD you use on your page. If you don't include a doctype, the browser will use a mode of looking at a page that doesn't include a number of newer standards. That mode is known as "quirks" mode, and the name fits. Especially if you are trying to use CSS. That can cause problems, such as making centering of text in tables not work correctly if you're trying to use CSS to do formatting.
It's also important to know a little about these DTDs if you use a WYSIWYG editor, because HTML editing programs that select a DTD for you don't always use the one that they should.
Below are some pages on DTDs, and a little snippet from most of them:
You may have run into cases where you used CSS to set a certain font size for the BODY element, only to find that the font size didn't get applied to tables. This relates to some legacy problems with tables and the inheritance of styles. In bugwards compatibility mode, this behavior will continue. However, in strict mode, any styles which can be inherited into a table will be.
Doctype switching and standards compliance: An overview
What is doctype switching?
Summary: Some modern browsers have two rendering modes. Quirk mode renders an HTML document like older browsers used to do it, e.g. Netscape 4, Internet Explorer 4 and 5. Standard mode renders a page according to W3C recommendations. Depending on the document type declaration present in the HTML document, the browser will switch into either quirk mode or standard mode. If there is no document type declaration present, the browser will switch into quirk mode.
Activating the Right Layout Mode in Mozilla, Mac IE 5 and Windows IE 6
In order to deal with both old tag soup written to old browser quirks and new standards-compliant pages, Mozilla (and Mozilla-based browsers, such as Netscape 6), Mac IE 5 and Windows IE 6 have two layout modes. In one mode the layout engine attempts to comply with W3C Recommendations. In the other mode the layout engine tries to mimic old browsers. In Mozilla these modes are known as “the Standards mode” and “the Quirks mode” respectively. In this document the same names are used also when referring to the modes of Mac IE 5 and Windows IE 6.
Note: The latest Mozilla builds have almost three modes. They have a variant of the Standards mode known as the Almost Standards mode. The Standards modes of Mac IE 5 and Windows IE 6 are closer to Mozilla’s Almost Standards mode than to the (Full) Standards mode. The table below includes the new behavior, but I have not yet had the time to revise the prose of this document entirely.
Standards ... or be careful what you ask for
It is very important that you use the appropriate DOCTYPE in order to tell the browser how you expect your page to be laid out. Here's a brief DOCTYPE usage guide.
A List Apart - Fixing your site with the right doctype
YOU’VE DONE ALL THE RIGHT THINGS, but your site doesn’t look or work as it should in the latest browsers.
You’ve written valid XHTML and CSS. You’ve used the W3C standard Document Object Model (DOM) to manipulate dynamic page elements. Yet, in browsers designed to support these very standards, your site is failing. A faulty DOCTYPE is likely to blame.
Mozilla Quirks Mode Behavior
The following is a rough list of the differences that exist between Mozilla's standards mode and quirks mode behavior.
Table Centering Test
This document attempts to illustrate various methods for centering tables, either by using CSS, or by using html methods in the context of a transitional doctype declaration. For examples of centering other block-level elements such as paragraphs, see the "Centering blocks" page.
Feedback: Table Centering with CSS
This document is a companion to "Table Center Test". The purpose of this document is to further demonstrate examples of browser behavior (either submitted by readers or discovered by me) on the table centering examples given the page above
Mozilla's DOCTYPE sniffing
This document contains describes how Mozilla uses the DOCTYPE declaration to determine strict mode vs. quirks mode.
All My FAQs Wiki: Doctype
Questions asked, and answered:
What is a DOCTYPE and which one do I use?
How is the lack of a doctype an error?
Posted 22 December 2002 - 07:39 AM
I guess it's too late to reiterate the "one world, one browser" plea of some years ago?
As far as I can see, one should assemble some sort of huge wall chart documenting the various browsers and DTDs, and somehow choose which DTD to use on a particular site today.
Personally, I use a combination of tables and CSS, and have been only slowly letting out the reins on the CSS. This seems to work well, and we don't experience the coliding images and text that one sometimes sees. But this whole advancing DTD thing can be a bit much. I guess that's what you "pay" for advancement.
Posted 09 January 2003 - 11:28 AM
I have several sites which do not have the DTD statement and have been indexed by the major engines.
Posted 09 January 2003 - 03:24 PM
As I believe I mentioned before, Mozilla tends to go into 'Quirks' mode, sometimes things will be fine, other times it will break badly.
With technologies like XHTML and XML coming into use more, and not necessarily as replacements for HTML, it will become more and more important to declare the language you are using.
Posted 24 March 2004 - 11:09 AM
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" http://www.w3.org/TR/html40/loose.dtd>is a document type declaration and not the Document Type Defintion.
When you say:
is a bit unclear what the DTD actually defines. A DTD defines amongst other things which tags may be used, which order they can appear in, which attributes these tags can have, what values these attributes can have, down to the specifics of what can appear between tags i.e. character data, comments, other tags etc.
The URL points to the exact document defining the terms of how the tags in the document should be applied.
A DTD says nothing about how presentation should be applied to a document. By declaring a DTD you should be saying 'my page has no errors for the type of document it is, go on and parse it. And please display it correctly'.
Browsers have default DTD's if none are declared and try to fix documents that won't parse so that at least something is displayed.
Browsers also have default presentation to apply to .html pages.
If you don't declare a DTD you're saying to the browser 'guess how to parse this and guess what order the tags should come and what the attributes mean.'
And if isn't valid for that DTD you could never get the right display settings applied to your document. Never.
If we write well-formed and valid webpages we can complain about differences in how the browsers display things. If we don't then we're snotty kids deservedly getting our noses wiped.
Posted 05 April 2004 - 10:38 AM
I checked a couple of big sites in Dutch, and the ones actually containing a DTD, all had "EN" for English.
Does that code replace <html lang="en"> and the content-language metatag?
Or would that particular language code just say that the HTML is some kind of English?
Posted 05 April 2004 - 10:51 PM
The "En" included in the declaration is noting that the defintion is in English.
The last two letters of the declaration indicate the language of the DTD. For HTML, this is always English ("EN").
(From the W3c's write up of html 4.0)
One of the W3c pages on Language information and text direction includes an example where this snippet is from:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
<TITLE>Un document multilingue</TITLE>
Note that the html is in English, but the text of the page is in French.
I think that there have been some efforts to translate DTDs into other languages, and those may have an HTML that isn't in English.
0 user(s) are reading this topic
0 members, 0 guests, 0 anonymous users