What is the purpose of the HTML DOCTYPE declaration?

· Category: HTML & CSS

Short answer

The <!DOCTYPE html> declaration tells the browser which version of HTML the page is written in and triggers standards mode rendering.

How it works

Without a DOCTYPE, browsers may fall back to quirks mode, an outdated compatibility layer that emulates old browser bugs. In quirks mode, CSS box model calculations, layout behavior, and default styles can behave unpredictably. Declaring <!DOCTYPE html> ensures the browser follows modern HTML5 specifications consistently.

Example

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <title>My Page</title>
  </head>
  <body></body>
</html>

Why it matters

Using the correct DOCTYPE is the simplest way to avoid cross-browser layout inconsistencies. It is required at the very top of every HTML document, before any tags or whitespace, to guarantee standards-compliant parsing and rendering.