HTML5 doctype

What we check

We read the first line of the HTML of the home page:

• <!DOCTYPE html>: modern HTML5 doctype, everything is fine.
• An older doctype, such as from HTML 4.01 or XHTML 1.0: note.
• No doctype: warning.

In the report you see the doctype found.

Why it matters

Without a doctype browsers switch to the so-called quirks mode, a compatibility mode for websites from the 1990s. In it they calculate spacing, sizes and fonts by old, inconsistent rules. The consequence: the page looks different in different browsers, elements are shifted or too large, and modern CSS partly does not work as expected.

An outdated doctype such as

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

does still work. But it shows that the template of the website dates from the time before 2010. Usually other parts are outdated then too: no responsive layout, old JavaScript libraries, table layout.

How to fix it

The solution is a single line, right at the start of every page, even before <html>:

<!DOCTYPE html>
<html lang="en">

Nothing may come before it, not even a space or a comment.

Where to change it?

• WordPress: in the file header.php of the theme or, with block themes, in the template. If the doctype is missing, the theme is very old. Switching to a current theme usually makes more sense than a repair.
• Other CMS: in the main template, usually with "layout", "page" or "base" in the file name.
• Static websites: in every HTML file.
• Wix, Jimdo, Squarespace: set the doctype correctly. There is nothing to do here.

Test after switching

When a page changes from quirks mode to standards mode, spacing and sizes can change slightly. Check the page on desktop and smartphone afterwards.

The bigger picture

If the doctype is outdated, it is worth looking at the whole technical basis. Often a relaunch with a modern builder or CMS is more economical than many individual repairs.

How to check it yourself

Open the page source (right-click › "View page source"). The very first line should read <!DOCTYPE html>. Upper and lower case do not matter.

Frequently asked questions

What is a doctype anyway?

The very first line of an HTML page. It tells the browser by which rules it should display the page. For all modern websites it is simply <!DOCTYPE html>.

Is a page displayed worse with an old doctype?

Usually not visibly. A doctype from HTML 4 or XHTML continues to work. It is a clear sign, though, that the technical basis of the website is old.