Hyperlink ou link

Hyperlinks ou simplesmente links são elos que ligam uma página a outra ou a si mesma.

O segredo de toda interatividade de uma página HTML ou XHTML está no link, pois ele nos "transporta" até outra página, pode servir de âncora, levando-nos a algum trecho do texto ou pode conter alguma ação programada por exemplo em JavaScript que proporciona maior dinamismo e animação à página.

O link é definido pela tag A. Esta tag possui uma referência quando for um link ou um nome quando for uma âncora.

Criação de Âncoras

Âncoras são marcações que criamos em nosso documento que são invisíveis ao leitor, mas são identificados pelo browser.

Para criarmos uma âncora, basta usar a tag A na linha que deseja marcar e dar um nome a esta tag para identificá-la. Vejamos o exemplo:

<A NAME="identificação">

Podemos criar quantas âncoras quisermos na mesma página HTML/XHTML.

Por exemplo, esta página possui uma âncora exatamente no título Hyperlink, dessa forma:

...
<A NAME="hyperlink"></A>
<H1>Hyperlinks</H1>
...

Portanto, nós somos capazes de criar um link que nos levará até esta marcação.

Ligação para âncoras

Para criarmos ligações para âncoras que estão na página usamos o atributo de referência HREF.

A âncora é sempre identificada pelo símbolo tralha ou sharp (#) mais o seu nome.

Um fato importante é que em um caminho URL a âncora sempre virá no final, mesmo em páginas dinâmicas como ASP e PHP que usam parâmetros. Entenda melhor lendo o artigo Caminho.

Como vimos, no exemplo acima foi criado uma âncora no início deste artigo chamado hyperlink, se quisermos ir até este ponto basta usarmos o atributo HREF da própria tag A.

...
<A HREF="#hyperlink">topo</A>
...

Clique no exemplo abaixo para ver como funciona.

topo

Ligação entre páginas

A função principal de um hyperlink ou link é a ligação entre páginas.

Para fazermos tal ligação, usamos o atributo HREF e nele indicamos o caminho da outra página (veja Caminhos).

Por exemplo, abaixo está um exemplo de um link que nos leva a página inicial do site TI Expert.

...
<A HREF="http://www.tiexpert.net">TI Expert</A>
...

Isso faria aparecer o texto TI Expert, no qual ao clicarmos, irá nos levar até a página inicial.

Direcionar link

Outro recurso muito utilizado em hyperlinks ou links é o direcionamento de link ou target (do inglês alvo). Este recurso é usado mais constantemente em páginas que utilizam Frames, pois desta forma determinamos em qual frame a página será carregada.

O atributo TARGET da tag A possui quatros opções principais.

• _top: faz com que a nova página seja carrega na Janela inteira. Isso faz com que o Frameset que tenha sido criado anteriormente seja apagado.
• _parent: parece muito com _top, mas ele sempre irá se referir ao frame pai em relação ao frame onde se encontra o link.
• _self: vem do inglês que significa próprio. E como o próprio nome já diz, faz com que a página seja carregada no mesmo frame ou janela que se encontra o link.
• _blank: o mais utilizado dos quatro. O _blank faz com que a página do link seja aberta em uma nova janela ou, dependendo do browser, em uma nova aba.

Veja o exemplo abaixo:

...
<A HREF="http://blogtiexpert.blogspot.com" TARGET="_blank">Blog TI Expert</A>
...

Este link irá abrir a página Blog TI Expert em uma nova janela em browsers mais antigos como o Internet Explorer 6, ou irá abrir em uma nova aba em browsers mais modernos como o Internet Explorer 7 ou Firefox.

Autor: Denys William Xavier
Este artigo está sob Licença Creative Commons.

Gostou? Indique nosso site!

Este artigo foi lido 966 vezes

Páginas Relacionadas