A Segunda Página

Inserir Imagens

Na primeira página, quase conseguimos cumprir metade da promessa, pelo menos a que se fazia no primeiro parágrafo do texto. Não custa nada cumpri-la, basta inserir mais uma marca de parágrafo:


<p>Nesta página, vou colocar um título, parágrafos e cabeçalhos. 

<p>A partir desta página, também vou fazer ligações para outras
páginas e colocar imagens.

Para continuar a cumprir a promessa, vamos inserir uma imagem. Acrescente o cabeçalho seguinte:


<h4>As minha ligações</h4>

A marca


<img src="frontpage.gif">

Introduz a imagem frontpage.gif:

Se não tem nenhum ficheiro de imagem, pode gravar este na pasta onde está a trabalhar.

É de esperar que o ficheiro com a imagem esteja na mesma página que o ficheiro HTML que o chama! De outra forma, a imagem não é encontrada e não aparece. Se não estiver nesta mesma pasta, deve especificar-se o caminho que vai do ficheiro HTML até à imagem, por exemplo:


<img src="../frontpage.gif">
para a ir buscar à pasta acima daquela onde está o ficheiro HTML, e

<img src="bonecos/frontpage.gif">

para a ir buscar à pasta "bonecos" que depende daquela onde está o ficheiro HTML. Claro que isto é verdadeiro para qualquer ficheiro que se ligue ao ficheiro que se está a ver, e não apenas para imagens.

É da melhor educação colocar notas para que quem navega sem imagens possa saber de que se trata a imagem. Basta incluir na marca da imagem o atributo "alt" e um texto descritivo, como aqui:

<img src="frontpage.gif" alt="Banner para aborrecer quem só sabe FrontPage">

e que deverá produzir um efeito enquanto a imagem não é carregada ou quando se passa com o rato sobre a imagem:

Banner para aborrecer quem só sabe FrontPage

Uma outra fonte possível de erro, além das já mencionadas antes, é esquecer-se das aspas, ou de uma delas, regra geral a de fecho.

Nota importante: Embora haja forma de modificar o tamanho aparente de uma imagem: Banner para aborrecer quem só sabe FrontPage, reduzida é muito melhor, quer em termos de qualidade quer em termos de velocidade de transmissão, usar um programa gráfico para a fazer desde o princípio com o tamanho adequado. Os tipos de imagem mais adequados à Internet são JPEG, PNG e GIF, por esta ordem. O tipo JPEG reproduz mal linhas e muito bem meios-tons e gradações.

Ligar a outro ficheiro

Vamos agora ligar este ficheiro a outro ficheiro de HTML, este, que poderá ir buscar e gravar na sua pasta de trabalho. Se lhe der uma espreitadela à última linha, ou neste a este mesmo parágrafo, fica com uma ideia de como se ligam documentos.

A forma de ligar deste seu documento aqui com o documento "megalito.htm" é com a marca:


<a href="megalito.htm">texto clicável</a>
Vamos então acrescentar o seguinte:

<p>Por vezes vou ver outros lugares, onde posso encontrar 
<a href="megalito.htm">megalitos</a>.
O ficheiro, claro, pode ser um site:

<p>Outras vezes, prefiro  ir ver 
<a href="http://www.disney.com">desenhos animados</a>.
ou um ficheiro específico dentro de um site:

<a href="http://www.meteo.pt/TROVOADAS/dados.htm">Trovoadas</a>
(note que maiúsculas e minúsculas são importantes!) ou uma imagem que, clicada, conduz a um documento:

<a href="megalito.htm">
<img src="anta.gif" alt="link para documento sobre megalitos"></a>
link para documento sobre megalitos

Pode remover a cercadura que indica um link desta forma:

<img src="anta.gif" border=0 
alt="link para documento sobre megalitos">
mas regra geral não é boa ideia, por desorientar o leitor.

Como é evidente, para aceder a documentos que não estão no seu computador, deve ter uma ligação activa à Internet. De igual forma, note que outras pessoas que estejam a ver um documento seu na Internet não têm acesso a ficheiros que estejam apenas no seu computador, como sejam imagens e tipos de letra.

Já cumprimos todas as nossas promessas, e sem muito custo. Neste momento, o seu ficheiro há de ser semelhante a este. Não será bonita. mas funciona, o que é mais importante.