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

Acerca de este problema HTML

El elemento <noscript> proporciona contenido de fallback para usuarios cuyos navegadores no admiten scripting o tienen JavaScript deshabilitado. Cuando <noscript> aparece dentro de <head>, la especificación HTML restringe su contenido únicamente a elementos de metadatos — específicamente <link>, <style> y <meta>. Una etiqueta <img> es contenido de flujo, no contenido de metadatos, por lo que no está permitida dentro de <head> independientemente de si está envuelta en <noscript>.

Cuando <noscript> aparece dentro de <body>, sin embargo, puede contener cualquier contenido de flujo que normalmente sería válido en esa posición — incluyendo elementos <img>. Por eso la solución es simplemente reubicar el bloque <noscript> del <head> al <body>.

Este problema es extremadamente común con píxeles de seguimiento de terceros. Servicios como Facebook Pixel, LinkedIn Insight Tag, Google Tag Manager y herramientas similares a menudo te instruyen a pegar un bloque <noscript> que contiene un <img> de seguimiento de 1×1 directamente después de la etiqueta de apertura <head>. Aunque esto funciona en los navegadores (son tolerantes con HTML inválido), no se ajusta a la especificación HTML y activará un error de validación.

Más allá del cumplimiento de estándares, mantener tu HTML válido asegura un comportamiento predecible en todos los navegadores y tecnologías de asistencia. El marcado inválido puede llevar a una construcción DOM inesperada, que puede causar problemas sutiles con selectores CSS, consultas DOM de JavaScript o herramientas de accesibilidad.

Cómo solucionarlo

Localiza el bloque <noscript> que contiene el elemento <img> dentro de tu <head>.
Mueve ese bloque <noscript> completo a algún lugar dentro del <body> — típicamente justo después de la etiqueta de apertura <body>.
Mantén cualquier etiqueta <script> asociada en el <head> si lo deseas; solo el <noscript> con el <img> necesita moverse.

Ejemplos

❌ Inválido: `<img>` dentro de `<noscript>` en `<head>`

Este es el patrón comúnmente proporcionado por las instrucciones de píxeles de seguimiento de terceros:

<!DOCTYPE html>
<html lang="en">
  <head>
    <title>My Page</title>
    <script>
      /* tracking script */
    </script>
    <noscript>
      <img src="https://example.com/pixel?id=123" height="1" width="1" alt="">
    </noscript>
  </head>
  <body>
    <h1>Welcome</h1>
  </body>
</html>

El validador reporta “Bad start tag in img in noscript in head” porque <img> no es contenido de metadatos válido.

✅ Válido: `<noscript>` con `<img>` movido al `<body>`

Mueve el bloque <noscript> al <body> mientras dejas el <script> en el <head>:

<!DOCTYPE html>
<html lang="en">
  <head>
    <title>My Page</title>
    <script>
      /* tracking script */
    </script>
  </head>
  <body>
    <noscript>
      <img src="https://example.com/pixel?id=123" height="1" width="1" alt="">
    </noscript>
    <h1>Welcome</h1>
  </body>
</html>

El <img> ahora está dentro de <body> (vía <noscript>), donde se permite el contenido de flujo. El píxel de seguimiento seguirá funcionando correctamente para usuarios con JavaScript deshabilitado.

✅ Válido: `<noscript>` solo de metadatos en `<head>`

Si solo necesitas contenido de fallback de metadatos en el <head>, se permiten elementos como <meta>, <link> y <style>:

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

Esto es válido porque <style> es contenido de metadatos. Usa este patrón cuando necesites aplicar estilos de fallback para usuarios sin JavaScript, y reserva los bloques <noscript> con <img> u otro contenido de flujo para el <body>.