Related
I know that different doctypes are essentially about how compliant the html is, but what difference does it make what doctype you specify? Do browsers handle the same code differently depending on the doctype?
Thanks
UPDATE - most answers mention quirks mode can be set off if no doctype is specified. But what would be the different between xhtml and html 4.01?
The biggest thing is having a doctype or not. If you don't, the browser will work in a "quirks" mode rather than standards mode and many things will be slightly different. If you have one — any — that typically activates more standards-compliant behavior in the browser.
See this article for the details of what doctypes do on various different browsers and what modes — quirks, standards, almost-standards, etc. — different browsers have. Quoting a relevant section:
Modes for text/html Content
The choice
of the mode for text/html content
depends on doctype sniffing (discussed
later in this document). In IE8 and
IE9, the mode also depends on other
factors. However, by default even in
IE8 and IE9, the mode depends on the
doctype for non-intranet sites that
are not on a blacklist supplied by
Microsoft.
It cannot be stressed
enough that the exact behavior of the
modes varies from browser to browser
even though discussion in this
document has been unified.
Quirks Mode
In the Quirks mode the
browsers violate contemporary Web
format specifications in order to
avoid “breaking” pages authored
according to practices that were
prevalent in the late 1990s. Different
browsers implement different quirks.
In Internet Explorer 6, 7, 8 and 9,
the Quirks mode is effectively frozen
IE 5.5. In other browsers, the Quirks
mode is a handful of deviations from
the Almost Standards mode.
If you are authoring new pages now,
you are supposed to comply with the
relevant specifications (CSS 2.1 in
particular) and use the Standards
mode.
Standards Mode
In the Standards mode
the browsers try to give conforming
documents the specification-wise
correct treatment to the extent
implemented in a particular browser.
Since different browsers are at
different stages of compliance, the
Standards mode isn’t a single target,
either.
HTML 5 calls this mode the “no quirks
mode”.
Almost Standards Mode
Firefox, Safari,
Chrome, Opera (since 7.5), IE8 and IE9
also have a mode known as “the Almost
Standards mode”, which implements the
vertical sizing of table cells
traditionally and not rigorously
according to the CSS2 specification.
Mac IE 5, Windows IE 6 and 7, Opera
prior to 7.5 and Konqueror do not need
an Almost Standards mode, because they
don’t implement the vertical sizing of
table cells rigorously according to
the CSS2 specification in their
respective Standards modes anyway. In
fact, their Standards modes are closer
to the Almost Standards mode than to
the Standards mode of newer browsers.
HTML 5 calls this mode the “limited
quirks mode”.
IE7 Mode
IE8 and IE9 have a mode that
is mostly a frozen copy of the mode
that was the Standards mode in IE7.
Other browsers do not have a mode like
this, and this mode is not specified
by HTML5.
IE8 Standards Mode
IE9 has a mode that
is mostly a frozen copy of the mode
that was the Standards mode in IE8.
Other browsers do not have a mode like
this, and this mode is not specified
by HTML5.
IE8 Almost Standards Mode
IE9 has a
mode that is mostly a frozen copy of
the mode that was the Almost Standards
mode in IE8. Other browsers do not
have a mode like this, and this mode
is not specified by HTML5.
...but see the article for a full discussion.
From Wikipedia:
A Document Type Declaration, or
DOCTYPE, is an instruction that
associates a particular SGML or XML
document (for example, a webpage) with
a Document Type Definition (DTD) (for
example, the formal definition of a
particular version of HTML). In the
serialized form of the document, it
manifests as a short string of markup
that conforms to a particular syntax.
The HTML layout engines in modern web
browsers perform DOCTYPE "sniffing" or
"switching", wherein the DOCTYPE in a
document served as text/html
determines a layout mode, such as
"quirks mode" or "standards mode". The
text/html serialization of HTML5,
which is not SGML-based, uses the
DOCTYPE only for mode selection. Since
web browsers are implemented with
special-purpose HTML parsers, rather
than general-purpose DTD-based
parsers, they don't use DTDs and will
never access them even if a URL is
provided. The DOCTYPE is retained in
HTML5 as a "mostly useless, but
required" header only to trigger
"standards mode" in common browsers.
I decided to quote this text because it answers your question better than I would :). It is important that the absence of a DOCTYPE will trigger "quirks mode" in certain browsers.
It's all about the standards and yes, browsers handles code differently. That means, that all browsers should display the page equally. If no standard is specified, browser will interpret the page as it wants.
The declaration is not an XHTML tag; it is an instruction to the web browser about what version of the markup language the page is written in.
The declaration refers to a Document Type Definition (DTD). The DTD specifies the rules for the markup language, so that the browsers render the content correctly.
The DOCTYPE declaration is required to be compliant to SGML, the language HTML is an instance of.
The DOCTYPE declaration is used by some browsers to trigger different rendering modes.
Browser Modes
Back in the past, Browsers implemented CSS to their own rules.
Only over the years have Browser now adapted the W3C standards.
To make sure that websites rendered correctly various browsers, web developers had to implement CSS according to the wishes of these browsers. Thus, most websites used CSS in ways that didn’t quite match the specifications.
Therefore, when standards compliancy became important browser vendors faced a tough choice. Moving closer to the W3C specifications was the way to go, but if they’d just change the CSS implementations to match the standards perfectly, many websites would break to a greater or lesser extent. Existing CSS would start to show odd side effects if it were suddenly interpreted in the correct way.
So moving closer to standards compliance would cause problems. On the other hand, not moving closer to standards compliance would perpetuate the general confusion of the Browser Wars Era.
To this end all Browser had to start supporting both modes. Quirks mode for older designs and standard mode for new design.
Paraphrased from here: Quirks mode and strict mode
DocTypes
Choosing which mode to use requires a trigger, and this trigger was found in ’doctype switching’.
According to the standards, any (X)HTML document should have a doctype which tells the world at large which flavour of (X)HTML the document is using.
Taken from here too: Quirks mode and strict mode
Additonal Resources
Document Type Declaration
Quirks Mode on Wikipedia
Quirks mode and strict mode
Internet Explorer box model bug
The CSS box model
The doctype declaration should be the first thing in an HTML document, before the tag.
It isn't an HTML tag; it's an instruction to the web browser about what version of the markup language the page is written in.
It's getting simpler with HTML5: <!DOCTYPE html>
If you don't have that proper doctype, the browser won't know to use HTML5.
Because Doctype is the flag to tell how the browser should handle the page.
For example :
HTML5 need this doctype<!DOCTYPE html>
If you remove this from the page, the any HTML5 capabilities inside your page won't be activated.
You can read more in http://www.w3.org/QA/Tips/Doctype
What is DOCTYPE and why do I want to use it?
What are the different DOCTYPEs I can use?
What is the difference between standards and quirks mode, and what are some quirks I may run into with differently set DOCTYPEs?
Lastly, what is the proper DOCTYPE that I should be using?
Basically, the DOCTYPE describes the HTML that will be used in your page.
Browsers also use the DOCTYPE to determine how to render a page. Not including a DOCTYPE or including an incorrect one can trigger quirks mode.
The kicker here is, that quirks mode in Internet Explorer is quite different from quirks mode in Firefox (and other browsers); meaning that you'll have a much harder job, trying to ensure your page renders consistently with all browsers if the quirks mode is triggered, than you will if it is rendered in standards mode.
Wikipedia has a more in-depth summary of the differences in rendering when using various DOCTYPEs. XHTML is enabled by certain DOCTYPEs, and there is quite a bit of debate about the use of XHTML which is covered well in XHTML — myths and reality.
There are subtle differences between different "standards compliant" rendering DOCTYPEs, such as the HTML5 DOCTYPE (<!DOCTYPE html>, prior to HTML5, only known as the "skinny doctype" which does not trigger standardized rendering in older browsers) and other DOCTYPEs such as this one for HTML 4.01 transitional:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
The DOCTYPE tells the consuming user agent (web browsers, web crawlers, validation tools) what type of document the file is. Using it ensures that the consumer correctly parses the HTML as you intended it.
There are several different DOCTYPES for HTML, XHTML, and Framesets and each of these has two modes Strict and Transitional. Strict says that your markup is using the defined standards exactly. See W3C DTDs page for further details.
Quirksmode is basically the layout method from the browser wars days when the standards were much less respected and defined. Generally a standards mode page, that is valid, will layout more consistently across various browsers, but may lack certain features that you require. One such features is the anchor tag's target attribute. The Quirksmode site is a great resource for these differences.
One final thought is that the new HTML5 standard proposes using a very simple DOCTYPE:
<!DOCTYPE html>
Using this DOCTYPE is a forward compatible way to specify that your pages are in standards mode, and are HTML. This is the method that Google uses, and is reasonably easy to remember. I recommend using this DOCTYPE unless you plan to use XHTML.
A doctype defines which version of HTML/XHTML your document uses. You would want to use a doctype so that when you run your code through validators, the validators know which version of HTML/XHTML to check against. This page provides a good overview:
Don't forget to add a doctype
Common doctypes you can use are listed here:
Recommended list of DTDs
Which doctype you should go with depends on the code you're using, but to get an idea, try running your code through the W3C validator and use the Document Type drop-down menu in the "More Options" menu to try different doctypes out.
W3C Markup Validation Service
In HTML (including XHTML) as used on web pages, DOCTYPE is a string that triggers one of a few browser modes (quirks mode, standards mode, almost standards mode), depending on the exact spelling of the DOCTYPE. You want to use it to select a browser mode that best suits your page.
Formally, in SGML and XML, a DOCTYPE declaration is a reference to a Document Type Definition (DTD), which specifies the formal syntax rules of the markup language. No browser has ever used DTDs for anything or even accessed them. However, they are used by SGML and XML markup validators such as the W3C Markup Validator, except in HTML5 mode. Therefore, the choice of DOCTYPE determines how a validator works if the document is submitted to it. However, the validator mode of operation can also be selected in its user interface. (SGML and XML processors may use DOCTYPEs in different other ways, too, but the question is apparently meant to be limited to the HTML context and to web browsers and closely related software.)
There is no authoritative list of DOCTYPEs. Each HTML specification or draft defines its own DOCTYPE, or DOCTYPEs. The set of DOCTYPEs recognized by browsers when selecting mode varies by browser. In practice, there is no reason to use a DOCTYPE other than <DOCTYPE html> as defined in HTML5, though HTML5 also lists a few “legacy DOCTYPEs”. You can use that DOCTYPE if you want standards mode (recommended for new pages) and use no DOCTYPE if you want quirks mode (which you may need for legacy pages).
“Standards mode” generally means the mode of operation where a browser follows HTML, CSS, DOM and other specifications the best it can. It does not usually mean full conformance. “Quirks mode” is different in different browsers, but generally it means an attempt at imitating the behavior of very old browsers like IE 5. The purpose is to keep old pages working, under the assumption that they may rely on features and bugs in the old browsers. See the description What happens in Quirks Mode? Note that there is a rather different, more limited concept of “quirks mode” in HTML5, which closely resembles the document called Quirks Mode Living Standard.
A typical issue is that element widths are calculated differently in quirks mode and in standards mode. This means that the layout of a page may be more or less changed or even totally messed up, if a page designed to work in quirks mode is viewed in standards mode (or vice versa).
So you should use <!DOCTYPE html> for new pages and keep whatever DOCTYPE (if any) you have been using for old pages.
However, quirks mode means, in some browsers, that many new features of CSS are not supported. This means that if you want to enhance an old page with some CSS3 feature, it may well be necessary to switch to a DOCTYPE that triggers standards mode. In such a case, you need to review and test the page to see whether it will run in standards mode.
A doctype is a document that describes how the contents of a xhtml-like document can look like (like a webpage). Note: this defines only the syntax of said page, the rendering of the page is NOT defined by the DTD!
For example, a doctype could define how the <table>-tag can look like - which attributes it accepts, and which values/valuetypes are accepted for each attribute. Think of it as a lexicon for your current webpage.
Wikipedia has an informative page on the various Doctypes that are in common use. Mind you - there's nothing stopping you from creating your own doctype. The chances are, however, that the browser probably doesn't know how to render your document.
Which DTD to use depends on what you are going to write. XHTML has a whole different DTD than HTML, for example.
Doctypes tell the browser in what language the page is written in, be it HTML or XHTML. For example,
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
tell the browser to render the page as HTML4 strict. Older browsers used to render pages incorrectly and therefore newer browsers simulate errors of the older browsers when they find an old doctype.
Today you should use at least HTML4 or better XHTML.
A blog entry about doctypes is Fix Your Site With the Right DOCTYPE! (from A List Apart).
First of all there is no one doctype you should be using, but most designers try to make it work within XHTML 1.0 Strict.
A doctype is nothing more than a declaration of what tags you can use within your html (though the browsers can use more or less than what is defined) You can actually open up the doctype file and start reading (XHTML 1.0 Strict)
If you do not specify a doctype, the browser will try its best to guess but not always hits the correct type.
Quirks mode is just a technique used by browsers to be backwards compatible, a great example of quirks mode is how IE renders boxes
On the web, a doctype does nothing but tell the brower if you want standards, almost standards, or quirks mode.
What changes in quirks mode depends on the browser: Firefox, Opera, Safari, and Chrome implement a limited set of quirks, like removing the space for text descenders in code like <table><tr><td><img></td></tr></table> (solution: td img { vertical-align:bottom; }). IE, on the other hand, reverts to the rendering engine in IE5.5. That means that you won't be able to use any of the new features implemented since 2000.
To trigger standards mode, I suggest using the HTML5 doctype, <doctype html>, as it is the easiest to remember.
In my page, the doctype is declared as:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
no DTD is explicitly specified.
I wonder in IE which DTD will be defaulted?
seems it does not behave the same as
"http://www.w3.org/TR/html4/loose.dtd"
since my table in the page was broken after I added the loose.dtd.
Can anyone help explain this?
Thanks!
By the SGML standard, your document type declaration specifies a Document Type Definition by naming it, as registered by the W3C. However, by the HTML 4.01 spec, a document must have one of three alternative document type declarations, and all of them contain a URL, too.
This is as such just theory, since browsers don’t actually read DTDs. They treat document type declarations just as magic strings, in doctype sniffing. However, in most browsers, the choice of a browser’s mode is affected by the presence or absence of a URL in that magic string for HTML 4.01 Transitional. When it is absent, they operate in Quirks Mode. When it is present, most browsers operate in “standards mode” or “almost standards mode”.
Quirks Mode means a large number of different quirks, so the effect of switching from it to “standards mode” may imply just about anything (varying from no effect to complete disaster). Such a switch generally requires a careful check, if not rewrite, of the entire document.
Your mileage will vary depending on browser and version, but here's the short of it:
To the best of my knowledge, browsers don't actually go to any effort to fetch and make use of the dtd in the URL, or validate the code in any way. Resultingly, your webpage will work "fine" without a doctype declaration, with a broken doctype declaration, and in a number of other broken forms.
When not running your code through a validator, the major reason for providing a doctype definition at the top of your code is to pull browsers out of quirks mode and into standards compliance mode, ala the historical disaster with IE < 7 ...
It's a little bit outside of the scope to lecture on quirks and standards mode here, so the curious should head over to wikipedia:
http://en.wikipedia.org/wiki/Quirks_mode
Web browsers use their own relatively arbitrary standards to switch modes based on the doctype. What you are likely encountering is IE in quirks mode when your DTD lacks a URL, and standards mode when you add the URL.
You should probably aim to include the full declaration, including the URL, and run your code through the W3C validator [1] for good measure.
Fix the rendering problems with valid code and a full doctype [2]. Quirks mode was only ever intended for backwards compatibility so that unmaintained websites will continue to render as expected for as long as possible.
If your web page only renders as expected in quirks mode, your web page is broken.
Sidenote: you should seriously question why you are using 4.01 transitional in 2013.
[1] http://validator.w3.org/
[2] http://www.w3.org/QA/2002/04/valid-dtd-list.html
I know that different doctypes are essentially about how compliant the html is, but what difference does it make what doctype you specify? Do browsers handle the same code differently depending on the doctype?
Thanks
UPDATE - most answers mention quirks mode can be set off if no doctype is specified. But what would be the different between xhtml and html 4.01?
The biggest thing is having a doctype or not. If you don't, the browser will work in a "quirks" mode rather than standards mode and many things will be slightly different. If you have one — any — that typically activates more standards-compliant behavior in the browser.
See this article for the details of what doctypes do on various different browsers and what modes — quirks, standards, almost-standards, etc. — different browsers have. Quoting a relevant section:
Modes for text/html Content
The choice
of the mode for text/html content
depends on doctype sniffing (discussed
later in this document). In IE8 and
IE9, the mode also depends on other
factors. However, by default even in
IE8 and IE9, the mode depends on the
doctype for non-intranet sites that
are not on a blacklist supplied by
Microsoft.
It cannot be stressed
enough that the exact behavior of the
modes varies from browser to browser
even though discussion in this
document has been unified.
Quirks Mode
In the Quirks mode the
browsers violate contemporary Web
format specifications in order to
avoid “breaking” pages authored
according to practices that were
prevalent in the late 1990s. Different
browsers implement different quirks.
In Internet Explorer 6, 7, 8 and 9,
the Quirks mode is effectively frozen
IE 5.5. In other browsers, the Quirks
mode is a handful of deviations from
the Almost Standards mode.
If you are authoring new pages now,
you are supposed to comply with the
relevant specifications (CSS 2.1 in
particular) and use the Standards
mode.
Standards Mode
In the Standards mode
the browsers try to give conforming
documents the specification-wise
correct treatment to the extent
implemented in a particular browser.
Since different browsers are at
different stages of compliance, the
Standards mode isn’t a single target,
either.
HTML 5 calls this mode the “no quirks
mode”.
Almost Standards Mode
Firefox, Safari,
Chrome, Opera (since 7.5), IE8 and IE9
also have a mode known as “the Almost
Standards mode”, which implements the
vertical sizing of table cells
traditionally and not rigorously
according to the CSS2 specification.
Mac IE 5, Windows IE 6 and 7, Opera
prior to 7.5 and Konqueror do not need
an Almost Standards mode, because they
don’t implement the vertical sizing of
table cells rigorously according to
the CSS2 specification in their
respective Standards modes anyway. In
fact, their Standards modes are closer
to the Almost Standards mode than to
the Standards mode of newer browsers.
HTML 5 calls this mode the “limited
quirks mode”.
IE7 Mode
IE8 and IE9 have a mode that
is mostly a frozen copy of the mode
that was the Standards mode in IE7.
Other browsers do not have a mode like
this, and this mode is not specified
by HTML5.
IE8 Standards Mode
IE9 has a mode that
is mostly a frozen copy of the mode
that was the Standards mode in IE8.
Other browsers do not have a mode like
this, and this mode is not specified
by HTML5.
IE8 Almost Standards Mode
IE9 has a
mode that is mostly a frozen copy of
the mode that was the Almost Standards
mode in IE8. Other browsers do not
have a mode like this, and this mode
is not specified by HTML5.
...but see the article for a full discussion.
From Wikipedia:
A Document Type Declaration, or
DOCTYPE, is an instruction that
associates a particular SGML or XML
document (for example, a webpage) with
a Document Type Definition (DTD) (for
example, the formal definition of a
particular version of HTML). In the
serialized form of the document, it
manifests as a short string of markup
that conforms to a particular syntax.
The HTML layout engines in modern web
browsers perform DOCTYPE "sniffing" or
"switching", wherein the DOCTYPE in a
document served as text/html
determines a layout mode, such as
"quirks mode" or "standards mode". The
text/html serialization of HTML5,
which is not SGML-based, uses the
DOCTYPE only for mode selection. Since
web browsers are implemented with
special-purpose HTML parsers, rather
than general-purpose DTD-based
parsers, they don't use DTDs and will
never access them even if a URL is
provided. The DOCTYPE is retained in
HTML5 as a "mostly useless, but
required" header only to trigger
"standards mode" in common browsers.
I decided to quote this text because it answers your question better than I would :). It is important that the absence of a DOCTYPE will trigger "quirks mode" in certain browsers.
It's all about the standards and yes, browsers handles code differently. That means, that all browsers should display the page equally. If no standard is specified, browser will interpret the page as it wants.
The declaration is not an XHTML tag; it is an instruction to the web browser about what version of the markup language the page is written in.
The declaration refers to a Document Type Definition (DTD). The DTD specifies the rules for the markup language, so that the browsers render the content correctly.
The DOCTYPE declaration is required to be compliant to SGML, the language HTML is an instance of.
The DOCTYPE declaration is used by some browsers to trigger different rendering modes.
Browser Modes
Back in the past, Browsers implemented CSS to their own rules.
Only over the years have Browser now adapted the W3C standards.
To make sure that websites rendered correctly various browsers, web developers had to implement CSS according to the wishes of these browsers. Thus, most websites used CSS in ways that didn’t quite match the specifications.
Therefore, when standards compliancy became important browser vendors faced a tough choice. Moving closer to the W3C specifications was the way to go, but if they’d just change the CSS implementations to match the standards perfectly, many websites would break to a greater or lesser extent. Existing CSS would start to show odd side effects if it were suddenly interpreted in the correct way.
So moving closer to standards compliance would cause problems. On the other hand, not moving closer to standards compliance would perpetuate the general confusion of the Browser Wars Era.
To this end all Browser had to start supporting both modes. Quirks mode for older designs and standard mode for new design.
Paraphrased from here: Quirks mode and strict mode
DocTypes
Choosing which mode to use requires a trigger, and this trigger was found in ’doctype switching’.
According to the standards, any (X)HTML document should have a doctype which tells the world at large which flavour of (X)HTML the document is using.
Taken from here too: Quirks mode and strict mode
Additonal Resources
Document Type Declaration
Quirks Mode on Wikipedia
Quirks mode and strict mode
Internet Explorer box model bug
The CSS box model
The doctype declaration should be the first thing in an HTML document, before the tag.
It isn't an HTML tag; it's an instruction to the web browser about what version of the markup language the page is written in.
It's getting simpler with HTML5: <!DOCTYPE html>
If you don't have that proper doctype, the browser won't know to use HTML5.
Because Doctype is the flag to tell how the browser should handle the page.
For example :
HTML5 need this doctype<!DOCTYPE html>
If you remove this from the page, the any HTML5 capabilities inside your page won't be activated.
You can read more in http://www.w3.org/QA/Tips/Doctype
What is DOCTYPE and why do I want to use it?
What are the different DOCTYPEs I can use?
What is the difference between standards and quirks mode, and what are some quirks I may run into with differently set DOCTYPEs?
Lastly, what is the proper DOCTYPE that I should be using?
Basically, the DOCTYPE describes the HTML that will be used in your page.
Browsers also use the DOCTYPE to determine how to render a page. Not including a DOCTYPE or including an incorrect one can trigger quirks mode.
The kicker here is, that quirks mode in Internet Explorer is quite different from quirks mode in Firefox (and other browsers); meaning that you'll have a much harder job, trying to ensure your page renders consistently with all browsers if the quirks mode is triggered, than you will if it is rendered in standards mode.
Wikipedia has a more in-depth summary of the differences in rendering when using various DOCTYPEs. XHTML is enabled by certain DOCTYPEs, and there is quite a bit of debate about the use of XHTML which is covered well in XHTML — myths and reality.
There are subtle differences between different "standards compliant" rendering DOCTYPEs, such as the HTML5 DOCTYPE (<!DOCTYPE html>, prior to HTML5, only known as the "skinny doctype" which does not trigger standardized rendering in older browsers) and other DOCTYPEs such as this one for HTML 4.01 transitional:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
The DOCTYPE tells the consuming user agent (web browsers, web crawlers, validation tools) what type of document the file is. Using it ensures that the consumer correctly parses the HTML as you intended it.
There are several different DOCTYPES for HTML, XHTML, and Framesets and each of these has two modes Strict and Transitional. Strict says that your markup is using the defined standards exactly. See W3C DTDs page for further details.
Quirksmode is basically the layout method from the browser wars days when the standards were much less respected and defined. Generally a standards mode page, that is valid, will layout more consistently across various browsers, but may lack certain features that you require. One such features is the anchor tag's target attribute. The Quirksmode site is a great resource for these differences.
One final thought is that the new HTML5 standard proposes using a very simple DOCTYPE:
<!DOCTYPE html>
Using this DOCTYPE is a forward compatible way to specify that your pages are in standards mode, and are HTML. This is the method that Google uses, and is reasonably easy to remember. I recommend using this DOCTYPE unless you plan to use XHTML.
A doctype defines which version of HTML/XHTML your document uses. You would want to use a doctype so that when you run your code through validators, the validators know which version of HTML/XHTML to check against. This page provides a good overview:
Don't forget to add a doctype
Common doctypes you can use are listed here:
Recommended list of DTDs
Which doctype you should go with depends on the code you're using, but to get an idea, try running your code through the W3C validator and use the Document Type drop-down menu in the "More Options" menu to try different doctypes out.
W3C Markup Validation Service
In HTML (including XHTML) as used on web pages, DOCTYPE is a string that triggers one of a few browser modes (quirks mode, standards mode, almost standards mode), depending on the exact spelling of the DOCTYPE. You want to use it to select a browser mode that best suits your page.
Formally, in SGML and XML, a DOCTYPE declaration is a reference to a Document Type Definition (DTD), which specifies the formal syntax rules of the markup language. No browser has ever used DTDs for anything or even accessed them. However, they are used by SGML and XML markup validators such as the W3C Markup Validator, except in HTML5 mode. Therefore, the choice of DOCTYPE determines how a validator works if the document is submitted to it. However, the validator mode of operation can also be selected in its user interface. (SGML and XML processors may use DOCTYPEs in different other ways, too, but the question is apparently meant to be limited to the HTML context and to web browsers and closely related software.)
There is no authoritative list of DOCTYPEs. Each HTML specification or draft defines its own DOCTYPE, or DOCTYPEs. The set of DOCTYPEs recognized by browsers when selecting mode varies by browser. In practice, there is no reason to use a DOCTYPE other than <DOCTYPE html> as defined in HTML5, though HTML5 also lists a few “legacy DOCTYPEs”. You can use that DOCTYPE if you want standards mode (recommended for new pages) and use no DOCTYPE if you want quirks mode (which you may need for legacy pages).
“Standards mode” generally means the mode of operation where a browser follows HTML, CSS, DOM and other specifications the best it can. It does not usually mean full conformance. “Quirks mode” is different in different browsers, but generally it means an attempt at imitating the behavior of very old browsers like IE 5. The purpose is to keep old pages working, under the assumption that they may rely on features and bugs in the old browsers. See the description What happens in Quirks Mode? Note that there is a rather different, more limited concept of “quirks mode” in HTML5, which closely resembles the document called Quirks Mode Living Standard.
A typical issue is that element widths are calculated differently in quirks mode and in standards mode. This means that the layout of a page may be more or less changed or even totally messed up, if a page designed to work in quirks mode is viewed in standards mode (or vice versa).
So you should use <!DOCTYPE html> for new pages and keep whatever DOCTYPE (if any) you have been using for old pages.
However, quirks mode means, in some browsers, that many new features of CSS are not supported. This means that if you want to enhance an old page with some CSS3 feature, it may well be necessary to switch to a DOCTYPE that triggers standards mode. In such a case, you need to review and test the page to see whether it will run in standards mode.
A doctype is a document that describes how the contents of a xhtml-like document can look like (like a webpage). Note: this defines only the syntax of said page, the rendering of the page is NOT defined by the DTD!
For example, a doctype could define how the <table>-tag can look like - which attributes it accepts, and which values/valuetypes are accepted for each attribute. Think of it as a lexicon for your current webpage.
Wikipedia has an informative page on the various Doctypes that are in common use. Mind you - there's nothing stopping you from creating your own doctype. The chances are, however, that the browser probably doesn't know how to render your document.
Which DTD to use depends on what you are going to write. XHTML has a whole different DTD than HTML, for example.
Doctypes tell the browser in what language the page is written in, be it HTML or XHTML. For example,
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
tell the browser to render the page as HTML4 strict. Older browsers used to render pages incorrectly and therefore newer browsers simulate errors of the older browsers when they find an old doctype.
Today you should use at least HTML4 or better XHTML.
A blog entry about doctypes is Fix Your Site With the Right DOCTYPE! (from A List Apart).
First of all there is no one doctype you should be using, but most designers try to make it work within XHTML 1.0 Strict.
A doctype is nothing more than a declaration of what tags you can use within your html (though the browsers can use more or less than what is defined) You can actually open up the doctype file and start reading (XHTML 1.0 Strict)
If you do not specify a doctype, the browser will try its best to guess but not always hits the correct type.
Quirks mode is just a technique used by browsers to be backwards compatible, a great example of quirks mode is how IE renders boxes
On the web, a doctype does nothing but tell the brower if you want standards, almost standards, or quirks mode.
What changes in quirks mode depends on the browser: Firefox, Opera, Safari, and Chrome implement a limited set of quirks, like removing the space for text descenders in code like <table><tr><td><img></td></tr></table> (solution: td img { vertical-align:bottom; }). IE, on the other hand, reverts to the rendering engine in IE5.5. That means that you won't be able to use any of the new features implemented since 2000.
To trigger standards mode, I suggest using the HTML5 doctype, <doctype html>, as it is the easiest to remember.