Um href é usado para incluir links externos e internos em um site. Os valores autorizados para o atributo HTML href estão claramente definidos. Isso inclui links para outros sites e encaminhamento para endereços de e-mail ou números de telefone.

O que é href e para que ele é usado?

o a href permite que os usuários criem links externos ou internos em um documento HTML. Quando usado corretamente, o atributo href integra-se perfeitamente a um site e aparece na forma de um hiperlink. Isso permite que os visitantes cliquem e visitem outra página em seu site. O termo href significa “hiper-referência” e especifica o destino do link desejado.

os atributos href oferecem inúmeras vantagens ao seu site. Eles proporcionam uma estrutura melhor, facilitam a navegação e fornecem informações adicionais. Os links também podem ser benéficos para SEO. De acordo com o Google, não importa se você usa um URL absoluto, que inclui o nome de domínio, ou um URL relativo sem um nome de domínio anterior.

iW5ir8IBtx8.jpg Para exibir esse vídeo precisamos usar cookies de terceiros. Você pode acessar e mudar suas configurações de cookies here.

Qual é a estrutura de um href?

A sintaxe do href é sempre a mesma em HTML e tem a seguinte aparência:

<a href="URL">anchor text</a>
html

Cada seção cumpre uma função importante:

  • O a introduz o link e indica um texto âncora. Essa tag HTML define o ponto inicial e final do hiperlink.
  • O atributo href é usado no texto âncora e define o alvo de salto do respectivo link. Além de um site interno ou externo, documentos PDF ou imagens também podem ser vinculados.
  • O URL do link é colocado entre aspas.
  • Isso é seguido pelo texto visível, que é clicável.
  • O texto âncora está completo.

Muitas vezes, os links são combinados com o atributo title para definir o título do link, uma descrição alternativa do destino do link. O título do link pode conter informações adicionais sobre o site vinculado. Ele fica visível no front-end quando você passa o mouse sobre o link sem clicar nele. A definição de títulos de links também é recomendada como uma medida de SEO. Em HTML, ele tem a seguinte aparência:

<a href="URL" title="Linktitle">anchor text</a>
html

Que valores o href pode ter?

Os valores para href em HTML são claramente definidos para garantir que os links funcionem corretamente. Os valores autorizados para href são os seguintes:

  • Um URL absoluto: Ao usar um href, o URL absoluto é o exemplo clássico. Ele redireciona diretamente para um site externo e contém o nome do domínio, o caminho e (se disponível) o nome do arquivo. Exemplo: <a href="www.examplesite.com/topic/index.html">Absolute link to the example page</a>
  • Um URL relativo: em um URL relativo, você especifica somente o caminho (o nome do arquivo é opcional). Por esse motivo, os URLs relativos são muito mais curtos do que os absolutos. Exemplo: <a href="/topic/index.html">Relative link to example page</a>
  • Link para um elemento: o link direto para um elemento é possível se ele tiver um ID definido. Isso permite vincular internamente diferentes seções do seu site. Exemplo: <a href="#section3">Direct link to an element</a>
  • Outros protocolos: o href também é adequado para outros protocolos, como o link direto para um endereço de e-mail. Isso funciona via mailto:. Outros protocolos podem incluir https://, ftp://, ou file:.
  • Scripts: scripts, como JavaScript, também são valores autorizados para um href. Exemplo: href="javascript:alert('Do you have any further questions?');">

Cinco exemplos de como usar um href

Você pode usar um href para diferentes finalidades. A seguir, mostraremos alguns dos casos de uso mais comuns de href em HTML.

Usar uma imagem como um link

Use o código a seguir para definir uma imagem como um link para uma subpágina:

<a href="https://www.examplesite.com"><img src=" /exampleimage.jpg" alt="image description"></a>
html

Link para um endereço de e-mail

Use mailto: para vincular um endereço de e-mail:

<a href="mailto:smith@examplesite.com">smith@examplesite.com</a>
html

O cliente de e-mail do visitante será aberto quando ele clicar no link e o endereço (smith@examplesite.com) será automaticamente inserido como destinatário. Como alternativa, ele também pode copiar e colar o endereço de e-mail no programa ou em outro local.

Link para um número de telefone

Você também pode vincular um número de telefone com um href. Isso é útil se alguém acessar seu site usando um smartphone e quiser entrar em contato com você diretamente. O link tem a seguinte aparência:

<a href="tel:+11231234567">0123 1234567</a>
html

É importante adicionar um sinal de mais e o código de discagem internacional após a referência telefônica. O zero no código de área não está incluído.

Link para JavaScript

Você também pode criar um link para o JavaScript usando href. O código correspondente é:

<a href="javascript:Example ( )">example</a>
html

Abrir um link em uma nova guia ou janela

Embora os links sejam úteis, tome cuidado para não enviar seus visitantes a um site externo diretamente do seu site. Com isso em mente, é útil que o link seja aberto em uma nova guia ou em uma nova janela. Assim, os usuários permanecerão no seu site e poderão consultar informações adicionais em outro momento. O código para abrir um link em uma nova guia ou janela é o seguinte:

<a href="http://www.example.org" target="_blank">http://www.example.org</a>
html
Dica

Crie seu site perfeito em apenas algumas etapas! O Website Builder da IONOS oferece ferramentas úteis e fáceis de gerenciar, permitindo que você crie facilmente uma presença on-line profissional. Se preferir deixar isso a cargo de nossos especialistas, eles podem assumir o design para você e criar um site de acordo com suas necessidades individuais. Escolha uma solução que atenda às suas necessidades.

Este artigo foi útil?
Ir para o menu principal