Why do we need DOCTYPE in html?

doctype html


✧ In the old days of the web, pages were written in two versions: One for Netscape Navigator, and one for Microsoft IE.

✧ When the web standards were made at W3C, browsers could not just start using them, as doing so would break most existing sites on the web.

✧ Browsers, therefore, introduced two modes to treat new standards-compliant sites differently from old legacy sites.

✧ Modes were: Quirks Mode and Standards Mode. ✧ For HTML documents, browsers use a DOCTYPE at the beginning of the document to decide which mode to handle.


✧ In HTML, the doctype is “required” to ensure that the browser makes a best-effort attempt at following the relevant specifications. ✧ Doctype is “not” an HTML element, rather a special instruction to the browser.

If specified, it has to be at “the beginning” of the HTML document just after the Byte-Order-Mark (BOM) if any.

✧ The DOCTYPE for HTML5 is case-insensitive and can be written as < !DOCTYPE html >

Formats of Doctypes

There are 3 types

  • Normal
  • Deprecated
  • Legacy Tool Compatible


  • Normal (HTML5) <!DOCTYPE html>
  • Deprecated (HTML 4/4.01, XHTML 1.0/1.1) <!DOCTYPE html PUBLIC “-//W3C//DTD HTML 4.01//EN”>
  • Legacy Tool Compatible <!DOCTYPE html system “about:legacy-compat”>

If Doctype is not specified?

  • Browser will switch into “Quirks Mode” when rendering a document.
  • Quirks Mode “may be” incompatible with some standard specifications.
  • The document may “render differently” in different browsers.


  • “<!DOCTYPE html>” is the required preamble found at the top of all HTML documents.
  • Its sole purpose is to prevent a browser from switching into “Quirks Mode” when rendering a document.
Ranjith kumar
3 2 votes
Article Rating
Notify of

Inline Feedbacks
View all comments