Sobre este problema HTML
O padrão URL define um conjunto específico de carácteres que são permitidos aparecer literalmente na string de consulta de uma URL. Carácteres fora deste conjunto permitido — como |, [, ], {, }, ^, e espaços não codificados — devem ser codificados em percentagem. A codificação em percentagem substitui o carácter com um sinal % seguido do seu código ASCII hexadecimal de dois dígitos.
Isto é importante por várias razões. Os navegadores podem lidar com carácteres ilegais de forma inconsistente — alguns podem corrigi-los silenciosamente enquanto outros podem não fazê-lo, levando a ligações quebradas. Leitores de ecrã e tecnologias assistivas dependem de URLs bem formadas para anunciar adequadamente os destinos das ligações. Rastreadores de motores de busca também podem falhar ao seguir URLs com carácteres ilegais, o que pode prejudicar a descoberta. Usar URLs adequadamente codificadas garante que as suas ligações funcionam de forma fiável em todos os agentes de utilizador e estão em conformidade com as especificações HTML e URL.
Carácteres comuns que precisam de codificação
Aqui estão carácteres frequentemente encontrados que desencadeiam este erro de validação:
| Carácter | Codificado em Percentagem |
|---|---|
| (espaço) |
%20 (ou + em strings de consulta) |
| |
%7C |
[ |
%5B |
] |
%5D |
{ |
%7B |
} |
%7D |
^ |
%5E |
Note que carácteres como ?, =, &, e # têm significado especial em URLs e são permitidos nas suas respetivas posições. Por exemplo, ? inicia a string de consulta, & separa parâmetros, e = separa chaves dos valores. No entanto, se estes carácteres aparecem como parte do valor de um parâmetro (em vez de como delimitadores), também devem ser codificados em percentagem.
Como corrigir
- Identifique o carácter ilegal mencionado na mensagem de erro do validador.
- Substitua-o pelo seu equivalente codificado em percentagem.
-
Se estiver a gerar URLs dinamicamente com uma linguagem do lado do servidor, use funções de codificação incorporadas como
encodeURIComponent()em JavaScript,urlencode()em PHP, ouurllib.parse.quote()em Python.
Exemplos
❌ Incorreto: Carácter pipe não codificado na string de consulta
<a href="https://example.com/search?filter=red|blue">Search</a>
✅ Correto: Carácter pipe codificado em percentagem como %7C
<a href="https://example.com/search?filter=red%7Cblue">Search</a>❌ Incorreto: Parêntesis retos não codificados na string de consulta
<a href="https://example.com/api?items[0]=apple&items[1]=banana">View items</a>✅ Correto: Parêntesis retos codificados em percentagem
<a href="https://example.com/api?items%5B0%5D=apple&items%5B1%5D=banana">View items</a>❌ Incorreto: Espaço não codificado na string de consulta
<a href="https://example.com/search?q=hello world">Search</a>
✅ Correto: Espaço codificado como %20
<a href="https://example.com/search?q=hello%20world">Search</a>
Se estiver a construir URLs em JavaScript, use encodeURIComponent() em valores de parâmetros individuais em vez de codificar toda a URL. Esta função lida com todos os carácteres que precisam de codificação enquanto deixa a estrutura da URL intacta:
const query = "red|blue";
const url = `https://example.com/search?filter=${encodeURIComponent(query)}`;
// Resultado: "https://example.com/search?filter=red%7Cblue"
Evite usar encodeURI() para este propósito, pois não codifica carácteres como [, ], ou | que são ilegais em strings de consulta. Use sempre encodeURIComponent() para codificar nomes e valores de parâmetros de consulta individuais.
Encontre problemas como este automaticamente
O Rocket Validator analisa milhares de páginas em segundos, detetando problemas HTML em todo o seu site.