3.5 Inserindo imagens
Para inserir uma imagem numa página, coloque o cursor no sítio pretendido e pressione o botão de imagens da barra de ferramentas: 
.
Abre-se a janela de propriedades da imagem:
Existem 2 opções:
-
Inserir uma imagem guardada no servidor de outro site
Neste caso basta apenas colocar o URL da imagem (na maioria dos browsers basta fazer clique com o botão direito do rato sobre uma imagem de uma página web e seleccionar propriedades, para obter o seu URL).
Quando os visitantes visitarem a sua página, a magem virá do servidor original.
Esta situação não é recomendada porque:
- Se a imagem for apagada ou alterada na página original, também o será na sua página.
- Uma vez que as imagens podem ser ficheiros relativamente grandes, estará a roubar recursos do servidor que aloja a imagem original e poupando recursos do seu servidor.
- Alguns servidores restringem o acesso às magens a partir das uas próprias páginas. Neste caso não conseguirá colocar a imagem numa página sua a não ser que a copie para o seu próprio servidor.
Apesar de tudo, em alguns casos, pode ser útil usar as imagens de um site noutro site, principalmente se ambos os sites forem controlados por si. - Se a imagem for apagada ou alterada na página original, também o será na sua página.
-
Inserir uma imagem guardad no seu servidor
Clique no botão Navegar no Servidor da janela de propriedades da imagem.
Abre-se uma nova janela com a lista de pastas e ficheiros existentes no interior da pasta de imagens do seu servidor:
Basta fazer clique sobre o nome de um ficheiro para o seleccionar, ou fazer clique sobre uma pasta para procurar dentro dessa pasta.Se necessitar de enviar uma imagem para o seu servidor clique em Procurar... e seleccione uma imagem guardada no seu computador. Prima Upload e aguarde um pouco enquanto a imagem é enviada. Depois de completo o envio, aparecerá o nome do novo ficheiro na lista.
Poderá também criar novas pastas no servidor usando o botão Create New Folder.
Após colocar uma nova imagem no servidor, basta fazer clique sobre o nome do novo ficheiro na lista: a janela de navegação no servidor fecha-se e o campo URL na janela de propriedades da imagem será automaticamente preenchido.
Prima OK e a sua imagem será inserida na página em edição.
Nota: O a janela de navegação no servidor permite-lhe apenas o envio de ficheiros dos seguintes formatos:
Tipo de Ficheiro
Extensão Ficheiro JPG - Joint Photographic Experts Group .jpg or .jpeg
GIF - Graphic Interchange Format .gif
PNG - Portable Network Graphics .png
BMP - Microsoft Windows Bitmap .bmp
Apesar de ficheiros BMP serem suportados, não recomendamos a sua utilização porque:
-
Normalmente apresentam tamanhos mais elevados que os restantes formatos
-
É um formato propriedade da Microsoft, pelo que não é suportado por alguns browsers
A página Informações da Imagem na janela de propriedades possui mais algumas opções que lhe podem ser úteis:
-
Texto Alternativo
Este é o texto que é apresentado se o browser não conseguir mostrar a imagem (resultado de um URL incorrecto ou algum problema do servidor por exemplo). Este texto será também apresentado em alguns browsers se colocar o ponteiro do rato parado alguns segundos sobre a imagem.
-
Largura e Altura
Permite-lhe escolher o tamanho com que a imagem será apresentada na página. Normalmente é preferível alterar o tamanho da imagem com um programa de edição próprio no seu computador antes de a enviar para o servidor web.
Evite usar imagens enormes quando apenas pretende mostrar uma miniatura porque isso vai tornar a sua página muito mais lenta a carregar. Se necessitar de mostrar uma minitura, crie-a com um programa de edição próprio e envie-a ao servidor.
O cadeado
permitelhe manter a proporção entre largura e altura para evitar distorção da imagem.
Pode usar o botao
voltar a mostrar a sua imagem na dimensão real.
-
Limite
Este campo permite-lhe escolher a largura em pixeis do rebordo a apresentar à volta da imagem. Se deixar este campo em branco, nenhum rebordo será mostrado.
Se inserir um link na imagem e não pretender que seja apresentado um rebordo, deverá colocar '0' neste campo. Veja a secção 3.4 para saber como inserir links as suas imagens.
-
Esp. Horiz. e Esp. Vert.
Permite-lhe escolher o espaçamento entre a imagem e o texto adjacente, quer na vertical quer na horizontal.
-
Alinahmento
Especifica o alinhamento da imagem em relação ao texto. Teste as várias hipóteses e veja de imediato o efeito na área de pré-visualização da janela de propriedades da imagem.
Exemplo
Vamos agora demostrar a utilização de imagens na sua página usando o modelo criado na secção 3.4:
|
Vamos começar por introduzir um logotipo na página.
Vamos colocar uma imagem na célula do topo esquerdo da tabela principal, por isso será necessário usar uma imagem de tamanho menor ou igual ao tamanho especificado para essa célula na secção 3.2.
Primeiro, apague o texto 'Logo do Site Aqui' deixando o cursor nessa posição. Prima o botão de imagem :
Na janela de propriedades da imagem, prima o botão Navegar no Servidor.
Clique no botão Procurar...
Procure a imagem pretendida no seu computador e prima o botão Abrir.
Voltando à janela anterior, prima o botão Upload:
Aguarde alguns segundos enquanto a imagem é enviada para o servidor.
Quando terminar o envio, o nome do novo ficheiro irá aparecer na lista.
Clique sobre o nome do novo ficheiro. A janela fecha-se e o campo URL da janela de propriedades da imagem será automaticamente preenchido:
Prima o botão OK e o seu logotipo será inserido na página em edição:
|
A seguir vamos colocar imagens com links no espaço reservado para os anúncios.
Apague os textos 'Anúncio 1 Aqui' e 'Anúncio 2 Aqui' e introduza as imagens pretendidas. Poderá até inserir imagens animadas do tipo .gif:
Nome do Site Aqui Barra de Links
Conteúdo Texto Conteúdo Texto Conteúdo Texto Conteúdo Texto Conteúdo Texto Conteúdo Texto Conteúdo Texto Conteúdo Texto Conteúdo Texto Conteúdo Texto Conteúdo Texto Conteúdo Texto Conteúdo Texto Conteúdo Texto
Para inserir links nas imagens pode usar a janela de propriedades da imagem. Após seleccionar o ficheiro pretendido, mude para a página Hiperligação da mesma janela e preencha o campoURL:
Note que nesta janela deverá incluir o protocolo no URL ('http://' neste caso).
Pode também usar o botão de links 
para inserir links em imagens como explicado anteriormente para texto. Seleccione a imagem com um clique do rato e prima o botão de links na barra de ferramentas.
Utilize a janela de propriedades do link para especificar o URL, protocolo e Destino como fez anteriormente para links de texto:
Recomendamos que utilize sempre o botão de links, uma vez que pode ser usado para introduzir links quer em texto, quer em imagens.
Poderá mesmo inserir links em combinaçoes de texto e imagens, bastando para tal selecionar texto e imagens em simultâneo, antes de premir o botão de links.
Após inserir links nas imagens de anúncios, a nossa página modelo fica como na figura abaixo:
|
Note que o seu browser agora mostra rectângulos à volta das imagens para indicar aos visitantes que elas possuem links.
Se pretender pode remover os rectângulos que envolvem as imagens com links. Para o fazer, clique com o botão direito do rato sobre as imagens e escolha Propriedades da Imagem. Na janela de propriedades que se abre, introduza 0 (zero) no campo Limite:
Feche a janela de Propriedades da Imagem premindo OK e grave a sua página premindo o botão Save & Preview.
Agora a sua página deverá estar parecida com a figura seguinte:
|
Tente fazer clique sobre as imagens dos anúncios para testar os links.
Anterior
Veja também:
Copyright © AWE Editions, Lda. 2006
This page was created with AWE Easy Web Site Creator