Validación HTML: Bad start tag in “iframe” in “noscript” in “head”.

Acerca de este problema HTML

The <noscript> element behaves differently depending on where it appears in a document. When placed inside the <head>, it can only contain <link>, <style>, and <meta> elements — strictly metadata content. When placed inside the <body>, it can contain any flow content, including <p>, <div>, <iframe>, and more. This distinction is defined in the WHATWG HTML Living Standard.

When the validator encounters an <iframe> inside a <noscript> in the <head>, it reports “Bad start tag” because the parser is operating under the <head> content model, where <iframe> is simply not a valid element. The browser may attempt error recovery by implicitly closing the <head> and opening the <body>, but this can lead to unexpected DOM structures and layout issues.

This pattern commonly appears when adding tracking or analytics snippets. For instance, Google Tag Manager provides a <noscript> fallback containing an <iframe>, and it’s meant to be placed immediately after the opening <body> tag — not in the <head>. Placing it in the wrong location breaks validation and may cause the tracking pixel to malfunction.

To fix the error, identify any <noscript> blocks in your <head> that contain non-metadata elements (like <iframe>, <p>, <div>, <img>, etc.) and move them into the <body>. If the <noscript> block only needs metadata elements like <meta> or <style>, it can remain in the <head>.

Examples

Invalid: `iframe` inside `noscript` in `head`

The <iframe> is not valid metadata content, so it cannot appear inside <noscript> within the <head>.

<!DOCTYPE html>
<html lang="en">
  <head>
    <title>My webpage</title>
    <noscript>
      <iframe src="https://example.com/tracking"></iframe>
    </noscript>
  </head>
  <body>
    <h1>Welcome</h1>
  </body>
</html>

Fixed: `noscript` with `iframe` moved to `body`

Moving the <noscript> block into the <body> resolves the error, since flow content is allowed there.

<!DOCTYPE html>
<html lang="en">
  <head>
    <title>My webpage</title>
  </head>
  <body>
    <noscript>
      <iframe src="https://example.com/tracking"></iframe>
    </noscript>
    <h1>Welcome</h1>
  </body>
</html>

Valid: metadata-only `noscript` in `head`

A <noscript> block that contains only metadata elements is perfectly valid inside the <head>.

<!DOCTYPE html>
<html lang="en">
  <head>
    <title>My webpage</title>
    <noscript>
      <meta http-equiv="refresh" content="0; url=https://example.com/nojs">
      <style>
        .js-only { display: none; }
      </style>
    </noscript>
  </head>
  <body>
    <h1>Welcome</h1>
  </body>
</html>

Fixed: splitting a mixed `noscript` between `head` and `body`

If you need both metadata and flow content in your <noscript> fallback, use two separate <noscript> blocks — one in the <head> for metadata, and one in the <body> for visible content.

<!DOCTYPE html>
<html lang="en">
  <head>
    <title>My webpage</title>
    <noscript>
      <style>
        .js-only { display: none; }
      </style>
    </noscript>
  </head>
  <body>
    <noscript>
      <p>Please enable JavaScript to view this website.</p>
      <iframe src="https://example.com/tracking"></iframe>
    </noscript>
    <h1>Welcome</h1>
  </body>
</html>