What is Doctype:
In HTML and XHTML, the DocType is a special tag that goes right at the top of the page above <HTML> and warns the browser what's coming.
e.g. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
It should be written exactly as specified with respect to spellings and case. i.e. doctype in capital letters, exact url for dtd etc.
It informs browser using which html standards it should render the coming html page.
It switches the browser from ‘Quirk’ to ‘Standard’ mode which is known as ‘Doctype switching.’
Quirk mode: The way the old browsers would have rendered your page, using old standards.
For e.g. IE Quirks Mode is IE5.5. IE6, 7 and 8 all switch back to 5.5 when they encounter a Quirks Mode page.
Quirks mode is generated when you either use the HTML 4.01 Transitional Doctype, you don't define a Doctype, or you use a doctype without a URL DTD defined. For example, Internet Explorer changes how the pages are displayed if you remove the DTD from the Transitional Doctype:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
Standard mode: Browser would render the page using the new standard way.
Difference Between DOCTYPE and dtd:
The document type declaration is said to communicate HTML version information
DOCTYPE switches the browser from standard to quirk mode and dtd tells browser to use which standards.
What if I remove DTD and only put DOCTYPE:
On removing the dtd the browser is suspected to remain to quirk mode. Because browser cannot detect the standards to render the web page/app without dtd url.
IE remains in quirk mode if you do not put dtd.
Some of the problems that can be encountered:
- You will not be able to use a HTML (HyperText Markup Language) Validator to check the page coding. HTML validation requires the DOCTYPE declaration.
- The browser rending the web page will process the coding in Quirks Mode.
- The stylesheet may not be implemented as planned.
Some of the commonly used DOCTYPES:
HTML 4.01 Transitional - Safe for Most Browsers
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
The HTML 4.01 Transitional DOCTYPE is probably the most popular DTD out there. It gives you the older tags like fonts that are no longer part of the strict specification. It tells browsers that you are using the most up-to-date HTML, but need some backwards compatibility.
HTML 4.01 Strict DOCTYPE is Harder to Implement
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
HTML 4.01 Strict removes all the deprecated tags from the specification. Be careful whenever you use strict DTDs to validate your HTML ensure that it's correct. Strict DTDs are great for being absolutely correct against the standard, but not all browsers handle the alternatives to tags that are missing.
