Importance of a !DOCTYPE

Earlier we mentioned the importance of declaring a !DOCTYPE at the top of an html page.

Including a !DOCTYPE at the top of an html page changes the way that IE 6 and Netscape 6+/FireFox behave.

Without a !DOCTYPE declaration both the IE 6 and Netscape 6+ browsers revert to a non standard, sometimes called quirk mode.

In non standard mode the Internet Explorer 6 CSS Box Model does not correctly implement the W3C standards.

The downside of adding a suitable !DOCTYPE is that in standard mode Netscape is less forgiving of sloppy coding.
It requires any values used to be given their units of measurement.

For example, when using the top attribute to position an element you must use
top:25px; not just top:25;

This has implications for both CSS and javascript coding.

As a further complication even with a doctype, IE 6 will revert to 'quirks mode' if your page has the xml declaration

<?xml version="1.0" encoding="UTF-8" ?>

Therefore it is advisable to leave the xml declaration off until IE is fixed.

Instead add the following line to the head section of your page

<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />

html5 Doctype update

With the emergence of html5 we see a much simpler doctype which will put modern browsers into standards mode.

To quote Jonh Resig-- "For those of you who aren't familiar with the HTML5 DOCTYPE, it looks like this:

<!DOCTYPE html>

You'll note that it's significantly simpler than most DOCTYPEs that you've seen - and that was intentional.

A lot has changed in HTML5 in an attempt to make it even easier to develop a standards-based web page, and it should really pay off in the end.

What's nice about this new DOCTYPE, especially, is that all current browsers (IE, FF, Opera, Safari) will look at it and switch the content into standards mode - even though they don't implement HTML5.

This means that you could start writing your web pages using HTML5 today and have them last for a very, very, long time."- John Resig -HTML5 DOCTYPE