Part of the Technical Health audit

Check your DOCTYPE declaration

A missing DOCTYPE pushes browsers into quirks mode, where layout rules from the 1990s take over. SiteCurl checks that your pages declare a modern DOCTYPE.

No signup required. Results in under 60 seconds.

What this check does

SiteCurl checks the first line of every page in your scan for a valid DOCTYPE declaration. The correct modern DOCTYPE is <!DOCTYPE html>. Pages missing this declaration, or using an outdated DOCTYPE like XHTML Transitional, are flagged.

The DOCTYPE must appear before any other content in the HTML, including whitespace or comments. SiteCurl verifies both its presence and its position.

Without a DOCTYPE, browsers switch to quirks mode. In quirks mode, CSS box model calculations, font sizing, and table rendering all behave differently than modern standards specify.

How this shows up in the real world

The DOCTYPE declaration is a leftover from the early web, but it still matters. In the 1990s, browsers each had their own rendering rules. When web standards arrived, browsers needed a way to know whether a page was written for the old rules or the new ones. The DOCTYPE became that signal.

A page with <!DOCTYPE html> tells the browser to use standards mode. CSS works as specified. Box model calculations are predictable. Layouts render consistently across Chrome, Firefox, Safari, and Edge.

A page without a DOCTYPE triggers quirks mode. In quirks mode, the CSS box model adds padding and border inside the element's width instead of outside it. Font sizes on table cells ignore inheritance. Inline elements handle overflow differently. These differences are subtle enough that a page may look 'mostly right' in testing but break on certain browsers or screen sizes.

The fix is trivially simple: one line at the top of your HTML. But that one line affects how every CSS rule on the page is interpreted. Missing it means your carefully tested layouts may not render as expected for some visitors.

Why it matters

Quirks mode changes how CSS is applied. Layouts that look correct in your browser may break for visitors using a different browser or device. The inconsistencies are subtle and hard to debug because the root cause is a missing line, not a CSS error.

Some JavaScript APIs also behave differently in quirks mode. document.compatMode returns 'BackCompat' instead of 'CSS1Compat,' and certain DOM measurements change. This can cause scripts that work in standards mode to fail in quirks mode.

Search engines expect modern HTML. While a missing DOCTYPE is unlikely to affect rankings directly, it signals a poorly maintained site. Combined with other technical issues, it contributes to an overall quality picture.

Who this impacts most

Older sites that have been running for years without a redesign are most likely to be missing a DOCTYPE. Sites built before 2010 may use an XHTML Transitional DOCTYPE that triggers 'almost standards' mode with slightly different behavior.

Sites using custom HTML templates (not a CMS) are at higher risk. CMS platforms like WordPress and Shopify include the DOCTYPE in their default templates. Hand-coded sites depend on the developer remembering to add it.

Sites with complex CSS layouts (flexbox, grid, precise spacing) are most affected by quirks mode because the box model differences compound across nested elements.

How to fix it

Step 1: Add the DOCTYPE. Place <!DOCTYPE html> as the very first line of your HTML file. Nothing should come before it, including comments, whitespace, or byte order marks.

Step 2: Check your CMS template. In WordPress, open your theme's header.php file and verify the DOCTYPE is present. In custom templates, check the main layout file that wraps all pages. Fix it once in the template and every page is corrected.

Step 3: Remove outdated DOCTYPEs. If your page uses a long DOCTYPE like <!DOCTYPE html PUBLIC '-//W3C//DTD XHTML 1.0 Transitional//EN'...>, replace it with the simpler <!DOCTYPE html>. The HTML5 DOCTYPE triggers full standards mode in every modern browser.

Step 4: Verify rendering after the change. Switching from quirks mode to standards mode can shift layouts if your CSS relies on quirks mode behavior. Check your pages visually after adding the DOCTYPE and fix any CSS issues that appear.

Common mistakes when fixing this

Placing content before the DOCTYPE. Even a single blank line or a PHP comment before the DOCTYPE can trigger quirks mode in some browsers. The DOCTYPE must be the absolute first thing in the document.

Using an XHTML DOCTYPE on an HTML5 page. If your page uses HTML5 features but declares an XHTML 1.0 DOCTYPE, validators will flag errors. Use the HTML5 DOCTYPE for modern pages.

Assuming the CMS handles it. Most CMS platforms do include the DOCTYPE, but custom themes or page builders can override the default template. Check the actual HTML output, not just the template settings.

How to verify the fix

After adding the DOCTYPE, run another SiteCurl scan. The issue should clear. For a manual check, view the page source (Ctrl+U or Cmd+Option+U) and verify that <!DOCTYPE html> is the first line. No blank lines or comments should appear before it.

You can also check the rendering mode in your browser's console by typing document.compatMode. It should return 'CSS1Compat' for standards mode. If it returns 'BackCompat,' the page is in quirks mode.

The bottom line

The DOCTYPE is one line of HTML that controls how the entire page renders. Without it, browsers fall back to 1990s rendering rules that break modern layouts. Add <!DOCTYPE html> as the first line of every page. It takes seconds and eliminates an entire class of cross-browser issues.

Example findings from a scan

DOCTYPE declaration found: html

Missing DOCTYPE declaration on /about

Outdated DOCTYPE: XHTML 1.0 Transitional

Frequently asked questions

What is quirks mode?

Quirks mode is a backward-compatible rendering mode that browsers use when the DOCTYPE is missing. It applies CSS rules from the 1990s, which changes how padding, borders, and font sizes work. Modern sites should always use standards mode via the HTML5 DOCTYPE.

Does the DOCTYPE affect SEO?

Not directly. But a missing DOCTYPE can cause rendering issues that affect user experience, which indirectly affects engagement metrics. It also signals to crawlers that the site may not follow modern web standards.

Can I check my DOCTYPE without signing up?

Yes. The free audit checks your home page for DOCTYPE issues as part of a full seven-category scan. No signup needed. Results in under 60 seconds.

What if my site works fine without a DOCTYPE?

It may look fine in your browser, but quirks mode causes subtle layout differences across browsers and devices. The CSS box model changes, font sizing works differently, and some JavaScript APIs return different values. These issues may not show up in your testing but affect visitors on other browsers.

Check your DOCTYPE now