Validación HTML: Valor incorrecto "X" para el atributo "href" en el elemento "a": Carácter ilegal en la consulta: no se permiten espacios.

Acerca de este problema HTML

Las URLs siguen reglas de sintaxis estrictas definidas por RFC 3986, que no permite caracteres de espacio literales en ninguna parte de un URI. Cuando el validador de W3C encuentra un espacio en el atributo href de un elemento <a> — particularmente dentro de la cadena de consulta (la parte después del ?) — lo marca como un carácter ilegal.

Aunque la mayoría de navegadores modernos corregirán silenciosamente URLs malformadas codificando espacios por ti, depender de este comportamiento es problemático por varias razones:

Cumplimiento de estándares: La especificación HTML requiere que los valores de href contengan URLs válidas. Un espacio hace que la URL sea sintácticamente inválida.
Interoperabilidad: No todos los agentes de usuario, rastreadores o clientes HTTP manejan URLs malformadas de la misma manera. Algunos pueden truncar la URL en el primer espacio o rechazarla por completo.
Accesibilidad: Los lectores de pantalla y tecnologías asistivas pueden tener dificultades para interpretar o anunciar enlaces con URLs inválidas.
Compartir enlaces y copiar-pegar: Si un usuario copia el enlace desde la fuente o si la URL se usa en una API o redirección, el espacio sin codificar puede causar problemas.

Para corregir este problema, reemplaza cada carácter de espacio literal en la URL con %20. Dentro de valores de cadenas de consulta, también puedes usar + como codificación de espacio (este es el formato application/x-www-form-urlencoded comúnmente usado en envíos de formularios). Si estás generando URLs dinámicamente, usa la función de codificación de URL de tu lenguaje de programación (por ejemplo, encodeURIComponent() en JavaScript, urlencode() en PHP, o urllib.parse.quote() en Python).

Ejemplos

Incorrecto — espacios en la cadena de consulta

<a href="https://example.com/search?query=hello world&lang=en">Search</a>

El espacio entre hello y world es un carácter ilegal en la URL.

Correcto — espacio codificado como `%20`

<a href="https://example.com/search?query=hello%20world&lang=en">Search</a>

Correcto — espacio codificado como `+` en la cadena de consulta

<a href="https://example.com/search?query=hello+world&amp;lang=en">Search</a>

Usar + para representar un espacio es válido dentro de cadenas de consulta y se ve comúnmente en URLs generadas por formularios HTML.

Incorrecto — espacios en la ruta y consulta

<a href="https://example.com/my folder/page?name=John Doe">Profile</a>

Correcto — todos los espacios codificados correctamente

<a href="https://example.com/my%20folder/page?name=John%20Doe">Profile</a>

Generando URLs seguras en JavaScript

Si estás construyendo URLs dinámicamente, usa encodeURIComponent() para valores de parámetros individuales:

<script>
  const query = "hello world";
  const url = "https://example.com/search?query=" + encodeURIComponent(query);
  // Result: "https://example.com/search?query=hello%20world"
</script>

Ten en cuenta que encodeURIComponent() codifica espacios como %20, lo cual es seguro para usar en cualquier parte de una URL. Evita usar encodeURI() para valores de consulta, ya que no codifica ciertos caracteres como & y = que pueden entrar en conflicto con la sintaxis de cadenas de consulta.