HTML validation error: Non-space characters found before DOCTYPE

html wordpress utf-8 w3c-validation byte-order-mark

17,930

I found the root of problem. The general rule is:

If any(absolutely any!) file that take part in construction of the code of final HTML-page(the one to be sended to client) has encoding with BOM - final HTML-page WILL BE UTF-8-BOM. That is: you whole site should NOT contain even 1 file with BOM.

In my case I have total 1.3K files that make up my site. Only 4 files was BOMed:

wp-config.php (in root of site)
jquery.query.js (in include folder)
cyr-to-lat.php (in plug-in folder)
footer.php (in theme root folder)

And I was forced to re-save every and all of these 4 files as "UFT-8 without BOM" to get rid of "Non-space characters" validation error. When I did this (re-save files) - error is gone.

17,930

Author by

Smarty

Microsoft Certified Trainer in MS SQL Server and .NET Framework/C#

Updated on June 27, 2022

Comments

Smarty almost 2 years
I have a blog(wordpress based). And try to validate by w3c validator one of my page. The first error is:
```
Line 1, Column 1: Non-space characters found without seeing a doctype first. Expected <!DOCTYPE html>.
<!DOCTYPE html>
```
Also, DebugBar (http://www.my-debugbar.com/wiki/IETester/HomePage) agree and show two invisible chars before <! when I open the same page from "HTML Check" tab inside this tool. BUT!!
1. This line of HTML-code come from file header.php in my wordpress theme.
2. I download this file from my hoster to my local HDD.
3. The first line of header.php is <!DOCTYPE html>
4. When I open header.php in RJ TextEd (just advanced text editor) it say: current encoding for header.php is UFT-8 without(!) BOM.
5. When I open header.php in HEX-viewer I see, that byte 0 and 1 is 3c,21 - so it is exactly <!.
So, all things considered, why & where I get these "odd symbols" from?
Adriano Monecchi over 9 years

Thank you. Beyond the validation error I was getting a huge blank space right above my WordPress site navigation menu which really made me struggle for days trying to identify what was causing the blank space issue...I then changed the encoding in Smultron.app for Mac and removed the UTF-8 BOM option, re-uploaded my theme's files and it was solved!!
Kerim Yagmurcu about 5 years

I love these types of validation errors :) Does anyone tested this solution with Notepad++? It will be very hard to save every new file with utf8-without-bom encoded...