This HTML document is purposely invalid demonstrating the incorrect use of <noscript><img></noscript>
in the <head></head>
section. Validate this Document and View Source for more information.
Have you seen this error while validating your HTML documents? If so, you’ll want to correct this as soon as possible, it may be breaking the <head></head>
section of your documents.
- Error: Bad start tag in
<img>
in<head>
. - Error: Stray end tag
<noscript>
. - Error: Stray end tag
<head>
. - Error: Start tag
<body>
seen but an element of the same type was already open. - Fatal Error: Cannot recover after last error. Any further errors will be ignored.
The above shows the first error which is the <img>
in the <head>
. At the close of the <img>
the validator has terminated the <head>
and marks the </noscript>
and </head>
as stray end tags. Any other code that sits below the <img>
error in the <head></head>
is marked as an error due to the early termination of the <head>
element.
Facebook Pixel Code Breaks <head></head>
If you are using the Facebook Pixel Code and have followed their instructions for inserting that code, you have this error in your <head></head>
section. If you have a class on your <body class="">
element, you’ll see the Fatal Error label. We haven’t figured out why, when the class attribute is added to the <body>
, that it invokes the Fatal Error Label from the validator.
How to Fix this Fatal Error
Move this part of the Facebook Pixel Code <noscript><img></noscript>
to the <body>
, you can place it right after the opening <body>
element. This also applies to any other invalid use of <noscript>
in the <head></head>
element e.g. <noscript><iframe></iframe></noscript>
.
What is the <noscript> Element?
The <noscript>
element represents nothing if scripting is enabled, and represents its children if scripting is disabled. It is used to present different markup to user agents that support scripting and those that don’t support scripting, by affecting how the document is parsed.
W3C Recommendation: Scripting > 4.12.2 The noscript element
When used inside the <head>
element the <noscript>
must contain ONLY <link>
, <style>
, and <meta>
elements. If the <noscript>
inside the <head>
contains anything other than those three elements, a validation error will occur and the <head>
may be closed prematurely and everything after the </noscript>
element may be ignored and moved to the <body>
during the building of the DOM.
John Mueller from Google states that it breaks everything within the <head></head>
...
Google Confirms Breaking <head> Section Can Make hreflang Unrecognizable
Barry Schwartz from Search Engine Roundtable: “Google’s John Mueller said in a Google Hangout on Google+ last Friday that sometimes when href lang doesn’t get picked up, it might be that the header section of your HTML is broken. When that happens, Google can’t recognize that there is href lang code in there and doesn’t show any href lang errors to you because it is not apparent to Google that the code exists there.”
John Mueller from Google: “So it might just be that we don’t recognize the hreflang
markup at all on those pages.
For example, what might happen is we can crawl and index those pages, but when we render those pages, something in the <head>
section of the pages is added early on, and that kind of breaks everything within the <head></head>
, which includes the hreflang
markup.
So that might theoretically be happening. And if we can’t find the hreflang
markup at all, we won’t flag it as an error, because we think there is nothing wrong with a page that doesn’t have hreflang
.
So that might be something worth double checking. So what you can do there is open the page in a browser and use Inspect Element to see what the rendered view of the page actually looks like. And then double check to make sure that within the head section there is actually nothing like non-meta tag type that’s actually listed there.”
John Mueller from Google: 2018-03-28 “A somewhat niche technical issue I've seen recently is that some kinds of scripts (including some from Google) inject non-head HTML tags into the top of the head on a page. For us, this implicitly closes the head, and brings all of the meta-tags into the body of the page. For hreflang
, that often results in those annotations being dropped completely. If you use hreflang
, I’d double-check the rendered source with the Rich Results testing tool (it’s the only one that currently shows the rendered source), and check that there are no iframe’s or div’s above the hreflang annotations.”
Reddit > r/TechSEO
References Regarding <noscript> in <head></head> Section
-
Google Webmaster Central: Ensure Scripts in the <head> Don’t Close it Prematurely
- OHGM: Breaking the <head> (Quietly)
- OHGM: Hreflang Tags Not Respected (How to Solve)
- Search Engine Land: Case Study: JavaScript Blocking Google’s View of hreflang
- Search VIU: JavaScript SEO Test: Does Google use pre- or post-DOM HTML for Interpreting hreflang?
-
Sitebulb: <head> contains a <noscript> tag, which includes an image
“This means that the URL in question contains a
<noscript>
tag in the<head>
, which includes an image reference. The<noscript>
tag defines an alternate content for users that have disabled scripts in their browser or have a browser that doesn’t support script.”“Whilst it can be used in both the
<head>
and the<body>
, when used inside the<head>
, it must contain only<link>
,<style>
, and<meta>
elements. As such, including an<img>
tag is invalid.”“This can be problematic for search engine crawlers that do not render JavaScript (i.e. most crawlers, most of the time), as the presence of the
<img>
tag breaks the<head>
, which may cause important tags (e.g. meta robots) to be missed.” - Search Engine Journal: 6 Reasons Why Google Says Valid HTML Matters
-
Analytics Mania: How to Fix Facebook Pixel Code <noscript> in GTM
“Facebook Pixel Code consists of two parts:
<script>
and<noscript>
. The latter is designed to track the visitors when JavaScript disabled in their browsers. If you paste the entire Facebook Pixel Code to Custom HTML tag in Google Tag Manager, the<noscript>
part just won’t work. If you still care about a tiny fraction of additional visitors and want to track them, you’ll need to create a separate tag for that. That’s where the Custom Image tag comes in handy.”
Quotes from Google Regarding Validation
Why does validation matter? There are different perspectives on validation – at Google there are different approaches and priorities too – but the Webmaster Team considers validation a baseline quality attribute.
Validation: Measuring and Tracking Code Quality
Consider validating your code. If your code passes validation, you’ve eliminated one potential issue in browser compatibility. With validated code, you won’t need to rely on each browsers’ error handling technique. There’s a greater chance that your code will function across different browsers, and it’s easier to debug potential problems.
Workin’ It on all Browsers
Use valid HTML. We also detect the price that you’re displaying based on the structure of your landing page. Using valid HTML helps ensure that we detect the correct price. Keep in mind that even with valid HTML, you must still use microdata to enable automatic item updates. Use the W3C validation service to check your HTML
Tips to Help Your Products Stay Approved
Write good, clean HTML. While your site may appear correctly in some browsers even if your HTML is not valid, there’s no guarantee that it will appear correctly in all browsers – or in all future browsers. The best way to make sure that your page looks the same in all browsers is to write your page using valid HTML and CSS, and then test it in as many browsers as possible. Clean, valid HTML is a good insurance policy, and using CSS separates presentation from content, and can help pages render and load faster.
Browser Compatibility
Following the General Guidelines below will help Google find, index, and rank your site. > Help visitors use your pages. > Use valid HTML.
Webmaster Guidelines
Why did my crawl rate drop? In general, your Google crawl rate should be relatively stable over the time span of a week or two; if you see a sudden drop, here are a few possible reasons:
Broken HTML or unsupported content on your pages: If Googlebot can’t parse the content of the page it won’t be able to crawl them.
Crawl Stats Report
Dear JavaScript frameworks and plugins, if you could stop putting invalid tags in the HTML head, like IMG and DIV, that would be great.
Gary Illyes from Google
HTML and Debugging
“HTML is not as complicated to understand as Rust. HTML is not compiled into a different form before the browser parses it and shows the result (it is interpreted, not compiled). And HTML’s element syntax is arguably a lot easier to understand than a "real programming language" like Rust, JavaScript, or Python. The way that browsers parse HTML is a lot more permissive than how programming languages are run, which is both a good and a bad thing.”
“HTML itself doesn’t suffer from syntax errors because browsers parse it permissively, meaning that the page still displays even if there are syntax errors. Browsers have built-in rules to state how to interpret incorrectly written markup, so you’ll get something running, even if it is not what you expected. This, of course, can still be a problem!”
Debugging HTML
HTML Validation – Why Validate?
“The core reason to run your HTML documents through a conformance checker is simple: To catch unintended mistakes – mistakes you might have otherwise missed – so that you can fix them. Beyond that, some document-conformance requirements (validity rules) in the HTML spec are there to help you and the users of your documents avoid certain kinds of potential problems.”
“There are some markup cases defined as errors because they are potential problems for accessibility, usability, interoperability, security, or maintainability – or because they can result in poor performance, or that might cause your scripts to fail in ways that are hard to troubleshoot.”
“Along with those, some markup cases are defined as errors because they can cause you to run into potential problems in HTML parsing and error-handling behavior – so that, say, you’d end up with some unintuitive, unexpected result in the DOM. Validating your documents alerts you to those potential problems.”
Need Help with HTML Validation?
I am very intimate with the HTML errors most websites generate and have validated over a million documents during my tenure (since 1995). I am available to assist Developers with validating their HTML documents at a minimal fee. Most validation routines can be handled in under an hour. Others may require multiple sessions. Either way, this is NOT rocket science and most Developers get IT after the first crash course consultation/validation routine at which time my services are no longer required. Contact me for more information.
The reason for any “Cannot recover after last error” message you get from the validator is that in the backend we run the HTML parser in truly streaming mode. That’s for performance reasons, among other reasons.
W3C Mailing Lists
Published: Mon, Jun 25, 2018
Updated: Fri, Mar 22, 2019