Capa
Seções
NOTÍCIAS

DOWNLOAD

ANÁLISES

COMPRAS

BOLETIM

WIRED NEWS

IDG NOW!

PC WORLD

AJUDA

COLUNISTAS


 digite + enter


CURSO BÁSICO DE HTML
Caíque Severo

Hyperlinks

Até agora produzimos apenas um documento bastante simples, que poderia ser composto com recursos muito mais sofisticados em qualquer processador de texto. Mas neste livro estamos falando de documentos de hipertexto, que podem fazer ligações com outros textos.

Os pontos que ligam esses hipertextos são chamados de hyperlinks, links ou âncoras de hipertexto. O tag que indica a região a ser tratada como um hyperlink é o par <A> e </A>. Dentro desse tag, na forma de atributo, é colocada a referência ao arquivo ligado. A referência indica a URL do documento. Quando o usuário clicar sobre o trecho realçado pela âncora de hipertexto, o arquivo ligado será requisitado ao servidor e mostrado na janela do navegador.

<P ALIGN=CENTER>

Uma ligação de hipertexto:</P>

<P ALIGN=CENTER>

<A HREF=https://www.seed.net.tw/~milkylin/
htmleasy.html>HTML Easy! Pro home page</A>

</P>

Exemplo 9: link simples


Neste exemplo, o texto HTML Easy! Pro home page aparece no navegador realçado de alguma forma, normalmente em uma cor diferente e sublinhado. O cursor do mouse se transforma em uma mãozinha quando colocado sobre o texto realçado. Ao clicar no link, o arquivo htmleasy.html, do diretório /~milkylin/ do servidor www.seed.net.tw será transmitido pela rede e mostrado na tela.

Colocando uma URL no atributo HREF do tag <A>, pode-se ligar uma página com qualquer outro documento
disponível na Internet. Pode-se fazer uma página com uma lista de páginas preferidas da rede com suas devidas ligações de hipertexto.

<b>Lista de recursos sobre HTML</b>

<UL>

<LI><A HREF = "https://www.willamette.edu/html-composition/
strict-html.html">Composing Good HTML</A>

<LI><A HREF = "https://www.w3.org/hypertext/WWW/Provider/Style/
Introduction.html">CERN's style guide for online hypertext</A>

<LI><A HREF = "https://www.ucc.ie/info/net/
htmldoc.html">How to Write HTML Files</A>

<LI><A HREF = "https://melmac.corp.harris.com/
about_html.html">Introduction to HTML</A>

<LI><A HREF = "https://kuhttp.cc.ukans.edu/
lynx_help/HTML_quick.html">The HTML Quick Reference Guide</A>

<LI><A HREF = "https://www.w3.org/hypertext/WWW/
MarkUp/MarkUp.html">The official HTML specification</A>

</UL>

Exemplo 10: uma lista de âncoras de hipertexto


Neste exemplo, as URLs estão entre aspas. Isso significa que o servidor vai considerar a diferença entre maiúsculas e minúsculas (o que se chama de sensitivo à caixa) na hora de localizar o arquivo. Se no exemplo acima o arquivo HTML_quick.html estiver gravado no servidor como html_quick.html, o documento não será localizado e o usuário receberá uma mensagem de erro.

Nem sempre é necessário colocar uma URL completa em uma âncora de hipertexto. É possível indicar apenas o nome do servidor.

<UL>

<LI><A HREF=www.apple.com>Apple Computer</A>

<LI><A HREF=www.thespot.com>The Spot</A>

</UL>

Neste exemplo, os servidores da Apple e do The Spot se encarregarão de indicar qual é a página que deve ser
carregada. Essa página principal é chamada normalmente de home page.

Quando a âncora apontar para uma página armazenada no mesmo servidor, não é necessário colocar o endereço
da máquina. Se o documento estiver no mesmo diretório, basta indicar o nome do arquivo.

<A HREF=exemplo1.htm>Exemplo 1</A>

O link acima chama o arquivo exemplo1.htm, que deve estar no mesmo diretório da página. Se o documento estiver em um subdiretório de onde está o arquivo que contém a âncora, é preciso indicá-lo.

<A HREF=exemplos/exemplo1.htm>Exemplo1</A>

Digamos que agora seja necessário traçar o caminho de volta, colocando uma âncora no arquivo exemplo1.htm para a página anterior.

<A HREF=../ancora.htm>Volta para exemplo de âncora</A>

A referência cruzada entre arquivos armazenados no mesmo computador mas em diretórios diferentes merece bastante atenção. Digamos que existam dois diretórios colocados no mesmo nível. Um chamado musica e outro, comida. Um arquivo chamado rock.htm, do diretório musica deve fazer uma referência ao arquivo feijoada.htm, do diretório comida. A âncora de hipertexto do documento rock.htm deve ficar assim:

<A HREF=../comida/feijoada.htm>Tudo sobre feijoada</A>

Também pode-se fazer uma referência a uma outra parte do mesmo documento. Isso é particularmente útil quando se está fazendo um índice de um texto. A âncora para um texto no mesmo documento fica assim:

<A HREF=#cap1>Capítulo 1</A>

Enquanto o alvo do link fica desta forma:

<A NAME=cap1>Capítulo 1</A>

Neste exemplo, quando o usuário clicar sobre o link <A HREF=#cap1>Capítulo 1</A>, ele será remetido ao ponto onde está a referência <A NAME=cap1>Capítulo 1</A>. A parte do texto que é referenciada (o alvo de um link) não fica realçada como os hyperlinks. Além de ser invisível, não é obrigatório que exista um link apontando para ela.

Pode-se colocar referências do tipo <A NAME> em um documento longo apenas para que outras pessoas produzindo páginas Web possam fazer ligações para determinadas partes do texto.

Para citar uma determinada parte de um outro texto, a referência é:

<A HREF=exemplo.htm#capitulo1>Capítulo 1 do Exemplo</A>

Sendo que exemplo.htm é o nome do arquivo referenciado e capítulo1 é a referência a uma parte daquele texto.

Cores dos hyperlinks

Da mesma forma que é possível definir cores diferentes para o fundo e o texto, pode-se mudar a cor dos links. As cores das âncoras de hipertexto variam de acordo com a sua condição: visitados, nunca visitados e ativos. Os navegadores sabem quais foram os hyperlinks já visitados pelo usuário em um determinado período de tempo. Por isso, a cor dos links já visitados deve ser diferente da cor das referências nunca visitadas. Além disso, o link pisca em uma cor ainda diferente dessas duas logo depois que é clicado pelo usuário. A cor dos links é definida no tag <BODY>.

<BODY LINK=RED ALINK=BLUE VLINK=GREEN>

Onde:

LINK determina a cor dos links não visitados

ALINK determina a cor que os links devem piscar quando clicados

VLINK determina a cor dos links já visitados

Neste exemplo, os links nunca visitados ficam em vermelho, os ativos (quando clicados) em azul, e os visitados em verde. Para não confundir os usuários, a cor dos links já visitados deve ser uma versão mais clara da cor das ligações ainda não visitadas.

» Imagens »

Introdução

Uma página Web simples

Melhorando a aparência

Hyperlinks

Imagens

Tabelas

Dicas

Mapas

Erros mais comuns

Exemplos de páginas Web

Tabela de acentos

Lista de tags

Cores
Copyright© 1996 - 2003 Terra Networks S.A. Todos os direitos reservados. All rights reserved.