Exercicios Dreamweaver

Fichas de trabalho – DREAMWEAVER MX 2004

D-1 (1) 1.

Crie um novo site com o nome Desporto-Modalidade, sem a tecnologia servidor, sem ligação ao servidor remoto e com a seguinte estrutura:

2.

Procure 4 fundos diferentes (se quiser, em vez de fundos use cores) e 5 imagens. Por exemplo:

Armanda Ribeiro

Página 1


3. 4.

5.

Se fizer duplo clique em cada uma das imagens, automaticamente se abre o Fireworks MX 2004. Este programa permite fazer a edição da imagem. 3.1. Gravar cada uma das imagens com a extensão sugerida por ele. O resultado será o seguinte depois se encontradas as imagens (não precisam de ter os mesmos nomes):

Abra agora a página despleves.htm e defina as propriedades da página de acordo com o seguinte:

Deserto.pnt

Armanda Ribeiro

Página 2


6.

Dê o seguinte nome à página:

7.

Escreva o texto que se segue:

Desportos "sem esforço" Apresento aqui algumas formas de desportos que podem ser postos em prática sem grande esforço, permitindo-me afirmar que para se estar em forma não é necessário um excessivo esforço do praticante. GOLF Dos mais relaxantes entre todos os desportos, implica a deslocação a pé, percorrendo áreas consideráveis. Conduz a uma melhoria nas articulações dos pulsos e braços. Para além de tudo exige concentração, conduzindo ao desaparecimento do stress. CAMINHAR De todos os exercícios físicos é o mais espontâneo e dos mais fáceis de praticar. Pode evoluir para o montanhismo e para as caminhadas por locais naturais. Melhora a circulação sanguínea, os músculos e as articulações, conferindo mais resistência física. STRECHTING Para além de poder ser praticado como forma de desporto, pode servir como aquecimento para outras modalidades. Consiste na execução de movimentos e posturas do corpo de forma calma e serena, havendo sempre uma concentração nos músculos que estão a ser alongados. Melhora a circulação sanguínea e anula as tensões musculares. TAI-CHO É uma das artes marciais mais tranquilas. Consiste num agrupamento de cento e oito movimentos executados de uma forma lenta, mas contínua. Proporciona uma melhoria nos músculos, tendões e articulações e conduz a uma relaxamento dos pontos de tensão e da mente. Armanda Ribeiro

Página 3


8. 9.

Aplique o H1 aos títulos e alinhe-o ao centro. Aplique os alinhamentos ao resto do texto.

10. Efectue agora as alterações necessárias para que a página fique com o aspecto apresentado na figura abaixo: 10.1. Título - texto cor #0099FF, tamanho 36 píxeis, alinhamento centrado. 10.2. Introdução - texto cor #FF9933, tamanho 18 píxeis, alinhamento centrado. 10.3. Subtítulo - texto cor #669999, tamanho 24 píxeis, alinhamento justificado. 10.4. Restante texto - Texto cor #339999, tamanho 16 píxeis, alinhamento justificado.

Armanda Ribeiro

Página 4


11. A seguir ao texto, crie um botão flash centrado, com 100x60 píxeis, com o texto “Inicio”, estilo do botão Blue Warper, tipo de letra Arial, tamanho 30 pto, cor de fundo #3399FF e com uma hiperligação para a página índex.htm. Guarde-o com o nome Botao1.sfw. 12. Guarde todas as alterações efectuadas e feche o site.

Armanda Ribeiro

Página 5


D-1 (2) 1. 2. 3. 4.

Abra o site Desporto-Modalidade. Abra a página index.htm. O seu título será: Desporto-Modalidades Na página defina como fundo de página a imagem que usou no documento anterior. Deserto.pnt. 4.1. Na primeira linha insira a palavra DESPORTOS, como texto em Flash com: tipo de letra Algerian, tamanho 60 píxeis, cor #336699, cor à passagem do rato #FF9900, cor de fundo #CCCCFF, alinhamento centrado e estilo negrito. Guarde-a com o nome Texto1.sfw. 4.2. A seguir, insira a imagem que já deve existir na sua pasta.

4.3. A seguir, insira uma linha horizontal a toda a largura da página. 4.4. Abra a imagem no Fireworks MX 2004. Basta fazer um duplo clique na imagem. Altere-lhe o brilho de forma a ficar quase transparente.

4.5. Grave-a na pasta das imagens. 4.6. Insira agora uma imagem rollover, a primeira imagem será a que não foi editada, a sua foi a que alteramos a cor, e o texto alternativo O desporto faz bem à saúde… 4.7. O tamanho da imagem deve ser 400x250 píxeis. 4.8. Insira agora uma tabela com 500x50 píxeis, com uma linha e duas colunas, alinhada ao centro, limite de 10 píxeis, espaçamento entre células de 6 píxeis, cor de fundo #3366CC, cor do limite #9999CC. 4.9. Na célula da esquerda crie um botão flash centrado, com 80x30 píxeis, com o texto “LEVES”, estilo Blue Warper, tipo de letra Algerian, tamanho de letra 16 pt, cor de fundo #3399FF e com uma hiperligação para a página despleves.htm. Guarde-o com o nome Botao2.sfw. 4.10. Na célula da direita crie um botão flash centrado, com 80x30 píxeis, com o texto “PESADOS”, estilo Blue Warper, tipo de letra Algerian, tamanho de letra 16 pt, cor de fundo #3399FF e com uma hiperligação para a página despesados.htm. Guarde-o com o nome Botao3.sfw. 4.11. Insira a seguir à tabela uma linha horizontal a toda a largura da página. Armanda Ribeiro

Página 6


4.12. Na linha a seguir crie uma hiperligação para o seu endereço de correio electrónico, com o nome de “Caixa de correio electrónico”, alinhado à direita, tamanho 16 píxeis e cor #003366. 5.

O resultado é o seguinte:

6.

Guarde todas as alterações efectuadas e feche o site.

Armanda Ribeiro

Página 7


D-1 (3) 1. 2.

Abra o site Desporto-Modalidade. Na página despesados.htm, reproduza a página tal como apresentada na figura abaixo, tendo em atenção as indicações dadas:

2.1. Insira uma frame do tipo Right and Nested Top Frame. 2.2. Para cada uma das frames insira um fundo de página diferente. 2.3. Na frametopo, digite o texto Desportos "com esforço”, formatando-o com o tipo de letra Times New Roman, tamanho 40 píxeis, cor #0099FF e alinhamento centrado. 2.4. Ainda nesta frame, escreva o texto que se segue: Apresento agora algumas modalidades desportivas que requerem mais esforço do praticante.

2.5. Formate-o com o tipo de letra Times New Roman, tamanho 16 píxeis, cor #330066 e alinhamento centrado 2.6. Defina a largura desta para 101 píxeis. 2.7. Defina os limites das frametopo e framedireita com a cor #FF9900 e largura 20 píxeis. 2.8. Na frameprincipal, aplique aos subtítulos o tipo de letra Times New Roman, cor #333399, tamanho 36 píxeis e alinhamento centrado. 2.9. Na frameprincipal, aplique ao restante texto, o tipo de letra Times New Roman, cor #333399, tamanho 16 píxeis, estilo negrito e alinhamento justificado. 2.10. Na parte superior da framedireita, crie um botão flash, centrado, com Armanda Ribeiro

Página 8


3.

100x60 píxeis, com o texto Início, estilo do botão Blue Warper, tipo de letra Algerian, tamanho da letra 30, cor de fundo #3399FF e com hiperligação para a página index.htm. Guarde-o com o nome de Botao4.swf. 2.11. Procure uma musica, por exemplo a Sinfonia N.º 9 de Beethoven (Scherzo).wma e copie-a para o seu site e mude-lhe o nome para por exemplo sinfonia9.wma (não se pode ter caracteres especiais). 2.12. Na framepricipal a seguir ao texto, insira um plug-in para executar o ficheiro a música de cima. 2.13. Edite a tag do ícone do plug-in e seleccione as opções: Auto Star, Loop e Hidden. Guarde todas as alterações efectuadas e feche o site. 3.1. Guarde a frame1 com o nome frametopo. 3.2. A frame2 com o nome framedireita. 3.3. A frame3 com o nome frameprincipal. 3.4. A frameset com o nome despesados.

Armanda Ribeiro

Página 9


D-1 (4) 1. 2.

3. 4.

Abra o site Desporto-Modalidade. Na página despesados.htm, crie imagens com movimento, tal com apresentado na figura abaixo e de acordo com as indicações: 2.1. Insira três layers de acordo com a modalidade desportiva, atribuindolhes os nomes Ciclismo, Natação e Futebol. 2.2. Para a layer Ciclismo, insira uma imagem relacionada. Em princípio na sua pasta imagens, deve lá ter as imagens que se seguem ou pelo menos parecidas:

2.3. Para cada uma das layers crie um movimento contínuo e autoexecutável desde a posição 1 até à posição 40 da Timeline, correspondente a uma deslocação na horizontal da esquerda para a direita e a toda a largura da página. Crie uma só Timeline com as layers: Ciclismo, Natação e Futebol. Na parte inferior da framedireita, insira, sobre a forma de um filme Shockwave, o ficheiro clock.avi, pode encontrar este ficheiro na pasta Windows. 3.1. Defina um espaço de 100x100 píxeis para visualizar o filme clock.avi. Guarde todas as alterações efectuadas e feche o site.

Armanda Ribeiro

Página 10


D-1 (5) 1. 2.

Abra o site Desporto-Modalidade. Crie uma nova página inquérito.htm, de acordo com o apresentado na figura abaixo e com as seguintes indicações: 2.1. Defina como fundo de página o fundo rosa.pgn. 2.2. Insira o formulário dentro de uma tabela. 2.3. Relativamente às modalidades que pratica ou que gostaria de praticar, nos campos menu de listagem, defina como entradas: Ténis, Futebol, Hóquei em patins, Andebol, Golfe, Voleibol e Natação. 2.4. O botão de Envio de respostas deverá ter uma ligação à sua caixa de correio electrónico, para onde serão enviadas as respostas ao inquérito.

3. 4.

Guarde todas as alterações efectuadas na página. Abra agora a página principal (índex.htm) e coloque-lhe um link para este formulário: 4.1. Insira uma tabela, com 2 colunas, retire-lhe os limites, mova o link “Caixa de correio, …” para dentro dela e coloque um novo link, agora para a página inquérito.htm.

Armanda Ribeiro

Página 11


4.2.

5.

O resultado final será o seguinte:


Armanda Ribeiro

Página 12


D-1 (6) 1.

2.

Abra o site Desporto-Modalidade. 1.1. Dê um título a todas as páginas que fazem parte do site, para quer no Internet Explorer, não apareça “Untitled Document”:

1.2. Organize as imagens, fundos, … em pastas. Guarde todas as alterações efectuadas e feche o site.

Armanda Ribeiro

Página 13


D-1 (7) 1. 2.

Abra o site Desporto-Modalidade. 1.1. Efectue alterações a seu gosto. Guarde essas alterações efectuadas e feche o site.

Armanda Ribeiro

Página 14


D-1 (8) 1. 2.

Abra o site Desporto-Modalidade. 1.1. Publique o site num servidor remoto. Efectue alterações a seu gosto no site e actualize-o no servidor

Armanda Ribeiro

Página 15


D-2 (1) 1. 2.

Crie um site com o nome GrandePremio. Abra a seguinte estrutura:

HomePage

Marcas

3.

GrandePremio

Vencedores

Organize a seu site em pastas. Por exemplo imagens, fundos, …. Em qualquer altura pode criar novas pastas para organizar o conteúdo. 3.1. Título da página: Bem-Vindo 3.2. Altere a cor de fundo para a cor amarela-clara. 3.3. Conteúdo da página: 3.3.1. Título: “Bem-Vindo”. Formatação aplicada a ele (o seguinte estilo):

3.4. Insira uma rollover imagem com as dimensões 9,42 cm de altura por 14,92 cm de largura (pode uma imagem do ClipArt). Para ter uma rollover image, terá que ter duas imagens, no seu site. O objectivo é para quando se passar com o rato por cima dela pode-se ver por exemplo a de baixo com menos contraste. 3.4.1. Sugestão: encontrar a imagem e gravá-la no site, já com o tamanho pretendido. No site duplicar a imagem. Numa delas alterar o brilho e o contraste. 3.5. Insira a seguir o texto “Ao Grande Prémio”, com a formatação do texto anterior. 3.6. Insira agora uma tabela, com 1 linha e 1 coluna, que irá ter 4 botões. Crie ligações às páginas marcas.htm, grandepremio.htm, vencedores.htm e a um endereço de correio electrónico.

Armanda Ribeiro

Página 16


4.


Armanda Ribeiro

Página 17


D-2 (2) 1. 2.

Abra o site GrandePremio. Abra agora a página com o nome marcas.htm e efectue as alíneas seguintes de forma a obter o aspecto da figura abaixo: 2.1. Configuração de página: 2.1.1. Título da página: Marcas 2.1.2. Insira uma imagem como fundo de página (pode ser do ClipArt).

2.1.3. Altere também a cor de fundo para #CCFFFF. 2.2. Insira uma tabela com uma coluna e uma linha, com as seguintes propriedades:

2.3. Na tabela digite “Principais Marcas” e insira uma imagem (carro de corrida; existe no ClipArt). Aplique a formatação que se segue ao texto:

2.4. Insira uma outra tabela com uma coluna e uma linha, com 619x505 píxeis, com um limite amarelo (#FFFF66) de largura 4 e com fundo azulclaro (#CCFFFF). 2.5. Digite as marcas que se seguem, usando a seguinte formatação para o texto (lista numerada):

Armanda Ribeiro

Página 18


3.

2.6. Insira um botão flash (estilo Glass-Silver), para regressar à Home Page. Guarde todas as alterações efectuadas e feche o site.

Armanda Ribeiro

Página 19


D-2 (3) 1. 2.

Abra o site GrandePremio. Na página com o nome grandepremio.htm, efectue as alíneas seguintes de forma a obter o aspecto da figura abaixo: 2.1. Configuração de página: 2.1.1. Título da página: Grande Premio 2.2. Insira uma tabela com uma coluna e uma linha, com as seguintes propriedades:

2.3. Na tabela digite Grande Prémio. Use a seguinte formatação para o texto:

2.4. Coloque a imagem já usada como painel rolante Altera a imagem aumentando-lhe o tamanho. Duplique-a e nesta nova altere-lhe o brilho e contraste. 2.5. Na pasta imagens passarei a ter as seguintes imagens:

Armanda Ribeiro

Página 20


2.6. Insira uma nova tabela após a figura com uma linha e uma coluna e com 604x35 píxeis, sem limites 2.7. Na tabela anterior digite o seguinte texto: Grande Prémio de Portugal Grande Prémio do Reino Unido Grande Prémio de França 2.8. Aplique a seguinte formatação ao texto:

2.9. Associe a cada frase anterior o endereço de um site. 2.10. Aplique às ligações da página a formatação de acordo com o indicado:

3.

2.11. Insira um botão flash (estilo Glass-Silver), para regressar à Home Page. Guarde todas as alterações efectuadas e feche o site.

Armanda Ribeiro

Página 21


D-2 (4) 1. 2.

Abra o site GrandePremio. Crie uma nova página com o nome vencedores.htm e efectue as alíneas seguintes de forma a obter o aspecto da figura abaixo. 2.1. Configuração de página: 2.1.1. Título da página: Vencedores 2.2. Insira uma tabela com uma coluna e uma linha, com as seguintes propriedades:

2.3. Na tabela digite Vencedores e insira a imagem que já usou no exercício anterior, que é um carro de corrida. 2.4. Use a seguinte formatação para o texto:

2.5.

2.6.

Insira agora a seguinte tabela:

Aplique-lhe as seguintes formatações: 2.6.1. Altura das linhas 25 pixels; 2.6.2. Largura da tabela 607 pixels; 2.6.3. Border 2 e cor #FFFF66; 2.6.4. Centrada; 2.6.5. Fonte:

Armanda Ribeiro

Página 22


2.6.6. 2.6.7. 2.6.8.

Texto da 2ª coluna alinhado ao centro; Na primeira coluna aplique-lhe um avanço à direita; A formatação da 1ª linha será:

2.7. Com os dados da tabela anterior, crie um gráfico na folha de cálculo (Microsoft Excel) e insira-o na página. 2.8. Insira um botão flash (estilo Glass-Silver), para regressar à HomePage.

3.


Armanda Ribeiro

Página 23

Exercicios Dreamweaver

Recommend Documents