Verificação HTML: Tag de abertura "noscript" perdido.

Sobre este problema HTML

A terminologia “tag de abertura perdido” significa que o analisador HTML encontrou um elemento <noscript> numa localização onde nenhum elemento deveria existir. Isto acontece tipicamente quando o tag aparece entre </head> e <body>, após </body>, após </html>, ou quando um erro de marcação anterior fez com que o analisador fechasse o <body> prematuramente, deixando o <noscript> órfão fora de qualquer contentor válido.

De acordo com o padrão WHATWG HTML living standard, <noscript> é permitido em dois contextos: dentro de <head> (onde pode apenas conter elementos <link>, <style> e <meta>) e dentro de <body> como um elemento de conteúdo de fluxo (onde pode conter qualquer conteúdo normalmente permitido no seu elemento pai). Quando encontrado em qualquer outro lugar, o analisador trata-o como um tag “perdido” porque não tem um elemento pai válido ao qual se ligar.

Isto importa porque elementos perdidos levam a comportamento imprevisível entre navegadores. Embora a maioria dos navegadores tente recuperação de erros, o DOM resultante pode não corresponder às suas intenções. O conteúdo alternativo dentro de um <noscript> perdido pode ser silenciosamente descartado ou renderizado incorretamente, derrotando o seu propósito de fornecer uma experiência acessível para utilizadores sem JavaScript.

Uma causa comum é marcação gerada por ferramentas de terceiros como plataformas de análise ou gestores de tags. Estes snippets frequentemente instruem você a colar um tag <noscript> “imediatamente após o tag de abertura <body>,” mas se colado na localização errada — ou se um sistema de templates o coloca fora de <body> — o erro ocorre.

Outra causa frequente são elementos não fechados mais cedo no documento. Se um tag acima do <noscript> está mal formado, o analisador pode implicitamente fechar o <body>, tornando elementos subsequentes perdidos. Nestes casos, corrigir o erro anterior resolve também o problema do <noscript>.

Como corrigir

Certifique-se que <noscript> está dentro de <head> ou <body> — nunca entre eles, antes de <html>, ou após </html>.
Quando dentro de <head>, inclua apenas elementos <link>, <style> ou <meta> dentro dele.
Quando dentro de <body>, use-o como qualquer outro elemento de nível de bloco — pode conter parágrafos, divs, imagens, etc.
Verifique tags não fechados acima do <noscript> que possam fazer com que o analisador saia prematuramente do <body>.

Exemplos

`<noscript>` perdido após fechar `</body>`

Este é o cenário mais comum, frequentemente causado por colar um snippet de rastreamento no local errado:

<!-- ❌ Incorreto: noscript está fora do body -->

<!DOCTYPE html>
<html lang="en">
  <head>
    <title>My Page</title>
  </head>
  <body>
    <h1>Hello</h1>
  </body>
  <noscript>
    <p>Please enable JavaScript.</p>
  </noscript>
</html>

Mova-o para dentro de <body>:

<!-- ✅ Correto: noscript está dentro do body -->

<!DOCTYPE html>
<html lang="en">
  <head>
    <title>My Page</title>
  </head>
  <body>
    <h1>Hello</h1>
    <noscript>
      <p>Please enable JavaScript.</p>
    </noscript>
  </body>
</html>

`<noscript>` perdido entre `</head>` e `<body>`

<!-- ❌ Incorreto: noscript está entre head e body -->

<!DOCTYPE html>
<html lang="en">
  <head>
    <title>My Page</title>
  </head>
  <noscript>
    <iframe src="https://example.com/ns.html"></iframe>
  </noscript>
  <body>
    <p>Content here.</p>
  </body>
</html>

Coloque-o no topo do <body> em vez disso:

<!-- ✅ Correto: noscript está dentro do body -->

<!DOCTYPE html>
<html lang="en">
  <head>
    <title>My Page</title>
  </head>
  <body>
    <noscript>
      <iframe src="https://example.com/ns.html" title="Tracking fallback"></iframe>
    </noscript>
    <p>Content here.</p>
  </body>
</html>

Usar `<noscript>` dentro de `<head>`

Quando colocado em <head>, <noscript> pode apenas conter elementos <link>, <style> ou <meta> — não conteúdo de bloco como <p> ou <iframe>:

<!-- ❌ Incorreto: p não é permitido em noscript dentro de head -->

<head>
  <title>My Page</title>
  <noscript>
    <p>Enable JavaScript!</p>
  </noscript>
</head>

Use apenas elementos permitidos em <head>, ou mova o <noscript> para <body>:

<!-- ✅ Correto: style é permitido em noscript dentro de head -->

<head>
  <title>My Page</title>
  <noscript>
    <style>
      .js-only { display: none; }
      .nojs-message { display: block; }
    </style>
  </noscript>
</head>

`<noscript>` perdido causado por um elemento não fechado

Às vezes o problema real é um tag não fechado anterior. O analisador implicitamente fecha <body>, tornando o <noscript> perdido:

<!-- ❌ Incorreto: <div> não fechado causa confusão no analisador -->

<body>
  <div>
    <p>Some content</p>
<!-- </div> em falta causa cascata de erros -->

  <noscript>
    <p>JavaScript is required.</p>
  </noscript>
</body>

Corrija o elemento não fechado, e o erro do <noscript> resolve-se:

<!-- ✅ Correto: div está corretamente fechado -->

<body>
  <div>
    <p>Some content</p>
  </div>
  <noscript>
    <p>JavaScript is required.</p>
  </noscript>
</body>