SlideShare uma empresa Scribd logo
1 de 12
Aula: Pág: Data:10 10 a 17 18-jan-122503-BTurma:
Instrutor: Ricardo Paladini Matos
2503-B 10 10-17 17-01-2013
Celso AlencarJorge André
Sites 05 32 - 39 29/03/2014
Apresentando o Dreamweaver
Ferramentas
Iniciando Primeiro Site
Aula: Pág: Data:10 10 a 17 18-jan-122503-BTurma:
Instrutor: Ricardo Paladini Matos
2503-B 10 10-17 17-01-2013
Celso AlencarJorge André
Sites 05 32 - 39 29/03/2014
Dreamweaver é um software que faz parte do pacote
Adobe, inicialmente pertencia a macromedia, programa
profissional para criar e desenvolver sites.
Aula: Pág: Data:10 10 a 17 18-jan-122503-BTurma:
Instrutor: Ricardo Paladini Matos
2503-B 10 10-17 17-01-2013
Celso AlencarJorge André
Sites 05 32 - 39 29/03/2014
Aula: Pág: Data:10 10 a 17 18-jan-122503-BTurma:
Instrutor: Ricardo Paladini Matos
2503-B 10 10-17 17-01-2013
Celso AlencarJorge André
Sites 05 32 - 39 29/03/2014
O Dreamweaver conta com três modos de
visualização, são eles: código, código e design e
design.
No modo código, é possível visualizarmos a
linguagem e a forma como ela está sendo
desenvolvida.
É possível enxergamos suas tags e comandos, além de
possibilitar a inserção de funções adicionais.
Aula: Pág: Data:10 10 a 17 18-jan-122503-BTurma:
Instrutor: Ricardo Paladini Matos
2503-B 10 10-17 17-01-2013
Celso AlencarJorge André
Sites 05 32 - 39 29/03/2014
Modo Código
Aula: Pág: Data:10 10 a 17 18-jan-122503-BTurma:
Instrutor: Ricardo Paladini Matos
2503-B 10 10-17 17-01-2013
Celso AlencarJorge André
Sites 05 32 - 39 29/03/2014
Modo Dividir
Aula: Pág: Data:10 10 a 17 18-jan-122503-BTurma:
Instrutor: Ricardo Paladini Matos
2503-B 10 10-17 17-01-2013
Celso AlencarJorge André
Sites 05 32 - 39 29/03/2014
Modo Design
Aula: Pág: Data:10 10 a 17 18-jan-122503-BTurma:
Instrutor: Ricardo Paladini Matos
2503-B 10 10-17 17-01-2013
Celso AlencarJorge André
Sites 05 32 - 39 29/03/2014
Barra de Menu
Barra de propriedades
Barra de Inserir
Aula: Pág: Data:10 10 a 17 18-jan-122503-BTurma:
Instrutor: Ricardo Paladini Matos
2503-B 10 10-17 17-01-2013
Celso AlencarJorge André
Sites 05 32 - 39 29/03/2014
Definir o nome do site e o local onde serão armazenados as
páginas, imagens, enfim os conteúdos.
Aula: Pág: Data:10 10 a 17 18-jan-122503-BTurma:
Instrutor: Ricardo Paladini Matos
2503-B 10 10-17 17-01-2013
Celso AlencarJorge André
Sites 05 32 - 39 29/03/2014
No campo nome do site você deve digitar o nome do projeto.
Por exemplo, Atairu Viagens.
No Campo Pasta do site local, você vai escolher o destino dos
arquivos e páginas que serão produzidas no Dreamweaver.
Sabendo que os arquivos devem ser publicados
simultaneamente em servidor web, podemos contar com a
facilidade de publica-los a partir do Dreamweaver
Aula: Pág: Data:10 10 a 17 18-jan-122503-BTurma:
Instrutor: Ricardo Paladini Matos
2503-B 10 10-17 17-01-2013
Celso AlencarJorge André
Sites 05 32 - 39 29/03/2014
Diagramação é a organização de cada elemento para a composição de um
layout. A definição dos menus, hiperlinks, planos de fundo, cores, assuntos
abordados, disposição de cada elemento na página, possibilitam um designer
mais agradável.
Esse processo é iniciado ainda nos wireframes, quando ao elaborar o
planejamento, o desenvolvedor consegue adequar as necessidades da empresa
com os interesses dos internautas.
Algumas dicas:
1- Faça um site simples e leve.
2- Padronize as páginas
3- Navegação simples e dinâmica (lembre-se da regra dos três clicks)
4- Tenha um espaço para contatos
5- Muita atenção com fontes e o Português.
importante
Aula: Pág: Data:10 10 a 17 18-jan-122503-BTurma:
Instrutor: Ricardo Paladini Matos
2503-B 10 10-17 17-01-2013
Celso AlencarJorge André
Sites 05 32 - 39 29/03/2014
Vamos começar a desenvolver um site de uma escola
de informática e idiomas;
 Banner: Formato PNG, chame bastante atenção!
 Botões de navegação: Cursos – Unidades – Eventos

Mais conteúdo relacionado

Semelhante a Aula 5 atualizada

Semelhante a Aula 5 atualizada (20)

Aula 13 web
Aula 13 webAula 13 web
Aula 13 web
 
Aula 01 word
Aula 01 wordAula 01 word
Aula 01 word
 
Aula 6 so
Aula 6 soAula 6 so
Aula 6 so
 
Aula 1 corel
Aula 1 corelAula 1 corel
Aula 1 corel
 
Aula 2
Aula 2Aula 2
Aula 2
 
Aula 10 corel comunicação visual
Aula 10 corel comunicação visualAula 10 corel comunicação visual
Aula 10 corel comunicação visual
 
Aula de Ambiente Web - 07-08 - Cedaspy
Aula de Ambiente Web - 07-08 - CedaspyAula de Ambiente Web - 07-08 - Cedaspy
Aula de Ambiente Web - 07-08 - Cedaspy
 
Aula 14 so
Aula 14 soAula 14 so
Aula 14 so
 
Aula 15 so
Aula 15 soAula 15 so
Aula 15 so
 
Web13 14
Web13 14Web13 14
Web13 14
 
Aula 1 dreamweavernova
Aula 1  dreamweavernovaAula 1  dreamweavernova
Aula 1 dreamweavernova
 
Aula 1 dreamweavernova
Aula 1  dreamweavernovaAula 1  dreamweavernova
Aula 1 dreamweavernova
 
Aula 08 word
Aula 08  wordAula 08  word
Aula 08 word
 
Aula 13 so
Aula 13 soAula 13 so
Aula 13 so
 
Aula 9 so
Aula 9 soAula 9 so
Aula 9 so
 
Aula 12 word
Aula 12  wordAula 12  word
Aula 12 word
 
Aula 12 word
Aula 12  wordAula 12  word
Aula 12 word
 
Aula de Ambiente Web - 07 - Cedaspy
Aula de Ambiente Web - 07 - CedaspyAula de Ambiente Web - 07 - Cedaspy
Aula de Ambiente Web - 07 - Cedaspy
 
Objetivos do Módulo - Desenvolvimento de Sites - T4011A - CEDASPY PINHEIROS
Objetivos do Módulo - Desenvolvimento de Sites - T4011A - CEDASPY PINHEIROSObjetivos do Módulo - Desenvolvimento de Sites - T4011A - CEDASPY PINHEIROS
Objetivos do Módulo - Desenvolvimento de Sites - T4011A - CEDASPY PINHEIROS
 
Aula 2 so
Aula 2 soAula 2 so
Aula 2 so
 

Mais de Jorge Andre Sousa (20)

Computação em nuvens
Computação em nuvensComputação em nuvens
Computação em nuvens
 
Aula 2
Aula 2Aula 2
Aula 2
 
Aula 3 atualizada
Aula 3 atualizadaAula 3 atualizada
Aula 3 atualizada
 
Aula 7
Aula 7Aula 7
Aula 7
 
Aula 5
Aula 5 Aula 5
Aula 5
 
Aula 4
Aula 4Aula 4
Aula 4
 
Aula 3
Aula 3 Aula 3
Aula 3
 
Aula 1
Aula 1Aula 1
Aula 1
 
Aula 01
Aula 01Aula 01
Aula 01
 
Ambiente web
Ambiente webAmbiente web
Ambiente web
 
Aula 12 atualizada
Aula 12   atualizadaAula 12   atualizada
Aula 12 atualizada
 
Aula 11
Aula 11Aula 11
Aula 11
 
Aula 5 atualizada
Aula 5   atualizadaAula 5   atualizada
Aula 5 atualizada
 
Apresentação excel
Apresentação excelApresentação excel
Apresentação excel
 
Apresentação prova excel
Apresentação prova excelApresentação prova excel
Apresentação prova excel
 
Aula 5
Aula 5Aula 5
Aula 5
 
Módulo
MóduloMódulo
Módulo
 
Aula 7 e 8
Aula 7 e 8Aula 7 e 8
Aula 7 e 8
 
Aula 6
Aula 6Aula 6
Aula 6
 
Aula 3 e 4
Aula 3 e 4Aula 3 e 4
Aula 3 e 4
 

Aula 5 atualizada

  • 1. Aula: Pág: Data:10 10 a 17 18-jan-122503-BTurma: Instrutor: Ricardo Paladini Matos 2503-B 10 10-17 17-01-2013 Celso AlencarJorge André Sites 05 32 - 39 29/03/2014 Apresentando o Dreamweaver Ferramentas Iniciando Primeiro Site
  • 2. Aula: Pág: Data:10 10 a 17 18-jan-122503-BTurma: Instrutor: Ricardo Paladini Matos 2503-B 10 10-17 17-01-2013 Celso AlencarJorge André Sites 05 32 - 39 29/03/2014 Dreamweaver é um software que faz parte do pacote Adobe, inicialmente pertencia a macromedia, programa profissional para criar e desenvolver sites.
  • 3. Aula: Pág: Data:10 10 a 17 18-jan-122503-BTurma: Instrutor: Ricardo Paladini Matos 2503-B 10 10-17 17-01-2013 Celso AlencarJorge André Sites 05 32 - 39 29/03/2014
  • 4. Aula: Pág: Data:10 10 a 17 18-jan-122503-BTurma: Instrutor: Ricardo Paladini Matos 2503-B 10 10-17 17-01-2013 Celso AlencarJorge André Sites 05 32 - 39 29/03/2014 O Dreamweaver conta com três modos de visualização, são eles: código, código e design e design. No modo código, é possível visualizarmos a linguagem e a forma como ela está sendo desenvolvida. É possível enxergamos suas tags e comandos, além de possibilitar a inserção de funções adicionais.
  • 5. Aula: Pág: Data:10 10 a 17 18-jan-122503-BTurma: Instrutor: Ricardo Paladini Matos 2503-B 10 10-17 17-01-2013 Celso AlencarJorge André Sites 05 32 - 39 29/03/2014 Modo Código
  • 6. Aula: Pág: Data:10 10 a 17 18-jan-122503-BTurma: Instrutor: Ricardo Paladini Matos 2503-B 10 10-17 17-01-2013 Celso AlencarJorge André Sites 05 32 - 39 29/03/2014 Modo Dividir
  • 7. Aula: Pág: Data:10 10 a 17 18-jan-122503-BTurma: Instrutor: Ricardo Paladini Matos 2503-B 10 10-17 17-01-2013 Celso AlencarJorge André Sites 05 32 - 39 29/03/2014 Modo Design
  • 8. Aula: Pág: Data:10 10 a 17 18-jan-122503-BTurma: Instrutor: Ricardo Paladini Matos 2503-B 10 10-17 17-01-2013 Celso AlencarJorge André Sites 05 32 - 39 29/03/2014 Barra de Menu Barra de propriedades Barra de Inserir
  • 9. Aula: Pág: Data:10 10 a 17 18-jan-122503-BTurma: Instrutor: Ricardo Paladini Matos 2503-B 10 10-17 17-01-2013 Celso AlencarJorge André Sites 05 32 - 39 29/03/2014 Definir o nome do site e o local onde serão armazenados as páginas, imagens, enfim os conteúdos.
  • 10. Aula: Pág: Data:10 10 a 17 18-jan-122503-BTurma: Instrutor: Ricardo Paladini Matos 2503-B 10 10-17 17-01-2013 Celso AlencarJorge André Sites 05 32 - 39 29/03/2014 No campo nome do site você deve digitar o nome do projeto. Por exemplo, Atairu Viagens. No Campo Pasta do site local, você vai escolher o destino dos arquivos e páginas que serão produzidas no Dreamweaver. Sabendo que os arquivos devem ser publicados simultaneamente em servidor web, podemos contar com a facilidade de publica-los a partir do Dreamweaver
  • 11. Aula: Pág: Data:10 10 a 17 18-jan-122503-BTurma: Instrutor: Ricardo Paladini Matos 2503-B 10 10-17 17-01-2013 Celso AlencarJorge André Sites 05 32 - 39 29/03/2014 Diagramação é a organização de cada elemento para a composição de um layout. A definição dos menus, hiperlinks, planos de fundo, cores, assuntos abordados, disposição de cada elemento na página, possibilitam um designer mais agradável. Esse processo é iniciado ainda nos wireframes, quando ao elaborar o planejamento, o desenvolvedor consegue adequar as necessidades da empresa com os interesses dos internautas. Algumas dicas: 1- Faça um site simples e leve. 2- Padronize as páginas 3- Navegação simples e dinâmica (lembre-se da regra dos três clicks) 4- Tenha um espaço para contatos 5- Muita atenção com fontes e o Português. importante
  • 12. Aula: Pág: Data:10 10 a 17 18-jan-122503-BTurma: Instrutor: Ricardo Paladini Matos 2503-B 10 10-17 17-01-2013 Celso AlencarJorge André Sites 05 32 - 39 29/03/2014 Vamos começar a desenvolver um site de uma escola de informática e idiomas;  Banner: Formato PNG, chame bastante atenção!  Botões de navegação: Cursos – Unidades – Eventos