Post

Links em HTML

Links ou Hiperlinks em HTML são elementos clicáveis em uma página web que permitem a navegação entre diferentes recursos, como páginas, documentos ou seções específicas. Eles são geralmente representados por texto sublinhado ou imagens e são criados usando a tag <a> em HTML. O atributo href dentro da tag define o destino do hiperlink, que pode ser uma URL, uma âncora na mesma página ou um endereço de e-mail.

A estrutura básica de um link em HTML é:

1
<a href="#">Texto do Link</a>
  • <a>: É a tag que define o link. Ela pode envolver texto ou outros elementos, como imagens.

  • href="#": Este é o atributo que define o destino do link. A palavra href significa “Hypertext Reference”, e o valor dentro das aspas (o URL) especifica para onde o link vai levar o usuário quando clicado.

  • #: Um símbolo de jogo da velha (#) é usado como um “placeholder” (espaço reservado) quando você ainda não tem uma URL específica. Se você clicar em um link com href=”#”, ele não irá a lugar nenhum.
  • Texto do Link: O texto entre as tags <a> e </a> é o que o usuário verá na página. Ao clicar nesse texto, o link será ativado.

Você pode adicionar texto ou imagem à um link, estilizar para parecer um botão entre outros.

Os links internos direcionam o usuário para algum ponto dentro do nosso app ou website. Seja uma outra seção ou uma página diferente dentro da nossa estrutura.

Ex:.

1
<a href="sobre.html">Sobre Nós</a>

O exemplo acima redireciona o usuário para uma página chamada sobre.html dentro do nosso site.

Os Links para âncoras permitem que você crie links para seções específicas dentro da mesma página

1
<a href="#contato">Contato</a>

O trecho acima leva o usuário até uma seção identificada como contato dentro da mesma página que ele está navegando no nosso site. Geralmente a seção de contato fica no final da página, mas um link pode fazer a tela rolar até essa seção facilitando a experiência do usuário.

Os links externos direcionam o usuário para um site ou aplicativo externo.

1
<a href="https://www.google.com">Google</a>
Esta postagem está licenciada sob CC BY 4.0 pelo autor.