Sobre este problema HTML
Os URLs seguem regras de sintaxe rigorosas definidas pela RFC 3986. Apenas um conjunto específico de caracteres é permitido diretamente num segmento de caminho de URL — estes incluem letras, dígitos, hífens (-), pontos (.), sublinhados (_) e tis (~), juntamente com alguns sub-delimitadores como !, $, &, ', (, ), *, +, ,, ; e =. Qualquer carácter fora deste conjunto — incluindo espaços, parênteses angulares (< >), chaves ({ }), caracteres de barra vertical (|), barras inversas (\), acentos circunflexos (^) e acentos graves (`) — deve ser codificado por percentagem.
A codificação por percentagem substitui o carácter por um sinal % seguido do seu código ASCII hexadecimal de dois dígitos. Por exemplo:
| Carácter | Codificado por percentagem |
|---|---|
| (espaço) |
%20 |
{ |
%7B |
} |
%7D |
| | | %7C |
| < | %3C |
| > | %3E |
| ^ | %5E |
Este erro de validação é importante por várias razões. Primeiro, os navegadores podem lidar com caracteres ilegais de forma inconsistente — alguns podem codificá-los silenciosamente, enquanto outros podem quebrar o link ou navegar para um destino inesperado. Segundo, ferramentas que fazem parsing de HTML (leitores de ecrã, crawlers de motores de busca, verificadores de links) dependem de URLs bem formados e podem falhar ou comportar-se de forma imprevisível quando encontram caracteres ilegais. Terceiro, a conformidade com padrões garante que o seu HTML funciona de forma fiável em todos os ambientes.
Causas comuns deste erro incluem:
- Copiar e colar URLs de documentos ou emails que contêm espaços ou caracteres especiais não codificados.
-
Variáveis de template ou marcadores de posição deixados em valores
href(por exemplo,{{url}}). - Caminhos de ficheiros com espaços usados diretamente como URLs sem codificação.
- Caracteres não-ASCII em URLs que não foram devidamente codificados.
Exemplos
❌ Espaço no caminho do URL
<a href="/my page/about us.html">Sobre Nós</a>
✅ Espaços codificados por percentagem como %20
<a href="/my%20page/about%20us.html">Sobre Nós</a>❌ Chaves de um marcador de template deixadas na marcação
<a href="/products/{{product-id}}/details">Ver Detalhes</a>✅ Chaves substituídas por um valor real
<a href="/products/42/details">Ver Detalhes</a>❌ Carácter de barra vertical no caminho
<a href="/search/color|size">Filtrar Resultados</a>
✅ Carácter de barra vertical codificado por percentagem como %7C
<a href="/search/color%7Csize">Filtrar Resultados</a>❌ Parênteses angulares no URL
<a href="/page/<section>">Ir para Secção</a>✅ Parênteses angulares codificados por percentagem
<a href="/page/%3Csection%3E">Ir para Secção</a>Como corrigir
- Identifique o carácter ilegal na mensagem de erro do validador — geralmente indica exatamente qual carácter é problemático.
- Substitua-o pelo equivalente correto codificado por percentagem usando a tabela acima ou uma ferramenta de codificação de URL.
-
Se o URL contém sintaxe de template (como
{{...}}), certifique-se de que o seu motor de templates o processa antes do HTML ser servido ao navegador. A sintaxe de template em bruto nunca deve aparecer no HTML final renderizado. - Considere renomear ficheiros e diretórios para evitar completamente espaços e caracteres especiais — esta é a solução mais limpa a longo prazo.
Se está a gerar URLs programaticamente, use funções de codificação integradas como encodeURIComponent() do JavaScript ou rawurlencode() do PHP para garantir que todos os caracteres especiais são devidamente escapados antes de os inserir em atributos href.
Encontre problemas como este automaticamente
O Rocket Validator analisa milhares de páginas em segundos, detetando problemas HTML em todo o seu site.
Saiba mais: