O documento discute as gerações de sites, ferramentas para criação de sites e layouts de páginas. Aborda a evolução da internet e da World Wide Web, além de explicar conceitos como hipertexto e diagrama de profissões relacionadas a desenvolvimento de sites.

1. Aula: Pág: Data:
Professor:
Turma:
1 1xxx 101.11.14
Elielso Dias
2506-C
A evolução da internet
As Gerações de sites
Profissões
Principais ferramentas
1
2
3
4

2. Objetivos do módulo
• Construção e desenvolvimento de sites.
• Aplicação de sites na WEB.
Turma: 2503-B Aula: 10 Pág: 10 a 17 Data: 20/01/2012
Instrutor: Ricardo Paladini Matos

3. HTML – A linguagem da
WWW
Gerações de sites
• HTML”pág. Estáticas” X DHTML “pág. Dinâmica” com
interatividade.
• XHTMLPágina dinâmica com texto.
• PHP e ASP Banco de dados.
• HTML 5
Turma: 2503-B Aula: 10 Pág: 10 a 17 Data: 20/01/2012
Instrutor: Ricardo Paladini Matos

4. Explicação sobre a NET
• A evolução da revolução.
• A WWW.
• Mas o que é um documento hipertexto?
• Internet versus World Wide Web
Turma: 2503-B Aula: 10 Pág: 10 a 17 Data: 20/01/2012
Instrutor: Ricardo Paladini Matos

5. Diagrama
Turma: 2503-B Aula: 10 Pág: 10 a 17 Data: 20/01/2012
Instrutor: Ricardo Paladini Matos
Web
Designer
Web
Developer
Ideia
WebMaster Responsável direto pelo site.
Responsável pelo designer.
Manter o script “pequenos programas”.

6. Turma: 2503-B Aula: 10 Pág: 10 a 17 Data: 20/01/2012
Instrutor: Ricardo Paladini Matos

7. Ferramentas para criação de sites
Bloco de Notas Word
Site
Turma: 2503-B Aula: 10 Pág: 10 a 17 Data: 20/01/2012
Instrutor: Ricardo Paladini Matos
Dreamweaver, FrontPage,
HotSitePro.
Flash
Kate
Fireworks
Joomla
Wordpress

8. • Planejamento
Um bom site deve ser bem projeto.
• Estrutura
Variedade de assuntos, nº de pág. para cada assunto.
• Design
Aparência, o mesmo Layout em todas as pág.
• Facilidade de Leitura
Use de imagens e animações.
• Objetividade
Links objetivos, um para cada pág.
• Regra dos três cliques
O assunto mais importante não pode ficar a mais de 3 cliques.
• Mapa
ordenação dos links.
Turma: 2503-B Aula: 10 Pág: 10 a 17 Data: 20/01/2012
Instrutor: Ricardo Paladini Matos

9. • Homepage (HP)
Turma: 2503-B Aula: 10 Pág: 10 a 17 Data: 20/01/2012
Instrutor: Ricardo Paladini Matos
• Site
• Portal

10. Turma: 2503-B Aula: 10 Pág: 10 a 17 Data: 20/01/2012
Instrutor: Ricardo Paladini Matos

11. Turma: 2503-B Aula: 10 Pág: 10 a 17 Data: 20/01/2012
Instrutor: Ricardo Paladini Matos

12. Turma: 2503-B Aula: 10 Pág: 10 a 17 Data: 20/01/2012
Instrutor: Ricardo Paladini Matos

13. Layout – elementos de um página
Turma: 2503-B Aula: 10 Pág: 10 a 17 Data: 20/01/2012
Instrutor: Ricardo Paladini Matos

14. Cores
Recursos básicos como fontes, tabelas, links, cor de Fundo,
usam uma tabela de 256 cores.
Turma: 2503-B Aula: 10 Pág: 10 a 17 Data: 20/01/2012
Instrutor: Ricardo Paladini Matos

15. Turma: 2503-B Aula: 10 Pág: 10 a 17 Data: 20/01/2012
Instrutor: Ricardo Paladini Matos

16. Turma: 2503-B Aula: 10 Pág: 10 a 17 Data: 20/01/2012
Instrutor: Ricardo Paladini Matos
Imagens
GIF, JPG, JPEG
GIF
256 cores;
Várias imagens.
JPG
16 milhões de cores;
São + compactas.
Tabelas
Melhor organização
Formulários
Conhecer visitantes;
Colher dados;
Oferecer produtos;
serviços.

17. Animações
Turma: 2503-B Aula: 10 Pág: 10 a 17 Data: 20/01/2012
Instrutor: Ricardo Paladini Matos

18. 3
Turma: 2503-B Aula: 10 Pág: 10 a 17 Data: 20/01/2012
Instrutor: Ricardo Paladini Matos
1
Pesquisar na
internet sobre
Cromoterapia
e fazer um
resumo no
Word.
2
Não se esqueça
de sempre salvar
as Atividades no
seu e-mail e em
Pen-driver.
Faça uma pesquisa
sobre as profissões
que envolvam a área
de Web designer.
Escreva no word e
elabore cinco
questões com
respostas!