How to Fix Doctype, Charset and Old HTML

What this means

A site audit checks a few basics in each page's code:

• A doctype: the first line of the page, <!DOCTYPE html>, which tells the browser the page uses modern HTML.
• A character set: a line such as <meta charset="utf-8"> that tells the browser how to read letters and symbols.
• Outdated code: frames, Flash, and old tags such as <font> and <center> that modern browsers no longer support properly.

Why it matters

Without a doctype, browsers fall back to "quirks mode", an old way of drawing pages that can make layouts look broken. Without a character set, accented letters, pound signs and apostrophes can turn into strange symbols.

Flash stopped working in every major browser at the end of 2020, so anything built in it shows nothing at all. Frames confuse search engines and break the back button. Old tags usually still display, but they're a sign the page hasn't been updated in years.

How to fix it

Missing doctype or character set

These lines come from your theme or template, not the content of each page, so one fix usually solves every page.

• WordPress: almost every modern theme includes both. If yours doesn't, the theme is very old: updating it or switching to a maintained theme is the safest fix. A developer can add the two lines to the theme's header file if you need to keep it.
• Shopify, Wix and Squarespace: these add both lines for you. If a page is flagged, check for custom code pasted into the page or theme that might be breaking the start of the page.
• A hand-built site: make sure every page starts like this:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">

Frames and Flash

There is no quick fix: the content has to be rebuilt in modern HTML. If a page relies on Flash for a slideshow, video or menu, replace it with an image gallery, an embedded video or a normal menu from your site builder. If an old page is built from frames, rebuild it as a normal single page.

If these pages are no longer needed, delete them and redirect their addresses to a current page.

Old tags

Tags like <font> and <center> often come from text pasted in from an old site or a word processor. In your editor, select the text and use "clear formatting", then style it with your theme's normal options.

Checking your fix

View the page source (right-click, then View Page Source). The first line should be the doctype, and the character set should appear near the top.

If you use Duality, tick the page in Site Audit and choose Verify my fixes to check it again straight away.