Crie uma nova pasta para gravar seu "Site Pessoal"

Defina um novo site, com o nome de Página Pessoal

Crie um modelo p/ sua página pessoal a partir do seguinte layout (modelo reduzido)

Etapas:

1 - Crie uma tabela com 1 célula,

A partir da seguinte epecificação:Através do inspetor de propriedades da tabela:

- Nos campos Linhas e Colunas, especifique o número de linhas e colunas (1 x 1)
- Nos campos L e U, especifique a largura e a altura da tabela, em pixels, (600 por 480) Borda 0
- Posicionamento vertical no alto

2 - Subdivida essa tabela em 3 linhas

- Clique dentro da célula da tabela
- No inspetor de propriedades, clique no botão dividir célula > dividir célula em linhas > 3
- Ajuste a altura das linhas, clicando sobre a divisão da célula e arrastando p/cima, conforme modelo acima

1 - tabela 1 x 1	2 - subdividir em 3 linhas (ou incluir dentro da tabela criada anteriormente uma nova tabela 3 x1)
3 - na célula inferior inserir tabela 2 x 4, ajustar	4 - mesclar célula p/reservar espaço maior e ajustdo p/título

Figura 2 - Etapas na construção do layout

 

3 - Salvar o documento:

- Arquivo > salvar como modelo > modelo1
(o Dreamweaver automaticamente criará, dentro de seu site uma nova pasta Template, e dentro dela o documento modelo1.dwt)

4 - Defina as regiões editáveis:

Em um modelo, as regiões editáveis são as partes de uma página que se alteram — por exemplo: um artigo em um boletim. As regiões bloqueadas (não editáveis) são as áreas que se mantêm constantes de uma página para outra, como o nome ou logotipo de uma corporação. Como padrão, todas as regiões em um modelo são marcadas como bloqueadas quando salvas; para tornar o modelo útil, é necessário que algumas de suas partes sejam editáveis.
Enquanto o modelo estiver sendo editado, é possível fazer alterações tanto nas regiões editáveis quanto nas bloqueadas.
Quando o modelo for aplicado a um documento, no entanto, as modificações poderão ser feitas apenas nas regiões editáveis do documento; as regiões bloqueadas não podem ser alteradas.

1 No modelo, digite no formato parágrafo 3 e selecione o texto "Área editável p/título da página";
2 Escolha Modificar > Modelos > Marcar como editável a seleção. >
3. Na caixa de diálogo Nova região editável, digite título da página como nome para a região A região editável será realçada no modelo.
4. No modelo, digite no formato parágrafo 4 e selecione o texto "Área Editável p/ o corpo da página";
5. Escolha Modificar > Modelos > Marcar como editável a seleção. >
6. Na caixa de diálogo Nova região editável, digite corpo da página como nome para a região

obs: Uma tabela inteira ou uma célula de uma tabela pode ser marcada como editável; no entanto, não é possível marcar várias células como editáveis simultaneamente.

Nome do site
		Área editável p/título da página
			Área Editável p/ o corpo da página

5 - Crie seus documentos a partir do modelo1 criado conforme acima.

1. Escolha Arquivo > Novo a partir de modelo.
2. Na caixa de diálogo que aparecer, escolha modelo1
3. Substitua "Área editável p/título da página" pelo texto Apresentação
4. Substitua "Área Editável p/ o corpo da página" pelo texto que deseja para sua home page
5. Salve seu documento com o nome de index e feche-o

6. Repita os passos 1 e 2
3. Substitua "Área editável p/título da página" pelo texto Dados Pessoais
4. Substitua "Área Editável p/ o corpo da página" pelo texto que deseja
5. Salve seu documento dentro da pasta pessoal com o nome de pessoal e feche-o

Repita os passos 6 a 5 para formação, links, profissão.

6 - Criar barra de navegação

A partir do documento modelo1 siga os seguintes passos:

6.1. No espaço reservado p/ botões de navegação insira uma nova tabela, largura 100%, 1 linha por 5 colunas, borda 0;

Criar imagens cambiáveis Uma imagem cambiável é aquela cuja exibição é alterada quando o ponteiro for movido sobre ela. Crie uma imagem cambiável anexando um comportamento a uma imagem. Um comportamento é uma combinação entre um evento e uma ação. Os eventos são situações que desencadeiam ações. Por exemplo: um evento chamado onClick pode ocorrer quando o usuário clicar em um botão, ou um evento chamado onMouseOver será produzido quando o ponteiro do mouse passar sobre um objeto. As ações são parte do código JavaScript previamento gravado, que executam tarefas específicas, como a abertura de uma janela do navegador, a reprodução de um som ou a interrupção de um filme Shockwave. Quando um comportamento for anexado a um elemento da página, será especificada uma ação e o evento que a desencadeia. O Dreamweaver oferece diversas ações predefinidas que podem ser anexadas aos elementos das páginas.

6.2. Na coluna 1 desta nova tabela criada, posicione o ponto de inserção (clique) na célula em que deseja inserir a imagem cambiável utilizando o seguinte método:

- Na Janela Objetos, clique no botão Imagem cambiável. Escolha Inserir > Imagem cambiável. Aparecerá uma caixa de diálogo:

- Procure e selecione a imagem (home), ou digite o caminho e o nome de arquivo da imagem original no campo Imagem original .
- Procure e selecione a imagem cambiável (home_down), ou digite o caminho e o nome de arquivo da imagem cambiável no campo Imagem cambiável.
- Para criar um vínculo, procure e selecione um arquivo (index.htm), ou substitua o # no campo Vínculo por um caminho e um nome de arquivo.
- Para que o Dreamweaver carregue previamente as imagens no cache do navegador, selecione a opção Pré-carregar as imagens.

Clique em OK.

6.3. Repita o ítem 6.2 para demais botões.