A apresentação está carregando. Por favor, espere

A apresentação está carregando. Por favor, espere

Disciplina: Tópicos Avançados de TI Unidade IV: Desenvolvimento para a WWW Prof.: Mario Filho Período: 7º. SIG - ADM Encontro.

Apresentações semelhantes


Apresentação em tema: "Disciplina: Tópicos Avançados de TI Unidade IV: Desenvolvimento para a WWW Prof.: Mario Filho Período: 7º. SIG - ADM Encontro."— Transcrição da apresentação:

1 Disciplina: Tópicos Avançados de TI Unidade IV: Desenvolvimento para a WWW Prof.: Mario Filho Período: 7º. SIG - ADM Encontro Construindo um Web Site com o Nvu Trabalho para o 2º. Bimestre.

2 17. Construindo um Web Site com o Nvu

3 Prof. Mario Filho

4 17.1. Criando a Pasta do Web Site O primeiro passo, é criar uma pasta onde colocaremos os arquivos do web site. Crie na Área de Trabalho uma pasta chamada website. Dentro desta pasta crie outra pasta com o nome imagens, que será usada para guardar todas as imagens do site.

5 Prof. Mario Filho Criando a Página Principal Usando o Nvu, crie uma página igual a página do slide seguinte...

6 Prof. Mario Filho

7 17.3. Criando as Sub-páginas O nosso site terá a seguinte estrutura: Página Principal (index.html) Sub-Página Quem Somos: quem_somos.html Sub-Página Produtos: produtos.html Sub-Página Contato: contato.html Dica: para facilitar, podemos editar a página principal, que já criamos, e o recurso Salvar Como ou Save As...

8 Prof. Mario Filho

9 Estrutura do Web Site: index.html contato.html produtos.html quem_somos.html

10 Prof. Mario Filho 17.3 Criando os Links Após as 4 páginas (1 Página Principal e 3 Sub-páginas) estarem prontas e salvas. A Página Principal deverá chamar as sub- páginas através de links.

11 Prof. Mario Filho

12

13 Exercício 1: Após os links da Página Principal estarem funcionando, crie nas sub-páginas um link < Voltar que sirv apara voltar para a Página Principal. Exemplo no próximo slide...

14 Prof. Mario Filho

15 17.4. Inserindo Imagens O primeiro passo é colocar a imagem que fará parte do site, dentro da pasta imagens que criamos no início. Depois é só clicar no ícone Image ou ir em: Insert / Image... Localize o arquivo com a imagem Choose File... Escreva um texto alternativo (alternate text) ou não e clique em OK.

16 Prof. Mario Filho

17 17.5. Formatando a Página Vamos agora mudar as cores padrões da nossa página: Format / Page Colors and Background... Aparecerá o seguinte quadro...

18 Prof. Mario Filho Formatando a Página

19 Prof. Mario Filho

20 17.5. Formatando a Página Na Internet também é possível achar vários papéis de fundo (backgrounds) para usar em nossos web sites. Exemplo: Também é possível copiar o papel de parede de outros sites através do comando Copiar Plano de Fundo (botão direito do mouse).

21 Prof. Mario Filho

22 17.6. Inserindo Tabelas As Tabelas servem basicamente para duas coisas: Organizar uma listagem; Ajudar na formatação da página. Vamos usar o primeiro caso para criar nossa lista de produtos da página Produtos...

23 Prof. Mario Filho

24

25 17.6. Inserindo Tabelas Agora vamos utilizar o recurso da Tabela para formatar a página Quem Somos...

26 Prof. Mario Filho

27

28 Trabalho para o 2º. Bimestre

29 Prof. Mario Filho Trabalho para o 2º. Bimestre. Criar um site comercial imaginário, para qualquer segmento do comércio, dentro da estrutura abaixo: Página Principal Quem Somos Produtos Contato Hospedá-lo em um endereço no XPG.

30 Prof. Mario Filho Trabalho para o 2º. Bimestre. Após criar o site, enviar um para informando o endereço do site na Internet e o nome completo do(a) aluno(a). Criar o site, hospedar e enviar o até o dia: 16/05/2010 (domingo). O trabalho é para ser feito individualmente!

31 Prof. Mario Filho Trabalho para o 2º. Bimestre. Valor do trabalho: 3,5 pontos. 1,0 Ponto: Entrega no prazo. 1,0 Ponto: Funcionamento do site. 1,5 Ponto: criatividade e uso dos recursos. Agora é só começar! Bom trabalho!

32 FIM


Carregar ppt "Disciplina: Tópicos Avançados de TI Unidade IV: Desenvolvimento para a WWW Prof.: Mario Filho Período: 7º. SIG - ADM Encontro."

Apresentações semelhantes


Anúncios Google