Verificação HTML: Tag de início inválida em "iframe" em "noscript" em "head".

Sobre este problema HTML

O elemento <noscript> comporta-se de forma diferente dependendo de onde aparece num documento. Quando colocado dentro do <head>, só pode conter elementos <link>, <style> e <meta> — estritamente conteúdo de metadados. Quando colocado dentro do <body>, pode conter qualquer conteúdo de fluxo, incluindo <p>, <div>, <iframe> e mais. Esta distinção está definida no WHATWG HTML Living Standard.

Quando o validador encontra um <iframe> dentro de um <noscript> no <head>, reporta “Tag de início inválida” porque o analisador está a operar sob o modelo de conteúdo do <head>, onde <iframe> simplesmente não é um elemento válido. O navegador pode tentar recuperação de erro fechando implicitamente o <head> e abrindo o <body>, mas isto pode levar a estruturas DOM inesperadas e problemas de layout.

Este padrão aparece comumente ao adicionar snippets de rastreamento ou analytics. Por exemplo, o Google Tag Manager fornece um fallback <noscript> que contém um <iframe>, e deve ser colocado imediatamente após a tag de abertura <body> — não no <head>. Colocá-lo no local errado quebra a validação e pode causar mau funcionamento do pixel de rastreamento.

Para corrigir o erro, identifique quaisquer blocos <noscript> no seu <head> que contenham elementos não-metadados (como <iframe>, <p>, <div>, <img>, etc.) e mova-os para o <body>. Se o bloco <noscript> só precisar de elementos de metadados como <meta> ou <style>, pode permanecer no <head>.

Exemplos

Inválido: `iframe` dentro de `noscript` em `head`

O <iframe> não é conteúdo de metadados válido, por isso não pode aparecer dentro de <noscript> no <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>

Corrigido: `noscript` com `iframe` movido para `body`

Mover o bloco <noscript> para o <body> resolve o erro, uma vez que conteúdo de fluxo é permitido lá.

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

Válido: `noscript` apenas com metadados em `head`

Um bloco <noscript> que contém apenas elementos de metadados é perfeitamente válido dentro do <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>

Corrigido: dividindo um `noscript` misto entre `head` e `body`

Se precisar tanto de metadados como de conteúdo de fluxo no seu fallback <noscript>, use dois blocos <noscript> separados — um no <head> para metadados, e um no <body> para conteúdo visível.

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