Quirks Mode - Using the DOCTYPE Tag
Using the DOCTYPE Tag
If you've been designing Web pages for more than a few months, you are most likely aware of the
difficulty in writing a page that looks the same in all browsers. In point of fact, it's impossible.
Many browsers were written with special items that only they could handle. Or they have special ways
of handling things that are different from how other browsers handle them.
For example:
- Layers were created for use in Netscape browsers. They don't work in any other browser,
and in fact have been deprecated in Netscape 6.x+.
- Inline frames were originally created for Internet Explorer only, and have since become
part of the XHTML specification.
- Internet Explorer 6.0 adds an additional space (like a <br>) surrounding <div> tags,
unless you write the contents of the div all on one (long) line.
- Netscpe 4.7 will not display tables that are not written in correct HTML - it shows a
blank page instead.
The problem for browser developers is that they have to create Web browsers that are backwards
compatible with Web pages built for older browsers. In order to deal with this issue, browser makers
created modes for the browsers to operate in. These modes are defined by the presence or absence of
a DOCTYPE and what that DOCTYPE calls.
DOCTYPE Switching
If you put the following DOCTYPE in your Web page:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
Modern browsers (IE 6+, Netscape 6+, Mozilla 1+, Safari 1+, Opera 6+) would interpret this in the
following fashion:
- It's an HTML 4.01 document
- Because it's marked as Transitional, the browswers will display it in "quirks" or "non-standards" mode.
This means that they will try to display this document as it might have displayed in an older browser
(IE 5, Netscape 4, etc.), while still supporting any new tags.
And if you put this DOCTYPE in your document:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
This tells modern browsers that you want to display your HTML 4.01 page in strict compliance with the DTD.
These browsers will go into "strict" or "standards" mode and render the page in compliance with the
standards. (So, for this document, tags such as <font> might be completely ignored by the browser.)
If you leave the DOCTYPE out completely, the browsers are automatically kicked into "quirks" mode.
Why Use DOCTYPE
Once you're aware of this type of DOCTYPE switching going on, you can affect your Web pages more
directly by using a DOCTYPE that indicates what the browser can expect from your page. Also, once you
start using DOCTYPE, you'll be writing HTML or XHTML that is closer to being valid (you should still
validate it). And by writing valid XHTML, you encourage browser makers to build standards compliant
browsers.
By Jennifer Kyrnin
I hope this came in useful!
Ask in the forum
if you have any suggestions or comments.