Conhecendo o Dreamweaver 8

 

Objetivos:

 

Olá Pessoal,

 

Esta é a Parte 1 de uma série de tutoriais sobre o uso da ferramenta Dreamweaver. Nesta série de tutoriais você irá conhecer e aprenderá sobre configuração e uso do mesmo.

 

Pré-requisitos:

 

Para acompanhar esta lição, você deve ter base em webdesign, principalmente em FrontPage ou outra ferramenta de criação de home page.

 

O que é Dreamweaver?

 

O Dreamweaver é um programa para criação de paginas da web desenvolvido pela macromedia, que hoje faz parte do Adobe. Permite ao usuário de projetar, desenvolver e manter eficientemente web sites.

 

1. Área de Trabalho(Configurando o layout workspace)

 

Ao iniciar o Dreamweaver 8 pela primeira vez,  primeiro passo antes de começar a trabalhar com o dreamweaver 8 e a configuração do layout da área de trabalho, sendo da sua escolha. (Você terá que escolher uma opção, no caso de querer trocar o layout1 nas próximas vezes de acesso, esta opção encontra-se no menu window > workspace layout).

 

Na caixa de dialogo WorkScpace2 você terá duas opções: (observe a fig.1.0):

 

» Designer, onde você irá trabalhar diretamente com o layout da sua página, ou seja, a parte visual, como se fosse o modo normal do FrontPage, esse usado mais por iniciantes.

 

» Coder, onde você irá trabalhar juntamente com o código da sua página, digitando-os diretamente no Dremweaver, usado mais por profissionais avançados. Exemplos de códigos: HTML, ASP, PHP, JSP, etc.

 

Fig.1.0

 

1.1 Área de Trabalho (Conhecendo a Workspace)

 

A área de trabalho do Dreamweaver 8 apresenta todas as janelas e painéis em uma única janela maior do aplicativo.(Veja fig.1.1)

 

 

O Dreamweaver possui uma área de trabalho que pode ser adaptada tanto para usuários inciantes quanto para usuários avaçandos.

 

1.1.1 Conhecendo um a um

 

» Barra inserir: Possui botões para inserção de vários objetos, como, formulários, tabelas e uma imagem. Esses botões estão divididos em opções, são elas: Common, layout, forms, text, HTML, Application, Flash elements e Favorites.

 

 

» Barra de ferramenta do documento: Possui botões que permite alterar as formas de visualizações do documento: Code (Visualização do Código), Split (Visualização do Código e do projeto) e Design (Visualização do Projeto).

 

» Janela do Documento: Mostra o documento que está aberto atualmente.

 

» Grupo de Painéis: Painéis folhas de estilo, File, Application, tag inspetor.

 

» Painel Site: Visualizar a estrutura de arquivo do site.

 

» Inspetor de Propriedades: Permite verificar e editar as propriedades do elemento da página que estiver selecionado.

 

» Seletor de tags: Orientação de tags atuais, ou seja, onde está posicionado o cursor.

 

1.1.2 Ajustando o tamanho da janela do documento

 

Na barra de status da janela do documento encontram-se as dimensões atuais da mesma em pixels. Clicando no tamanho da janela exibirá o menu pop-up Tamanho da janela, onde você encontrará valores pré-definidos que lhe ajudarão a dimensionar a janela em um tamanho especifico.

 

 

1.1.3 Visualizações do Documento

 

O Dreamweaver, como citado acima, possui três modos de visualizações dos documentos, Code, Split e Design. Iremos agora conhecer cada um dele para que você analise e verifique qual modo você, mas se adapta.

 

Code: Iremos trabalhar digitando diretamente o código da página, desde o HTML até a linguagens avançadas como PHP, entre outros.

 

 

Split: Com esse tipo de visualização iremos além de digitarmos ou acompanharmos o código, também temos uma visualização parcial do layout do site, podendo também trabalhar com o layout.

 

 

Design: Com essa visualização iremos apenas trabalhar com o layout da pagina, não tendo contato direto com o código. Mais adequado para pessoas que estão iniciando;

 

 

Bom Pessoal, nessa tutorial iremos parar por aqui. Tratamos apenas do conhecimento do programa. Peço que voltem e acompanhe as outras que serão bem atrativas, trataremos de toda a manipulação do Dreamweaver, desde a configuração de um novo site até banco de dados, folhas de estilos e outras. Espero vocês na próxima, até mais.

 

Glossário:

 

Layout: é um esboço mostrando a distribuição física e tamanhos de elementos.

 

WorkSpace: Área de trabalho.

 

 

Hudson da Silva Sainça.

 

“Tá tudo na mente! Se é que você me entende

 

Tá tudo na mente! Quem sabe sabe, quem não sabe aprende

 

Tá tudo na mente! E o que tá nela ninguém tira da gente

 

Tá tudo na mente.” (Gabriel, O Pensador)

 

FRONTPAGE - BÁSICO Criação de Páginas para Internet - Introdução Criando o Primeiro Arquivo HTML DREAMWEAVER - BÁSICO Introdução ao Dreamweaver MX 2004 Projeto Web – Parte 01 Projeto Web – Parte 04 Projeto Web – Parte 03 Criação de Tabelas no Dreamweaver Dreamweaver Basico - Começando a usar o DreamWeaver Dreamweaver Basico - Configurações de Definição de Sites Dreamweaver Basico - Estruturação de Páginas - Usando Tabelas - Parte 1 Dreamweaver Basico - Estruturação de Páginas - Usando Tabelas - Parte 2 Dreamweaver Basico - Definição Básica do Design e Inserção de Conteúdo Dreamweaver Basico - Criação de Links Dreamweaver Basico - Configuração de Links Usando Tabelas no DreamWeaver Usando Imagens no Dreamweaver Usando Modelos no Dreamweaver Conhecendo o Dreamweaver 8 Usando comportamentos para criar um menu pop up no Dreamweaver Usando a paleta Behaviors do Dreamweaver - Parte 1 Usando Camadas Para Exibir Dicas de Formulários Fazendo um Site com Templates Prontos no Dreamweaver HTML BÁSICO HTML Básico - Introdução à Internet HTML Básico - Alinhamento de Texto HTML Básico - Cabeçalhos e Formatação de Texto HTML Básico - Formatação de Texto HTML Básico - Criação e configuração de links HTML Básico - Criando Listas Ordenadas e Listas de Definição HTML Básico - Criação de Links Internos e Externos HTML Básico - Criação de Links Externos E Links de E-mail HTML Básico - Inserindo Imagens na Página HTML Básico - Introdução à Tabelas HTML Básico - Criação de Formulários - Parte 1 HTML Básico - Criação de Formulários - Parte 2 DREAMWEAVER - PROGRAMAÇÃO PHP Galeria de Fotos com Efeito Lightbox Dinâmica Criando Sistema de Cadastro de Emails e Upload de Imagens (Parte 1) Criando Sistema de Cadastro de Emails e Upload de Imagens (Parte 2) Criando Sistema de Cadastro de Emails e Upload de Imagens (Parte Final) Alternando Cores da Tabela no Resultado de uma Consulta Como Criar um Contador de Visitas (Acessos) Criando Galeria de Fotos (Tiny SlideShow) Criando Ícone para URL Criando Recurso Imprimir Criando Sites Auto-Ajustáveis de Acordo com a Resolução Formulário de Contato com Envio de Dados por Email Galeria de Fotos com Efeito Lightbox e Upload Múltiplo de Imagens

CRIANDO UM APLICATIVO PARA UMA ACADEMIA Criando Aplicativo Para Academia - Parte 1 Criando Aplicativo Para Academia - Parte 2 Criando Aplicativo Para Academia - Parte 3 Criando Aplicativo Para Academia - Parte 4 Criando Aplicativo Para Academia - Parte 5 Criando Aplicativo Para Academia - Parte 6 Criando Aplicativo Para Academia - Parte Final WEBSPHERE Apresentando o WebSphere Application Server da IBM Instalação do WebSphere Application Server Configurando uma aplicação no WAS Configurando a segurança no WAS SISTEMA DE SALÃO DE BELEZA Sistema Salão de Beleza - Parte 1 Sistema Salão de Beleza - Parte 2 Sistema Salão de Beleza - Parte 3 Sistema Salão de Beleza - Parte 4 Sistema Salão de Beleza - Parte 5 Sistema Salão de Beleza - Parte 6 Sistema Salão de Beleza - Parte 7 Sistema Salão de Beleza - Parte 8 Sistema Salão de Beleza - Parte 9 Sistema Salão de Beleza - Parte 10 Sistema Salão de Beleza - Parte 11 Sistema Salão de Beleza - Parte 12 Sistema Salão de Beleza - Parte 13 Sistema Salão de Beleza - Parte 14 SISTEMA PARA GERENCIAMENTO DE IMÓVEIS Sistema Para Gerenciamento de Imóveis - Parte 01 Sistema Para Gerenciamento de Imóveis - Parte 02 Sistema Para Gerenciamento de Imóveis - Parte 03 Sistema Para Gerenciamento de Imóveis - Parte 04 Sistema Para Gerenciamento de Imóveis - Parte 05 Sistema Para Gerenciamento de Imóveis - Parte 06 Sistema Para Gerenciamento de Imóveis - Parte 07 Sistema Para Gerenciamento de Imóveis - Parte 08 Sistema Para Gerenciamento de Imóveis - Parte 09 Sistema Para Gerenciamento de Imóveis - Parte 10 Sistema Para Gerenciamento de Imóveis - Parte 11