Você encontra links âncora na maioria das páginas da web, e eles ajudam os leitores (e os mecanismos de busca) a entender quais informações estão disponíveis na página e a navegar rapidamente até o tópico que desperta mais interesse.
Se você quer saber como usar links âncora para melhorar o desempenho do seu site, é importante entender o que eles fazem e como criá-los para poder destacar seu conteúdo nas buscas online.
O que é um link âncora?
Links âncora, também chamados de jump links, são textos clicáveis em uma página da web que direcionam para outro ponto da mesma página. Eles são considerados links internos, já que mantêm os leitores no site. Por outro lado, os links externos enviam os visitantes para um outro site.
Os links de âncora costumam aparecer no topo ou próximo dele em uma página da web. Eles funcionam como ferramentas de navegação que ajudam os leitores a saltar para uma seção específica do conteúdo. No entanto, também é possível usar esses links para criar botões flutuantes de "voltar ao topo".
Pense nos links âncora como uma espécie de sumário que organiza e estrutura as informações para uma experiência do usuário aprimorada.
Os links âncora são atalhos úteis para blogs, newsletters e outros conteúdos longos, facilitando a leitura das diversas seções apresentadas.
Você pode criar links âncora no código-fonte da página usando tags âncora. Uma tag âncora no código HTML é representada como <a> para marcar o elemento âncora, e vem acompanhada de um atributo href representado como href=, que define o destino do link.
Como os links de âncora impactam o SEO?
Quando usados corretamente, os links âncora podem ajudar na otimização para mecanismos de busca (SEO), fornecendo o contexto e a estrutura ao seu conteúdo. Um texto âncora rico em palavras-chave ensina os mecanismos de busca a categorizar seu conteúdo nas pesquisas, e os links internos esclarecem a hierarquia e a importância do texto. Além disso, os links âncora podem ajudar a reduzir a taxa de rejeição, enviando os visitantes para conteúdos relevantes e mantendo a permanência na sua página.
Greg Bernhardt, estrategista de SEO da Shopify, afirma: "O texto âncora de um link é um sinal contextual importante para o Google sobre o assunto da página vinculada. Pense nele como um endosso temático. Quanto mais forte e claro for o endosso, mais forte será o SEO. Se o seu texto âncora for 'Compare preços de revenda de bijuteria e semi-joias', você está dizendo ao Google sobre o que é aquela página. Um texto âncora vago ou pouco descritivo, como 'Clique aqui', transmite menos confiança ao usuário e não oferece ao Google nenhum sinal temático sobre a página."
Como criar links âncora
Muitos programas de sites e editores de texto têm ferramentas integradas que facilitam a inserção de links âncora no seu texto, mas você mesmo pode criá-los aprendendo a usar o código da tag âncora no HTML. Você pode aplicar esse processo em programas de codificação compatíveis com a Shopify, como Visual Studio Code, Sublime Text ou Atom.
1. Crie o elemento âncora
Na sua janela HTML, localize a seção ou elemento de destino para o qual você quer que o texto âncora aponte. É preciso criar um ID exclusivo para essa seção, para que ela seja identificável e vinculada facilmente. Por exemplo, você pode rotular a seção de destino como "parte1". Assim, o código id="parte1" na tag do elemento será o ponto para onde o link vai direcionar o leitor. Observe que as aspas retas são importantes para delimitar o ID âncora no seu código, e não pode haver espaços. O código a seguir é um exemplo simples:
<html>
<body>
<h1 id="parte1">Parte Um</h1>
<p>Este é o conteúdo da parte um.</p>
</body>
</html>
Importante: o elemento âncora é o ponto para onde você deseja direcionar o leitor. Na tag, a estrutura deve ter aspas retas, e não pode ter espaços entre os caracteres.
2. Crie o link âncora
Você deve usar o ID âncora criado na etapa anterior em um atributo href (chamado de referência de hipertexto) que vincula o texto âncora ao elemento de destino. Use o código a href="#parte1" para criar seu link âncora na página. Seu código ficará mais ou menos assim:
<html>
<body>
<a href="#parte1">Ir para a Parte Um</a>
<h1 id="parte1">Parte Um</h1>
<p>Este é o conteúdo da Parte 1.</p>
</body>
</html>
Importante: o link âncora é onde o leitor deve clicar para ser direcionado até o elemento âncora. Na tag, a estrutura deve ter aspas retas, e o símbolo # acompanhando o ID, não pode haver espaços entre os caracteres.
3. Teste seu link âncora
Clique em Salvar no seu arquivo HTML e execute o código em uma nova aba do navegador. Seu link âncora deve aparecer como texto com um hiperlink funcional que leva você diretamente à seção designada como elemento âncora.
Como otimizar links âncora para SEO
Usar links âncora de forma estratégica é uma ótima maneira de aumentar suas chances de ranquear melhor nas páginas de resultados dos mecanismos de busca (SERPs). Veja algumas boas práticas ao criar seus links âncora:
1. Use palavras-chave relevantes
Os mecanismos de busca analisam o texto do seu link âncora para entender o conteúdo da sua página e categorizar seu site. Usar palavras-chave nos links âncora indica os temas do seu conteúdo e pode ajudar seu site a ranquear melhor para aparecer como resultado nas buscas sobre esses temas.
2. Posicione os links em um lugar de destaque
Seus links âncora devem ser facilmente encontrados e claramente visíveis na página, para que eles sejam atalhos úteis. Com esse destaque, os leitores tendem a dar prioridade aos links âncora e os mecanismos de busca perceberão que esses elementos são importantes para a navegação e o conteúdo do seu site.
3. Estruture sua página de forma estratégica
Os links âncora ajudam os mecanismos de busca a entender melhor a estrutura geral do seu site, então você deve vincular seções específicas que sejam mais relevantes para suas palavras-chave principais. Use links âncora para direcionar os usuários às informações mais importantes da sua página e ao texto que, na sua avaliação, melhor responde às perguntas dos leitores.
4. Otimize para todas as plataformas
Ao verificar se seus links âncora estão funcionando, garanta que eles estejam acessíveis em todos os tipos de dispositivos (como celular, tablet e desktop) e em diversos navegadores (como Firefox ou Google Chrome) que seus leitores possam usar, incluindo navegadores móveis e leitores digitais. Links quebrados ou código incompatível com determinada plataforma podem fazer você perder leitores e prejudicar seu ranqueamento de SEO.
Perguntas frequentes sobre links âncora
Qual é a diferença entre links âncora e jump links?
Você pode usar os termos "link âncora" e "jump link" como sinônimos. Jump link é o termo em inglês geralmente considerado uma versão alternativa e menos formal do termo link âncora, que vem do inglês “anchor link”.
Os links âncora podem ser usados com imagens e vídeos?
Sim, você pode criar um link âncora usando uma imagem ou vídeo. Para isso, use as mesmas etapas do guia, inserindo o ID dentro da tag de parágrafo ou cabeçalho da imagem ou vídeo, para torná-lo seu link ou elemento âncora.
Como testar se meus links âncora estão funcionando?
Para testar seus links âncora, abra o código em uma aba do navegador e clique em cada âncora individualmente, para garantir que todas apontam para o local certo na página atual.
Os links âncora impactam os tempos de carregamento da página?
Não, os links âncora não têm impacto no tempo de carregamento de um site, pois não exigem nenhuma recuperação de dados adicional ou solicitação ao servidor.
Há considerações de acessibilidade ao usar links âncora?
Sim, a acessibilidade é uma consideração importante ao criar links âncora. Para oferecer a melhor experiência a todos os leitores, sempre use um texto âncora descritivo e claro, relevante para o conteúdo ao qual está vinculado. Também é importante testar seus links em todos os tipos de plataformas, incluindo diferentes navegadores, dispositivos móveis e leitores de tela.
