Best Practices Small

Character encoding was not declared: the fix

Declare a character encoding

Declaring <meta charset="utf-8"> tells the browser exactly how to interpret the bytes of the page before it starts parsing content. Without an early, correct charset declaration, browsers have to guess, and a wrong guess turns accented characters, quotation marks, or symbols into visibly garbled text (mojibake).

Find out whether your site has this problem, and every other check, in one free scan.

Check your site free

Why it matters

Without a declared charset, browsers may guess the encoding incorrectly, causing special characters, accents, or symbols to render as garbled text.

How to fix

  1. 1 Add <meta charset="utf-8"> within the first 1024 bytes of <head>, so browsers see it before parsing any non-ASCII content.
  2. 2 Confirm the file is actually saved/served as UTF-8 so the declared encoding matches the real one and characters don't come out garbled.

Fix it in your stack

HTML

As the first element inside <head>, before the title and any script.

<meta charset="utf-8">

Nginx

In the http or server block. It adds the charset to the Content-Type header of HTML responses.

charset utf-8;

Apache

In .htaccess or the virtual host.

AddDefaultCharset UTF-8

Node.js (Express)

On responses you write by hand; res.send() with a string already sets it.

res.setHeader('Content-Type', 'text/html; charset=utf-8');

Common mistakes

  • Placing the charset meta tag too late in <head>, after content that could already have been parsed with the wrong assumed encoding.
  • Declaring UTF-8 in the HTML but actually saving/serving the file in a different encoding (like Windows-1252), so the declaration and the real bytes disagree.
  • Relying on the HTTP Content-Type header to declare the charset while the HTML meta tag says something different, creating a conflicting signal.

How to verify

  1. 1 View page source and confirm a <meta charset="utf-8"> declaration is present in <head>. Place it as early as possible, within the first 1024 bytes, so browsers see it before parsing any non-ASCII content: this scan looks for the declaration, not for how far into the document it sits.
  2. 2 Check that the file is actually saved and served as UTF-8 (e.g. via the Content-Type response header) to confirm it matches the declaration. A charset parameter on that header counts as a declaration on its own, and this scan accepts it.
  3. 3 Look for garbled special characters (accents, curly quotes, em dashes) anywhere on the page as a quick visual check.

Questions

What does "The character encoding of the HTML document was not declared" mean?
Firefox logs this console message when a page names its encoding neither in a meta tag nor in the Content-Type header. The browser then has to guess, and a wrong guess turns accented letters, currency signs and emoji into garbled characters.
Should I use the meta tag or the HTTP header?
Either one fixes the warning. When both are present the Content-Type header wins over the meta tag, so if you send both, make them say the same encoding. UTF-8 is the right choice for new pages.
Why does the meta charset tag have to come first?
Browsers only look for it in the first 1024 bytes of the document. Placing it first in <head> keeps it inside that window even when the head grows.
What does EngineeringScore accept?
Any of three declarations: a <meta charset> tag, a <meta http-equiv="content-type"> tag carrying a charset, or a charset parameter on the Content-Type response header. It does not measure where in the document the tag sits.

Related checks

Ready to see where you stand?

Scan your site and get your Engineering Score with a prioritized roadmap in under a minute, no signup required.

Scan your site

Session expired

Your session has expired for security. Please log in again to continue.