7 - Criação de Páginas Web DREAMWEAVER Pt.2

Apresentação em tema: "7 - Criação de Páginas Web DREAMWEAVER Pt.2"— Transcrição da apresentação:

1 7 - Criação de Páginas Web DREAMWEAVER Pt.2

2 Criação e edição de links
Podem ser criados diversos tipos de links num documento: links a outro documento ou ficheiro, que pode ser de imagem, de filme, de som ou PDF; links de âncora com nome, que saltam para uma localização específica dentro de um documento; links de correio electrónico, que criam uma nova mensagem com o endereço do destinatário já preenchido; links nulos e de script, que permitem anexar comportamentos a um objecto ou executar código JavaScript.

3 Criação e edição de links
Para adicionar uma hiperligação utilizando o comando Hyperlink: colocar o ponto de inserção onde a hiperligação deve ser inserida no documento; escolher INSERIR – Hyperlink ou, na barra Inserir, seleccionar o separador «Comuns» e clicar no botão Hyperlink; Preencher a caixa de diálogo; Clicar em OK.

4 Criação e edição de links
Para criar uma âncora com nome: na visualização de Projecto, na janela do documento, posicionar o ponto de inserção no local onde se pretende inserir a âncora com nome; optar por um dos procedimentos seguintes: escolher INSERIR – Âncora com nome ou, alternativamente, pressionar as teclas Ctrl + Alt + A; outra possibilidade é, na barra Inserir, seleccionar o separador «Comuns» e clicar no botão Âncora com nome; no campo «Nome da âncora», digitar um nome para a âncora

5 Criação e edição de links
Para estabelecer um link a uma âncora com nome: na visualização de Projecto, na janela do documento, seleccionar um texto ou uma imagem a partir da qual será criado um link; no campo «Link», no Inspector de propriedades, digitar um sinal de cardinal (#) e o nome da âncora. Por exemplo: para estabelecer um link a uma âncora com o nome TIC no documento actual, digitar «#TIC»; para estabelecer um link a uma âncora com o nome TIC num documento diferente, na mesma pasta, digitar «nomedoficheiro.html#TIC»

6 Criação e edição de links
Para criar um link de correio electrónico: na visualização de Projecto, na janela do documento, colocar o ponto de inserção onde deverá aparecer o link de correio electrónico, ou seleccionar o texto ou a imagem a ser mostrada nesse local; escolher INSERIR – Link de correio electrónico ou, na barra Inserir, separador «Comuns», clicar no botão Inserir link de correio electrónico; preencher a caixa de diálogo; clicar em OK.

7 Criação e edição de links
Para criar um link nulo: seleccionar o texto, uma imagem ou um objecto na visualização de Projecto, na janela do documento; no Inspector de propriedades, na caixa de texto «Link», digitar «javascript:;» (a palavra javascript, seguida de dois pontos e de um ponto e vírgula). Para criar um link de script, proceder depois da seguinte forma: no campo «Link», no Inspector de propriedades, digitar «javascript:» seguido de código JavaScript ou de uma chamada à função, que normalmente envolve o nome da função definida e a chamar.

8 Inserção de imagens na página
Para inserir uma imagem na página: posicionar o ponto de inserção onde a imagem deverá ser incluída na janela do documento; no separador «Comuns» da barra Inserir, clicar no botão Imagem ou seleccionar INSERIR – Imagem

9 Inserção de imagens na página
na caixa de diálogo, seleccionar «Sistema de arquivos» para escolher um ficheiro de imagem ou «Procurar» para escolher a imagem ou origem do conteúdo a ser inserido; no Inspector de propriedades (JANELA – Propriedades), definir as propriedades da imagem.

10 Criação de imagens dinâmicas
Uma imagem dinâmica é aquela que, quando exibida no browser, é alterada por acção do rato. Este tipo de imagem consiste em pelo menos duas imagens: a imagem primária (exibida quando a página for carregada pela primeira vez) e a imagem secundária (que será exibida quando o rato desencadear a acção sobre a imagem primária).

11 Criação de imagens dinâmicas
Para criar uma imagem dinâmica: na janela do documento, colocar o ponto de inserção no local onde deverá aparecer a imagem; escolher INSERIR – Imagens interactivas – Imagem cambiável;

12 Criação de imagens dinâmicas
em «Nome da imagem», digitar um nome para a imagem dinâmica; em «Imagem original», clicar em Procurar e seleccionar a imagem a ser exibida quando a página carregar ou, alternativamente, digitar o caminho do arquivo da imagem na caixa de texto; em «Imagem cambiável», clicar em Procurar e seleccionar a imagem a ser exibida quando o rato desencadear a acção; alternativamente, digitar o caminho do arquivo da imagem na caixa de texto;

13 Criação de imagens dinâmicas
seleccionar a opção «Pré-carregar a imagem cambiável» para que a imagem seja pré-carregada na Cache do browser, evitando atrasos quando o ponteiro passar sobre ela; em «Texto alternativo», digitar texto para descrever a imagem; em «Quando tiver clicado, vá para a URL», clicar em Procurar e seleccionar o ficheiro; alternativamente, digitar o caminho do ficheiro a ser aberto quando um utilizador clicar na imagem dinâmica; clicar em OK para fechar a caixa de diálogo; seleccionar ARQUIVO – Visualizar no browser; no browser, passar o cursor sobre a imagem original: a exibição deve alternar para a imagem secundária.

14 Utilização de um editor de imagens externo
Para configurar um programa editor de imagem conforme o tipo de ficheiro, seleccionar EDITAR – Preferências – Tipos de arquivos/editores: clicar no botão de adição (+) situado acima da lista de extensões; digitar a extensão do tipo de arquivo (incluindo o ponto no início da extensão), ou diversas extensões relacionadas, separadas por espaços.

15 Utilização de um editor de imagens externo
Para adicionar um editor a um determinado tipo de arquivo: seleccionar a extensão do tipo de arquivo na lista «Extensões»; clicar no botão de adição (+) situado acima da lista de editores; seleccionar a aplicação a ser adicionada à lista «Editores» na caixa de diálogo que for exibida. Escolher, por exemplo, o ícone do aplicativo Excel e adicioná-lo à lista «Editores».