Sobre este problema HTML
Porque isto acontece
Em HTML, certos atributos são booleanos e podem aparecer sem um valor (por exemplo, disabled, required). O atributo href não é um deles — espera um URL válido, caminho ou identificador de fragmento como seu valor. Quando um validador encontra href sem valor ou com um valor vazio, levanta um aviso porque o atributo está a ser usado de uma forma que não está conforme à especificação.
Escrever <a href> produz um atributo sem valor. Escrever <a href=""> produz um atributo cujo valor é uma string vazia, que se resolve para o URL da página atual de acordo com as regras de resolução de URL relativo. Ambas as formas são problemáticas:
-
hrefsem um valor: A especificação HTML requer quehrefcontenha um URL válido. Um atributo sem valor é ambíguo e era ativamente removido pelo IE7, significando que o elemento perderia completamente o seu comportamento de link nesse navegador. -
href="": Embora tecnicamente analisado como um URL relativo que aponta para o documento atual, isto quase nunca é a intenção do desenvolvedor. Causa o recarregamento da página ou scroll para o topo quando clicado, o que é confuso para os utilizadores e prejudicial para a acessibilidade.
O impacto
-
Acessibilidade: Os leitores de ecrã dependem do atributo
hrefpara identificar um elemento<a>como um link interativo. Um valor em falta ou vazio cria confusão — o leitor de ecrã pode anunciá-lo como um link mas não fornecer destino, ou pode não tratá-lo como um link de todo. - Compatibilidade do navegador: Como a mensagem do validador nota, o IE7 removeria completamente o atributo, significando que o elemento perdia a sua semântica e estilo de link. Embora o IE7 já não esteja em uso comum, atributos sem valor ainda podem causar problemas pontuais em analisadores, crawlers e ferramentas automatizadas.
- Conformidade com padrões: HTML válido garante renderização e comportamento consistentes entre navegadores, tecnologias assistivas e crawlers de motores de busca.
Como corrigir
A correção depende da sua intenção:
-
Se o elemento deve fazer link para algum lugar, forneça um URL real:
href="https://example.com"ouhref="/about". -
Se o elemento é um link placeholder (por exemplo, durante desenvolvimento ou para ações dirigidas por JavaScript), use
href="#"e previna a navegação padrão com JavaScript. -
Se o elemento não precisa de ser um link de todo, use um
<button>para ações interativas ou um<span>para texto não-interativo. Esta é frequentemente a escolha mais semanticamente correta.
Exemplos
❌ Incorreto: href sem um valor
<a href>Clique aqui</a>
Isto desencadeia o aviso de validação. O atributo não tem valor, o que é inválido para href.
❌ Incorreto: href com uma string vazia
<a href="">Clique aqui</a>Isto resolve para o URL da página atual, provavelmente causando um recarregamento de página não intencional.
✅ Correto: Forneça um URL real
<a href="https://example.com">Visitar Exemplo</a>✅ Correto: Use um fragmento como placeholder
<a href="#" onclick="doSomething(); return false;">Executar ação</a>
O return false previne que a página faça scroll para o topo. Uma abordagem moderna melhor usa event.preventDefault():
<a href="#" id="action-link">Executar ação</a>
<script>
document.getElementById("action-link").addEventListener("click", function (e) {
e.preventDefault();
doSomething();
});
</script>
✅ Correto: Use um <button> para ações
Se o elemento desencadeia uma ação JavaScript em vez de navegar para algum lugar, um <button> é a escolha mais semanticamente apropriada:
<button type="button" onclick="doSomething();">Executar ação</button>
Os botões são nativamente focalizáveis, acessíveis por teclado, e comunicam claramente intenção interativa às tecnologias assistivas — não é necessário href.
✅ Correto: Use um <span> para texto não-interativo
Se o elemento é puramente visual e não deve ser interativo de todo:
<span class="label">Não é um link</span>Isto remove qualquer expectativa de interatividade tanto para o navegador como para o utilizador.
Encontre problemas como este automaticamente
O Rocket Validator analisa milhares de páginas em segundos, detetando problemas HTML em todo o seu site.