Dreamweaver

Fernanda Barroso

Abril,2006

O que é o DreamWeaver?O Dreamweaver é:• um dos melhores editores WYSIWYG (What You

See Is What You Get) de HTML existentes actualmente no mercado.

• um programa desenvolvido pela Macromedia para a criação e edição de Sites WWW (páginas pessoais ou institucionais, lojas virtuais, etc.)

• um editor que oferece a possibilidade de dar dinamismo às páginas, utilizando o DHTML (Dynamic html).

Estrutura do DreamWeaver

A sua estrutura é:• similar à dos habituais programas do Microsoft

Office com: – painéis flutuantes, – barra de indicador (inferior direito) – e a janela do documento onde se irá realizar a

construção do site.

Área de site1. A primeira coisa a fazer, assim que abrimos o

Dreamweaver, é aceder à area de trabalho– se essa esta já existe tudo bem – se não temos de criá-la da seguinte maneira:

Site > New site…(janela de gestão)Deverá aparecer uma janela (site definition) onde irá dar um nome à

área de trabalho e sua localização.

2. Agora basta criarmos páginas.– uma das primeiras coisas a fazer é abrir as propriedades da

página através de MODIFY>PAGE PROPERTIES isso vai-nos permitir dar um título à página, escolher uma imagem de

fundo ou cor, escolher a cor de texto e dos links, etc.

Janela Principal

Vamos ter 3 tipos de visão da página que são:1. Design view (vista de desenho) onde se

desenha a página de forma directa (visual).2. Code view (vista de código) onde se edita a

página escrevendo código em HTML, javaScript, PHP e etc.

3. Code and Design (vista mista) que nos permite combinar os dois modos anteriores de edição de páginas.

Conteúdos

Texto: a edição de texto no Dreamweaver é semelhante

a qualquer editor de texto. na barra de propriedades (“properties”) é fácil

alterar as fontes, cor etc. se quisermos fazer um link basta selecionar o

texto a “ancorar” e ir à barra de propriedades clicar no icone de uma “pasta” e escolher o arquivo.

Conteúdos

Imagens: podemos inserir a imagem através do respectivo

icone da barra;clique por cima da imagem e vá à barra de

propriedades para alterar alguma se desejar.Também se pode criar uma imagem como link;

basta inserir um link como no texto.

Conteúdos

Células e tabelas: A construção de tabelas serve para tabular o

conteúdo da página, ajudando a “arrumá-los”, isto é, evitando que os conteúdos fiquem espalhados, mal organizado.

Para inserir verifique que no painel de “common” está visível.

Conteúdos

Frames (quadros): é outra maneira de organizar a conteúdo (é o mais

comum).aqui temos de ter cuidado de gravar todas as

frames pq cada frame será uma página simples.

Conteúdos Barra de navegação: serve para criar na página uma forma simples de navegar

no site. para isso temos de inserir um botão com o formato .gif

para montar na barra. feito isso vamos ao menu

“insert / interactive images / navigation bar”Menus popup:os menus popus (jump menu) oferecem outra forma de

navegação no site. para isso basta inserir um jump menu clicando em

“insert / form object/ jump menu”.

Conteúdos

Formulários: permite criar 1 formulário que é a forma dinâmica

e correcta de se comunicar com um visitante.é muito simples inserir um formulário basta

escolher as opcões:1. “Insert / form object/ text field”2. “Insert / form object/ butom”

Exercício

Fazer uma página pessoal ou institucional usando o Dreamweaver (ver exemplo).