quarta-feira, 14 de dezembro de 2011

Curso de HTML - Criação de links internos e externos

Usar links em seu blog é vital e ajuda muito em seu dia a dia e a vida dos leitores também. Os links podem ser usados internamente ou externamente; levando a trechos dentre de uma postagem ou a páginas na web fora de seu blog.

Os links auxiliam muito na navegação do leitor e enriquece seus textos com referências externas ou mesmo internas no próprio texto em leitura no momento.

Links

O principal poder do HTML, está na capacidade de ligar partes de textos e imagens a outros documentos. A interligação entre documentos é feito utilizando a tag <a>, e não se restringe apenas a outras páginas. Os links podem apontar para qualquer recurso disponível na WEB, podendo ser uma página em HTML, uma imagem, um arquivo de som, um filme, etc.

5.1 ÂNCORAS


As âncoras são links que utilizamos quando queremos buscar o conteúdo na mesma página. São muito utilizadas em páginas que têm o conteúdo extenso, onde definimos seções na páginas, sendo que cada seção terá um nome que servirá de referência para o link.

Para criarmos uma âncora selecionamos um local da página para inserí-la.

<a name=”nomedaseção”> </a>

Onde:

- <a (há um espaço depois do a): é a abertura da tag de link;
- name:”nome da seção”: é o nome dado a seção.
- Não é necessário inserir nada entre as tags <a> e </a>;
- </a>: utilizada para encerrar a tag.

Com essa tag você inserirá uma imagem ou texto que indicará ao usuário que ao clicar neste tipo de link, este irá guiá-lo até o local onde foi inserida a âncora.

<a href=”#Nome da Seção”> Texto ou imagem </a>

Onde:

- <a = é a abertura da tag de link;
- href=”#Nome da Seção” = indica o nome da seção que será acessada.
- Texto ou imagem = indica o texto ou a imagem que receberá o link.
- </a> = encerra a TAG.
- O símbolo # indica ao navegador que o link se encontra na mesma página. É indispensável o uso de #.

5.2 INTERLIGANDO DOCUMENTOS EM OUTROS DIRETÓRIOS

Para interligar documentos em outros diretórios é necessário apenas indicar o caminho completo da localização do mesmo.

Quando falamos de WEB, a forma de localizar arquivos é diferente do Windows e DOS, vejamos por que:

- A barra utilizada para separar diretórios é a barra convencional ( / );
- O diretório atual será sempre o ponto de partida para buscarmos arquivos em outro diretório;
- Caso o arquivo esteja localizado em outros níveis de diretórios, utilizamos “.. / ”.

Exemplo:

Ao clicar no link Pagina 1, na página index.html, queremos quer abra a página pagina1.htm, localizada dentro do diretorio pagina1.

<a href=”pagina1/pagina1.html”>Página 1</a>


Vamos imaginar a seguinte situação:

Estamos na página materias.html, localizada no diretório matérias, dentro do diretório pagina1, e ao clicarmos no link “Página Inicial” queremos que nos posicione na index.html que esta fora do diretório pagina1. Como fazemos?



Na página materias.html devemos escrever o código mencionado abaixo:

<html>
<head>
<title>LINK PARA OUTRO DIRETÓRIO</title>
</head>
<body>
<div align="center">
<h1 align="center">Página Matérias</h1>
<p> Modelo de interligação de documentos localizados em nível diferente.<br>
<a href="../../index.html">Página Inicial </a>
</body>
</html>

Observe a linha:

<a href=”../../index.html”>Página Inicial </a>

Sendo que:

- <a = é a tag de abertura de link;
- href = especifica a localização de qualquer tipo de recurso da internet, incluindo arquivos HTML.
- “../../index.html” = indica que o arquivo index.html está 2 NÍVEIS ( ../../ ) inferior a página atual, ou seja, para exibir o arquivo index.html, teremos que retornar dois diretórios, sendo estes os diretórios materias/pagina1. (Observe a figura 5.2)
- Página Inicial = é o texto que será utilizado como link, para que ao clicarmos este nos direcione para o local indicado no atributo href.

- O visitante da página apenas visualizará a palavra indicada entre as tags <a> </a>, que no caso citado acima é a palavra Página Inicial.

5.3 INTERLINGANDO URLs


Para criarmos um link para qualquer endereço localizado na internet, utilizamos uma URL. URL é a abreviação de Uniform Resource Locator, que tem a função de especificar a localização de páginas ou arquivos em servidores da WEB.

A URL é composta de duas partes:

1) O protocolo Internet do documento;
2) O endereço do servidor da página.

<a href: “protocolo://servidor.arquivo”> texto ou imagem </a>

Onde:
• O protocolo: é o tipo de servidor que está sendo acessado;
Os mais utilizado são:
- HTTP: = Hiper Text Transfer Protocol, é um servidor da www.
- FTP: = File Transfer Protocol, é um serviço para a troca de arquivos, programas entre o servidor e o computador remoto.
- Servidor = Entenda como servidor o computador onde a página está localizada.
- Arquivo = o arquivo que deseja ser visualizado, podendo ser um diretório e o nome do arquivo.


5.4 LINKS PARA E-MAILS

É possível colocar links para e-mail em páginas HTML. Ao clicar sobre o link do e-mail, abrirá o programa de envio de e-mail, podendo ser este o OULTLOOK EXPRESS ou outro que estiver configurado no computador.

<a href=”mailto:endereço”>Texto ou Imagem </a>

Onde:

- mailto = informa ao navegador que o link é para e-mails;
- endereço = deverá ser informado o e-mail que será direcionada as mensagens.

Caso queira entrar em contato por algum motivo, acesse a página de contato através deste link:Contato.

Envie dúvidas, reclamações, sugestões, elogios e assuntos mais complexos relacionados ao artigo e em 24 horas estarei lhe respondendo prontamente.

0 comentários:

Postar um comentário

Se você quer fazer algum comentário sobre este artigo, fique a vontade em expressar sua opinião; desde que:

1. Tenha a ver com o assunto;
2. Não haja ofensas pessoais;
3. Não contenha links e spams;
4. Só comente de boa vontade.