Validación HTML: Etiqueta de inicio "noscript" errante.

Acerca de este problema HTML

La terminología “stray start tag” significa que el analizador HTML encontró un elemento <noscript> en una ubicación donde no debería existir ningún elemento. Esto típicamente ocurre cuando la etiqueta aparece entre </head> y <body>, después de </body>, después de </html>, o cuando un error de marcado anterior ha causado que el analizador cierre el <body> prematuramente, dejando el <noscript> huérfano fuera de cualquier contenedor válido.

Según el estándar vivo HTML de WHATWG, <noscript> está permitido en dos contextos: dentro de <head> (donde solo puede contener elementos <link>, <style> y <meta>) y dentro de <body> como un elemento de contenido de flujo (donde puede contener cualquier contenido normalmente permitido en su elemento padre). Cuando se encuentra en cualquier otro lugar, el analizador lo trata como una etiqueta “errante” porque no tiene un padre válido al cual adjuntarse.

Esto importa porque los elementos errantes llevan a un comportamiento impredecible entre navegadores. Aunque la mayoría de navegadores intentan recuperarse del error, el DOM resultante puede no coincidir con tus intenciones. El contenido de respaldo dentro de un <noscript> errante puede ser descartado silenciosamente o renderizado incorrectamente, frustrando su propósito de proporcionar una experiencia accesible para usuarios sin JavaScript.

Una causa común es el marcado generado por herramientas de terceros como plataformas de analíticas o tag managers. Estos fragmentos a menudo te instruyen pegar una etiqueta <noscript> “inmediatamente después de la etiqueta de apertura <body>“, pero si se pega en la ubicación equivocada — o si un sistema de plantillas lo coloca fuera de <body> — ocurre el error.

Otra causa frecuente son elementos no cerrados anteriormente en el documento. Si una etiqueta arriba del <noscript> está mal formada, el analizador puede cerrar implícitamente el <body>, haciendo que los elementos subsecuentes sean errantes. En estos casos, corregir el error anterior también resuelve el problema del <noscript>.

Cómo solucionarlo

Asegúrate de que <noscript> esté dentro de <head> o <body> — nunca entre ellos, antes de <html>, o después de </html>.
Cuando esté dentro de <head>, incluye solo elementos <link>, <style> o <meta> dentro de él.
Cuando esté dentro de <body>, úsalo como cualquier otro elemento de nivel de bloque — puede contener párrafos, divs, imágenes, etc.
Verifica etiquetas no cerradas arriba del <noscript> que podrían causar que el analizador salga prematuramente de <body>.

Ejemplos

`<noscript>` errante después del cierre `</body>`

Este es el escenario más común, a menudo causado por pegar un fragmento de seguimiento en el lugar equivocado:

<!-- ❌ Incorrecto: noscript está fuera de 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>

Muévelo dentro de <body>:

<!-- ✅ Correcto: noscript está dentro de 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>` errante entre `</head>` y `<body>`

<!-- ❌ Incorrecto: noscript está entre head y 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>

Colócalo en la parte superior de <body> en su lugar:

<!-- ✅ Correcto: noscript está dentro de 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>`

Cuando se coloca en <head>, <noscript> solo puede contener elementos <link>, <style> o <meta> — no contenido de bloque como <p> o <iframe>:

<!-- ❌ Incorrecto: p no está permitido en noscript dentro de head -->

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

O usa solo elementos permitidos en <head>, o mueve el <noscript> a <body>:

<!-- ✅ Correcto: style está permitido en noscript dentro de head -->

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

`<noscript>` errante causado por un elemento no cerrado

A veces el problema real es una etiqueta no cerrada anterior. El analizador cierra implícitamente <body>, haciendo que el <noscript> sea errante:

<!-- ❌ Incorrecto: <div> no cerrado causa confusión en el analizador -->

<body>
  <div>
    <p>Some content</p>
<!-- falta </div> causa cascada de errores -->

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

Corrige el elemento no cerrado, y el error de <noscript> se resuelve:

<!-- ✅ Correcto: div está correctamente cerrado -->

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