Tell me more ×
Webmasters Stack Exchange is a question and answer site for pro webmasters. It's 100% free, no registration required.
up vote 3 down vote favorite

A website I'm currently working on is http://www.troubi.com . Please don't care to look at the source code.

If I validate the website through the w3cValidator a lot of errors occur all due to "invalid" meta tags. ( http://validator.w3.org/check?uri=http%3a%2f%2fwww%2etroubi%2ecom%2f )

If you look at the website's source you will see that everything in the meta region looks perfectly valid, and that's the curiousity.

Now comes the point, in Firebug it just looks like if all the included meta tags were just moved to the <body>! A screenshot from Firebug: enter image description here

For reference, this is the meta file that gets included: http://www.troubi.com/feature/meta.php

share|improve this question
Shouldn't all your tags be closed: <meta .. /> – pritaeas Aug 8 '12 at 11:15
1  
@pritaeas I don't understand your statement. Both > and /> are valid closings in HTML5. – Michael Aug 8 '12 at 12:15

3 Answers

up vote 3 down vote accepted

The problem is you have a hidden character between the <head> and first <meta> element. Make sure all your pages and PHP files have the correct UTF-8 encoding (you can convert them in Notepad++ or Sublime Text if you have those apps).

Edit: just tested and it's the character 'ZERO WIDTH NO-BREAK SPACE' (U+FEFF)

share|improve this answer
Cool, how did you identify this bad letter? :) – Michael Aug 8 '12 at 18:13
I only happened to notice it because I copied the page's source code into the direct input on W3's validator (to try different things) and when moving around with the arrow keys the cursor didn't move at one point. I've had the issue myself before so it stuck out to me when it happened. To find the exact character I copy-pasted in the character map (in Ubuntu I must add: Windows character map doesn't let you do that). – DisgruntledGoat Aug 8 '12 at 22:52
up vote 2 down vote

There is some weird going on in there. I just tried to validate without

<!doctype html>
<html itemscope itemtype="http://schema.org/Organization">
<head>
<meta charset="utf-8">

Then I added them one after one into the code again and it validates as it should. Start with <!doctype html> then <html> -> <head> -> <meta charset="utf-8">. It then should validate with errors about itemscope. Add itemscope itemtype="http://schema.org/Organization" to the <html> tag.

Does it validate after that?

About Firebug you can't really trust it 100%.

@pritaeas - html5 don't need closing tags on tags like <meta> <img> and so on.

share|improve this answer
up vote 1 down vote

Okay, I figured it out. The problem was in <meta charset=utf-8 >. The problem was that it looked like normal ASCII characters, but they weren't. They were some very cryptic Unicode symbols that looked alike. I'll add this to my hahaha, amazing bug list. Solved by completely recreating the included file.

Thanks for your help!

share|improve this answer

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.