O que s√£o a href links?

Acompanhe as novidades e ultimas postagens.

A experiência do usuário (UX) tornou-se um sinal crítico de classificação do Google. Por isso, é mais importante do que nunca garantir que seu site entregue o que ele busca. Uma boa navegação contribui para a experiência do usuário, e isso tem muito a ver com os hiperlinks apresentados no seu site.

Os hiperlinks permitem que os usu√°rios ‚Äúviajem‚ÄĚ de uma p√°gina para outra. Voc√™ sabe que esses links est√£o ativos quando o cursor do mouse mudar de uma seta para o √≠cone de uma m√£o ao passar o mouse sobre o link. Voc√™ pode anexar links HTML a v√°rios elementos da p√°gina, incluindo texto e imagens.

Neste guia, vamos ver como os hiperlinks (conhecidos como ‚Äúlinks HTML‚ÄĚ ou ‚Äúlinks a href‚ÄĚ) funcionam, por que √© importante acompanhar os seus e como encontr√°-los e corrigi-los com a ferramenta Auditoria do site, da Semrush.

Os usuários pesquisam na internet com um propósito; eles estão em busca de respostas, produtos, orientação etc. Graças aos seus esforços de SEO, o Google pode exibir seu site para essas pessoas.

Depois de atrair um visitante, você precisa guiá-lo pelo seu site para que a experiência do usuário seja positiva. Nesse sentido, os links HTML são vitais para conduzir o usuário de uma página para outra do seu site.

Bons links HTML aumentam o tempo de sess√£o e o n√ļmero de p√°ginas visitadas por sess√£o ‚ÄĒ duas m√©tricas importantes para an√°lises.

Como é uma tag HTML <a>?

A tag √Ęncora (tamb√©m chamada de ‚Äúa href tag‚ÄĚ ou ‚Äúlink tag‚ÄĚ) inclui a tag de abertura, atributos da tag, o texto ou objeto e uma tag de fechamento. Parece confuso, mas √© simples. Veja:

<a href="url">texto ou objeto do link</a>.

O ‚Äúhref‚ÄĚ √© um atributo essencial do elemento <a>; ele determina o destino do link.

O link do atributo href (abrevia√ß√£o de ‚ÄúHypertext REFerence‚ÄĚ) indica a rela√ß√£o entre diferentes p√°ginas para os mecanismos de pesquisa.

O href √© um atributo da tag √Ęncora e cont√©m dois componentes:

  1. A URL (o link real);
  2. O texto ou objeto clic√°vel que os usu√°rios ver√£o na p√°gina (conhecido como ‚Äútexto √Ęncora‚ÄĚ).

Por exemplo:

<a href="https://www.semrush.com/">Acesse nosso site!</a>

Quando um usuário clica em um link HTML, a página linkada provavelmente será aberta na mesma janela ou guia do navegador. A menos que você especifique com um código como o link deve ser exibido, este é o padrão.

No entanto, se for um download ou voc√™ quiser que a p√°gina abra em uma janela ou guia diferente, poder√° usar atributos de destino como ‚Äú_blank‚ÄĚ.

Os valores de atributo de destino mais comuns s√£o:

  1. _self: a p√°gina/documento abre na mesma janela

    <a href="https://www.semrush.com/"target=_self">Acesse nosso site!</a> 

  2. _blank = abre o documento/p√°gina em uma nova janela

    <a href="https://www.semrush.com/"target=_blank">Acesse nosso site!</a> 

URLs relativas x absolutas

A estrutura da URL contribui na forma como o Google rastreia seu site. Geralmente, usaremos um dos dois tipos de estrutura: relativa e absoluta.

Os links relativos usam parte da URL e são reservados para links internos onde o link está no mesmo site e, portanto, faz parte do mesmo domínio raiz. Algo assim:

<a href="blog/hrefland-attribute-101/">atributo hreflang</a>. 

No entanto, um link absoluto usa o link completo do site, incluindo o nome do domínio:

<a href=" https://www.semrush.com/">Acesse o nosso site!</a>. 

Quando usar URLs relativas

Você pode usar URLs relativas para fazer um link para uma página no seu site. Use a slug da sua URL no link.

Algumas vantagens do uso de URLs relativas:

  • Transfer√™ncia r√°pida para um novo dom√≠nio (n√£o ser√° necess√°rio atualizar cada URL);
  • Tempo de carregamento de p√°gina mais r√°pidas (um fator de classifica√ß√£o do Google).

Quando usar URLs absolutas

Se você estiver enviando seu usuário para uma página externa (ou seja, fora do seu site), você deve usar uma URL absoluta.

Alguns benefícios de usar URLs absolutas:

  • O link aponta para a URL correta o tempo todo (o Google sempre saber√° para onde ir);
  • Os rastreadores do Google conseguem verificar essas URLs com mais facilidade (importante para indexa√ß√£o).

Voc√™ encontrar√° links HTML em uma p√°gina ao passar o mouse sobre o texto √Ęncora, imagens, bot√Ķes, entre outros, e o ponteiro se transformar no √≠cone de uma m√£o.

Por padr√£o, os links aparecem:

  • Sublinhados e azuis (se ainda n√£o acessou o link);
  • Sublinhados e roxos (voc√™ visitou o link);
  • Sublinhados e vermelhos (um link ativo).

Veja um exemplo de uma mat√©ria do jornal O Estado de S√£o Paulo que possui alguns hiperlinks ‚Äď as palavras em azul.

exemplo de texto com hiperlinks azuis

Se a cor dos links do seu site for muito semelhante à cor de fundo, você pode alterá-la para destacá-los.

Empresas que exploram as cores da sua marca provavelmente utilizam o c√≥digo hexadecimal de cor. Modifique sua tag HTML <a> (a tag √Ęncora) com o c√≥digo hexadecimal da seguinte forma:

<a href="https://www.semrush.com/" style="color:#SS000;">Link modificado aqui!</a> 

Se voc√™ n√£o tiver/souber um c√≥digo hexadecimal, existem cerca de 140 cores que voc√™ pode escolher por nome. Voc√™ pode adicionar cores em ingl√™s como ‚Äúblue (azul)‚ÄĚ ou ‚Äúred (vermelho)‚ÄĚ:

<a href="https://www.semrush.com/" style="color:red;">Link vermelho</a> 

Existem algumas maneiras de usar hiperlinks para criar uma experi√™ncia de navega√ß√£o otimizada no seu site. Pense nos links como conex√Ķes entre um recurso e outro, sejam p√°ginas, documentos, formul√°rios etc.

Os tipos mais comuns de hiperlinks s√£o:

1. Links de imagem: você pode fazer um hiperlink em uma imagem apontando para outro recurso. Por exemplo: colocar o link na imagem de um produto para a página deste produto.

Uma estrutura semelhante a esta:

<a href="/default.html">
<img src="semrush.jpg" alt="semrush logo" style="width:100px;height:100px;">
</a>

2. Links de e-mail e telefone: use esses links para que o usu√°rio possa entrar em contato com a sua empresa diretamente. No celular, esses tipos de links direcionam os usu√°rios para uma a√ß√£o direta: ligar para o seu n√ļmero, enviar um e-mail para voc√™. Para um endere√ßo de e-mail, adicione mailto: dentro do atributo href da seguinte forma:

<a¬†href="mailto:[email protected]">E-mail¬†da¬†Semrush</a>

Para um n√ļmero de telefone, voc√™ adiciona tel: dentro do seu atributo href:

<a href="tel:+61 1800 934 242">+61 1800 934 242</a>

3. Links de bot√£o: os bot√Ķes com hiperlinks s√£o um recurso de web design √ļteis para adicionar um CTA ao seu site. Os CTAs informam aos seus usu√°rios o que fazer: ‚Äúentre em contato conosco‚ÄĚ, ‚Äúbaixe nosso e-book‚ÄĚ, “leia mais‚ÄĚ etc. Para fazer isso, adicione elemento button em um link:

<a href='https://www.semrush.com/'><button>LInk para Semrush</button></a>

Atributos Hreflang

Os atributos Hreflang indicam para os mecanismos de pesquisa a rela√ß√£o entre as p√°ginas do seu site em diferentes idiomas. Se o seu site tiver p√ļblicos em diferentes pa√≠ses, voc√™ precisa adicionar atributos hreflang.

Alguns exemplos:

<link rel="alternate" hreflang="pt-br" href="http://www.exemplo.com/br/" />
<link rel="alternate" hreflang="pt-pt" href="http://www.exemplo.com/pt/" />

Quando os bots do Google tentarem escanear seu site, eles provavelmente interromper√£o o processo se encontrarem links quebrados. Como resultado, ser√° mais dif√≠cil e levar√° muito mais tempo para indexar seu site ‚Äď isso se o Google voltar a fazer isso.

A ferramenta Auditoria do site ajuda a identificar erros nos links do seu site. S√£o mais de 120 verifica√ß√Ķes t√©cnicas e on-page para detectar os tipos de erro mais comuns.

Você precisa criar um projeto para seu domínio para usar a ferramenta.

Uma vez que seu projeto foi criado, abra a ferramenta Auditoria do site no painel do projeto:

configurando projeto na ferramenta auditoria do site

Configure o escopo de rastreamento na ferramenta e o acesso ao site.

Quando a auditoria estiver conclu√≠da, clique na aba ‚ÄėProblemas‚Äô:

lista de erros na ferramenta auditoria do site

Filtre os problemas para mostrar erros de link. Se voc√™ n√£o tiver certeza do significado dos erros, a ferramenta inclui uma explica√ß√£o e sugest√Ķes de como resolver o problema (‚ÄúPor que e como resolver‚ÄĚ).

Considera√ß√Ķes finais

Um hiperlink bem feito facilita a navegação e o rastreamento do seu site. Não importa sua estrutura de links, é fundamental detectar e atualizar os links quebrados o mais rápido possível.

Use a ferramenta Auditoria do site para descobrir links quebrados ou com problemas e identificar possíveis erros técnicos.

Fonte

Compartilhar:

Deixe um coment√°rio

Categorias
Assinar por e-mail

Digite seu endere√ßo de e-mail para assinar e receber notifica√ß√Ķes de novas publica√ß√Ķes por e-mail.

Estatísticas do blog
  • 53.038 Views

20% DE

 DESCONTO

BLACK

NOVEMBER

Cupom válido até 01/12/2023 ou até durarem os estoques.
V√°lido somente para novos assinantes.

CUPOM:  

BLACK2023

Desconto v√°lido nos planos MENSAIS para Hospedagem Cloud, Revenda Plesk e Email Profissional. Desconto ser√° aplicado durante 12 meses no plano de assinatura mensal.