Verificação HTML: Valor inválido "X" para o atributo "href" no elemento "a": Carácter ilegal na query: espaço não é permitido.

Sobre este problema HTML

URLs seguem regras de sintaxe rigorosas definidas pela RFC 3986, que não permite caracteres de espaço literal em qualquer lugar de um URI. Quando o validador W3C encontra um espaço no atributo href de um elemento <a> — particularmente dentro da query string (a parte depois do ?) — marca-o como um carácter ilegal.

Embora a maioria dos navegadores modernos corrijam silenciosamente URLs mal formados codificando espaços automaticamente, depender deste comportamento é problemático por várias razões:

Conformidade com padrões: A especificação HTML requer que os valores de href contenham URLs válidos. Um espaço torna o URL sintaticamente inválido.
Interoperabilidade: Nem todos os user agents, crawlers ou clientes HTTP lidam com URLs mal formados da mesma forma. Alguns podem truncar o URL no primeiro espaço ou rejeitá-lo completamente.
Acessibilidade: Leitores de ecrã e tecnologias assistivas podem ter dificuldade em interpretar ou anunciar links com URLs inválidos.
Partilha de links e cópia-colagem: Se um utilizador copiar o link da fonte ou se o URL for usado numa API ou redirecionamento, o espaço não codificado pode causar falhas.

Para corrigir este problema, substitua cada carácter de espaço literal no URL por %20. Dentro dos valores de query string, também pode usar + como codificação de espaço (este é o formato application/x-www-form-urlencoded comumente usado em submissões de formulários). Se estiver a gerar URLs dinamicamente, use a função de codificação de URL da sua linguagem de programação (por exemplo, encodeURIComponent() em JavaScript, urlencode() em PHP, ou urllib.parse.quote() em Python).

Exemplos

Incorreto — espaços na query string

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

O espaço entre hello e world é um carácter ilegal no URL.

Correto — espaço codificado como `%20`

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

Correto — espaço codificado como `+` na query string

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

Usar + para representar um espaço é válido dentro de query strings e é comumente visto em URLs gerados por formulários HTML.

Incorreto — espaços no caminho e query

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

Correto — todos os espaços devidamente codificados

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

Gerar URLs seguros em JavaScript

Se estiver a construir URLs dinamicamente, use encodeURIComponent() para valores individuais de parâmetros:

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

Note que encodeURIComponent() codifica espaços como %20, que é seguro para uso em qualquer parte de um URL. Evite usar encodeURI() para valores de query, pois não codifica certos caracteres como & e = que podem entrar em conflito com a sintaxe da query string.