Validación HTML: Etiqueta de inicio incorrecta en "p" dentro de "noscript" en "head".

Acerca de este problema HTML

La especificación HTML define dos modelos de contenido distintos para el elemento <noscript> basados en su ubicación en el documento. Cuando <noscript> aparece dentro de <head>, hereda las restricciones del propio elemento <head> — solo se permite contenido de metadatos. Esto significa que elementos como <link>, <style> y <meta> están permitidos, pero el contenido de flujo como <p>, <div>, <h1>, o cualquier otro elemento de nivel de cuerpo no lo está. Cuando <noscript> aparece dentro de <body>, sigue las reglas más permisivas del contenido de flujo y puede contener párrafos, encabezados y otros elementos visibles.

Esta distinción existe porque la sección <head> está estrictamente reservada para metadatos que describen el documento — nunca se renderiza como contenido visible de la página. Colocar una etiqueta <p> dentro de un <noscript> en <head> viola este principio. Los navegadores pueden manejar esto de manera inconsistente: algunos pueden ignorar silenciosamente el contenido inválido, mientras que otros pueden forzar el cierre prematuro del <head> y empujar el contenido al <body>, causando problemas de diseño inesperados y potencialmente interrumpiendo otros elementos de metadatos que siguen.

Esto también es un problema de accesibilidad. Los lectores de pantalla y otras tecnologías de asistencia dependen de un documento bien estructurado donde el <head> contiene solo metadatos y todo el contenido visible reside en el <body>. El anidamiento inválido puede confundir estas herramientas y llevar a que el contenido sea omitido o malinterpretado.

Cómo solucionarlo

Tienes dos enfoques principales:

Mantener <noscript> en <head> pero usar solo elementos de metadatos. Esto es ideal cuando necesitas cargar una hoja de estilos alternativa o agregar una redirección <meta> para usuarios sin JavaScript.
Mover el bloque <noscript> al <body> si necesitas mostrar texto visible u otro contenido de flujo al usuario.

Ejemplos

❌ Incorrecto: Contenido de flujo dentro de `<noscript>` en `<head>`

<!DOCTYPE html>
<html lang="en">
  <head>
    <title>Example</title>
    <noscript>
      <p>JavaScript is disabled.</p>
    </noscript>
  </head>
  <body>
  </body>
</html>

El elemento <p> es contenido de flujo y no está permitido dentro de <noscript> cuando se encuentra dentro de <head>.

✅ Correcto: `<noscript>` solo con metadatos en `<head>`

Si tu objetivo es proporcionar una hoja de estilos alternativa o redirección cuando JavaScript no está disponible, usa solo elementos de metadatos:

<!DOCTYPE html>
<html lang="en">
  <head>
    <title>Example</title>
    <noscript>
      <link rel="stylesheet" href="no-js-fallback.css">
    </noscript>
  </head>
  <body>
  </body>
</html>

También puedes usar <style> o <meta> dentro del <noscript> en <head>:

<head>
  <title>Example</title>
  <noscript>
    <style>
      .js-only { display: none; }
      .no-js-message { display: block; }
    </style>
  </noscript>
</head>

✅ Correcto: Alternativa textual en `<noscript>` dentro de `<body>`

Cuando necesites mostrar un mensaje visible a usuarios que tienen JavaScript deshabilitado, coloca el bloque <noscript> en el <body>:

<!DOCTYPE html>
<html lang="en">
  <head>
    <title>Example</title>
  </head>
  <body>
    <noscript>
      <p>This site requires JavaScript to function properly. Please enable JavaScript in your browser settings.</p>
    </noscript>
  </body>
</html>

✅ Correcto: Combinando ambos enfoques

Para una estrategia de alternativa integral, puedes usar <noscript> en ambas ubicaciones — metadatos en <head> y contenido visible en <body>:

<!DOCTYPE html>
<html lang="en">
  <head>
    <title>Example</title>
    <noscript>
      <link rel="stylesheet" href="no-js-fallback.css">
    </noscript>
  </head>
  <body>
    <noscript>
      <p>JavaScript is disabled. Some features may not be available.</p>
    </noscript>
  </body>
</html>

Esto te da lo mejor de ambos mundos: ajustes de estilo a través de la alternativa en <head> y un mensaje dirigido al usuario a través de la alternativa en <body>.