Sobre este problema HTML
Este erro não se refere à sintaxe do seu HTML ser inválida — trata-se de uma referência quebrada. O Validador W3C segue URLs que encontra na sua marcação (ou um URL que você submete diretamente para validação) e verifica se o servidor consegue realmente entregar o recurso. Quando o servidor remoto retorna uma resposta HTTP 404 (Not Found), o validador sinaliza o problema porque o recurso referenciado está em falta ou inacessível.
Existem várias causas comuns para este erro:
- Erros de escrita no URL — Um nome de ficheiro, caminho ou nome de domínio mal escrito.
- Recursos movidos ou eliminados — O ficheiro existia num determinado momento mas foi desde então removido ou relocado.
-
Sensibilidade a maiúsculas/minúsculas — Muitos servidores web tratam
Image.pngeimage.pngcomo ficheiros diferentes. Uma discrepância nas maiúsculas pode produzir um 404. - Caminhos relativos incorretos — Um URL relativo que resolve de forma diferente do esperado com base na localização do documento.
- Recursos externos já não disponíveis — CDNs de terceiros ou ficheiros hospedados que foram retirados.
Isto importa porque referências quebradas degradam a experiência do utilizador. Folhas de estilo em falta podem deixar uma página sem estilo, scripts em falta podem quebrar funcionalidades, e imagens em falta exibem ícones de imagem quebrada. Os motores de busca também penalizam páginas com links quebrados excessivos, e leitores de ecrã podem anunciar conteúdo confuso ou inútil quando os recursos falham ao carregar.
Como corrigir
- Verifique o URL cuidadosamente. Copie o URL completo do seu HTML, cole-o num navegador, e veja se carrega. Se retornar uma página 404, o URL está errado.
- Verifique se o ficheiro existe no servidor. Se você controla o servidor, confirme que o ficheiro está no diretório esperado com o nome de ficheiro e extensão exatos.
- Corrija problemas de sensibilidade a maiúsculas/minúsculas. Certifique-se de que as maiúsculas no seu URL correspondem ao nome de ficheiro real no servidor.
-
Atualize recursos movidos. Se um ficheiro foi relocado, atualize o atributo
hrefousrcpara apontar para a nova localização. - Substitua recursos externos indisponíveis. Se um recurso de terceiros já não está disponível, encontre uma fonte alternativa, hospede uma cópia você mesmo, ou remova a referência.
Exemplos
Referência de imagem quebrada (desencadeia o erro)
<img src="https://example.com/images/photo.jpeg" alt="A scenic landscape">
Se photo.jpeg não existir nesse caminho (talvez o ficheiro real se chame photo.jpg), o validador reportará um erro 404.
Referência de imagem corrigida
<img src="https://example.com/images/photo.jpg" alt="A scenic landscape">Referência de folha de estilo quebrada (desencadeia o erro)
<link rel="stylesheet" href="/css/Styles.css">
Se o ficheiro no servidor se chamar realmente styles.css (minúsculas), um servidor sensível a maiúsculas/minúsculas retornará um 404.
Referência de folha de estilo corrigida
<link rel="stylesheet" href="/css/styles.css">Referência de script quebrada com caminho incorreto (desencadeia o erro)
<script src="/assets/js/old-directory/app.js"></script>Se o script foi movido para um diretório diferente, este caminho já não resolve.
Referência de script corrigida
<script src="/assets/js/app.js"></script>Usar um caminho relativo incorretamente (desencadeia o erro)
Se o seu ficheiro HTML estiver em /pages/about.html e você referenciar uma imagem assim:
<img src="images/logo.png" alt="Company logo">
O navegador procurará /pages/images/logo.png. Se a imagem realmente existir em /images/logo.png, isto falhará.
Corrigido com um caminho relativo à raiz
<img src="/images/logo.png" alt="Company logo">
A / inicial garante que o caminho é resolvido a partir da raiz do site, independentemente de onde o documento HTML está localizado.
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: