Sobre este problema HTML
Antes do HTML5, a forma de criar um alvo de ligação dentro de uma página era usar uma “âncora nomeada” — um elemento <a> com um atributo name. Isto permitia que outras ligações saltassem para esse local específico usando um identificador de fragmento (por exemplo, href="#section-5"). No HTML5, o atributo name em elementos <a> foi marcado como obsoleto. Em vez disso, o atributo id em qualquer elemento serve este propósito, tornando o envolvimento extra <a> desnecessário.
Isto é importante por várias razões:
- Conformidade com padrões: Usar atributos obsoletos significa que a sua marcação não está conforme à especificação HTML atual, o que pode causar erros de validação W3C.
-
Marcação mais limpa: Âncoras nomeadas adicionam um elemento extra que não serve nenhum propósito semântico. Usar
iddiretamente no elemento alvo é mais simples e mais significativo. -
Acessibilidade: Leitores de ecrã e tecnologias assistivas funcionam melhor com HTML semântico. Um
idnum cabeçalho ou<section>fornece uma estrutura de documento mais clara do que um elemento âncora aninhado. -
Comportamento do browser: Embora os browsers ainda suportem
namepara compatibilidade com versões anteriores, confiar em funcionalidades obsoletas é arriscado, pois versões futuras dos browsers podem alterar ou remover o suporte.
Para corrigir isto, remova o elemento <a name="..."> e coloque um atributo id diretamente no elemento contentor apropriado mais próximo, como um cabeçalho (<h2>, <h3>, etc.), um <section>, ou um <div>.
Exemplos
Incorreto: usar o atributo obsoleto name
<h2>
<a name="section-5">Section 5</a>
</h2>
O elemento <a> aqui existe apenas para criar um alvo de ligação, adicionando marcação desnecessária.
Correto: usar id no cabeçalho
<h2 id="section-5">Section 5</h2>
O atributo id no <h2> torna-o um alvo de ligação de fragmento válido sem qualquer elemento extra.
Ligar à secção
Ambas as abordagens permitem navegação através do mesmo URL de fragmento. A sintaxe da ligação não muda:
<a href="#section-5">Jump to Section 5</a>
Usar id noutros elementos contentores
O atributo id funciona em qualquer elemento HTML, por isso pode colocá-lo onde fizer mais sentido semanticamente:
<section id="contact-info">
<h2>Contact Information</h2>
<p>Email us at hello@example.com.</p>
</section>
Incorreto: múltiplas âncoras nomeadas num documento
<p>
<a name="intro">Welcome to our page.</a>
</p>
<p>
<a name="conclusion">Thanks for reading.</a>
</p>
Correto: substituir todas as âncoras nomeadas por atributos id
<p id="intro">Welcome to our page.</p>
<p id="conclusion">Thanks for reading.</p>
Lembre-se de que os valores id devem ser únicos dentro de um documento — nenhuns dois elementos podem partilhar o mesmo id. Se estiver a migrar de atributos name, verifique duplicados e certifique-se de que cada id é usado apenas uma vez.
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: