HTML - Exemplos de links para outras páginas

Tipos de links

Todos sabemos que ao clicar num link em uma página somos encaminhados a um destino que pode ser :

  1. Na própria página
  2. Numa página diferente da atual
  3. Numa posição específica de uma página diferente da atual.

Digo a vocês que este é um recurso magnifico das páginas web...ir de um ponto a outro sem ter que procurar, pesquisar e não importa qual seja o destino, local ou do outro lado do mundo.

Note também que ao passar o mouse sobre um link ele muda de seta (default) para uma ''mãozinha' (pointer) informando ao usuário que é um link clicável.

Outro detalhe importante é que o cache prega peças na gente. Ao alterar um link numa página no servidor e o usuário recarregar esta página o browser não nota essa mudança e carregará a página do cache da máquina do usuário e não do servidor fazendo com que os links fiquem com o conteúdo antigo. Sendo assim muitas vezes é necessário limpar o cache para que as alterações dos seus links funcionem com as novas informações.

Links Locais nesta mesma página

Fiz um documento explicando em detalhes links para a página corrente : Links Para a Mesma Pagina

Quando o browser 'renderiza' um link ele faz 3 coisas :
1-Muda a cor dele para outra para diferenciar o link de um texto comum.
2-Muda o estilo da exibição das letras colocando o texto como sublinhado quando o mouse passa por cima dele ( mouse over ).
3-Muda o cursor de texto ( que parece um I ) para uma mãozinha ou indicador quando o mouse passa por cima dele.
Se você quer alterar essas 'características' procure pela CSS'Text Decoration' que permite manipular esses atributos.

A tag link é composta de dois itens : Um que aponta para o destino e outro que informa 'aqui é o destino'. Os 2 itens são 'casados', ou seja, precisam ter os mesmos dados para que um ache o outro.Sendo assim podemos ter tags link (anchor) que na realidade não é um link mas sim o destino de um link. Você pode averiguar isso indo no destino e passando o mouse no destino ( que é uma tag a ), mas verá que ela não se transforma naquela 'mãozinha' (pointer) que informaria que é um link ''clicável'.

Links para páginas externas mas no mesmo servidor

  1. Clique aqui para chamar a segunda página local-Pagina 2
  2. Clique aqui para chamar a terceira página local-Pagina 3

De um clique nas opções acima para acessar o texto correspondente

O link foi feito assim:
<a href="33-pagina02.html">Clique aqui para chamar a segunda página local-Pagina 2</a>

Este é o caso onde queremos simplesmente ao clicar no link abrir uma página bem no seu topo e a página se encontra no mesmo servidor onde a página atual está.

Links para páginas externas mas no mesmo servidor

  1. Acessar Google
Estas linhas estão aqui apenas para separar ou dar espaço nos links
Estas linhas estão aqui apenas para separar ou dar espaço nos links
Estas linhas estão aqui apenas para separar ou dar espaço nos links
Estas linhas estão aqui apenas para separar ou dar espaço nos links
Estas linhas estão aqui apenas para separar ou dar espaço nos links
Estas linhas estão aqui apenas para separar ou dar espaço nos links
Estas linhas estão aqui apenas para separar ou dar espaço nos links
Estas linhas estão aqui apenas para separar ou dar espaço nos links
Estas linhas estão aqui apenas para separar ou dar espaço nos links

Como foi elaborado o link acima:
<a href="http://www.google.com/">Acessar Google</a>

Note que ao colocar 'http://www.' o browser entende que o destino está na WWW (Internet), portanto o destino está em outro servidor WEB.

Link cruzado

É quando um link aponta para outro e o outro aponta para o um (vice-versa). Olhe o exemplo: link 1 :
<li><a name="voltatres" hREF="#tres"> Prática-Link Cruzado </a>
link 2 :
<a name="tres" href="#voltatres"><h3>3.prática</h3></a>

É o caso onde os links apontam um para o outro reciprocamente. Ao clicar em um vou para o outro e ao clicar no outro vou para o um.

Destino link local : name="um"

1.introdução

usar um editor html é fundamental para se ter produtividade. este é o primeiro link. Estas linhas estão aqui apenas para separar ou dar espaço nos links
Estas linhas estão aqui apenas para separar ou dar espaço nos links
Estas linhas estão aqui apenas para separar ou dar espaço nos links
Estas linhas estão aqui apenas para separar ou dar espaço nos links

Destino link local : name="dois"

2.conceitos básicos

este é o segundo link da página. Estas linhas estão aqui apenas para separar ou dar espaço nos links
Estas linhas estão aqui apenas para separar ou dar espaço nos links
Estas linhas estão aqui apenas para separar ou dar espaço nos links
Estas linhas estão aqui apenas para separar ou dar espaço nos links

Destino link local : name="tres"

3.prática

este link é de duplo sentido. o próprio título é usado para voltar ao
item de menu que o chamou. de um clique no título "3.prática e o menu inicial
é exibido novamente.
Estas linhas estão aqui apenas para separar ou dar espaço nos links
Estas linhas estão aqui apenas para separar ou dar espaço nos links
Estas linhas estão aqui apenas para separar ou dar espaço nos links
Estas linhas estão aqui apenas para separar ou dar espaço nos links

utiliza :
1-links locais nesta mesma página
2-link pagina externa : 033-pagina02.htm
3-link pagina externa : 033-pagina03.htm
4-link site externo : http://www.google.com