# Bad start tag in “iframe” in “noscript” in “head”.

> Canonical HTML version: https://rocketvalidator.com/html-validation/bad-start-tag-in-iframe-in-noscript-in-head
> Attribution: Rocket Validator (https://rocketvalidator.com)
> License: CC BY 4.0 (https://creativecommons.org/licenses/by/4.0/)

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](https://html.spec.whatwg.org/multipage/scripting.html#the-noscript-element).

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>`.

```html
<!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.

```html
<!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>`.

```html
<!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.

```html
<!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>
```
