Professional Documents
Culture Documents
l Bem-vindo ao Dreamweaver
l Exploração da área de trabalho
l Como planejar e configurar o seu site
l Como gerenciar o seu site
l Configuração de um documento
Bem-vindo ao Dreamweaver
Os recursos de edição visual do Dreamweaver permitem criar páginas, de modo rápido, sem
que seja necessário escrever uma única linha de código. É possível visualizar todos os
elementos ou propriedades do site e arrastá-los de um painel fácil de usar diretamente para um
documento. Dinamize o fluxo de trabalho de desenvolvimento de sites através da cria ção e
edição das imagens no Fireworks da Macromedia, em seguida importando para o Dreamweaver
ou incluindo objetos criados no Flash da Macromedia diretamente no Dreamweaver.
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 2 de 160
Introdução ao Dreamweaver
Onde iniciar
Convenções tipográficas
Novidades do Dreamweaver MX
Introduçã o ao Dreamweaver
Guia de introduçã o
O Guia de introdução foi elaborado para orientá-lo através dos procedimentos da criação de um
site da Web simples e funcional utilizando o Dreamweaver. O guia destina-se aos usuários que
já criaram páginas da Web, mas não estão familiarizados com alguns aspectos do
Dreamweaver. Inclui capítulos sobre a cria ção e edição de páginas est áticas simples, edi ção
manual de código e cria ção de aplicativos dinâmicos para a Web. Este guia é fornecido como um
manual impresso, que faz parte do sistema de ajuda, e também no formato de arquivo PDF.
Tutoriais
Os tutoriais contêm descrições mais detalhadas sobre determinados tópicos e fornecem mais
informações sobre áreas específicas do que o Guia de introdução. Ao trabalhar com os tutoriais,
você aprenderá a editar um exemplo de site da Web, utilizando alguns dos recursos mais
avançados e utilitários do Dreamweaver. Os tutoriais estão disponíveis no Guia de introdução
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 3 de 160
Se você já estiver familiarizado com os recursos de projeto do Dreamweaver mas quiser saber
mais sobre a cria ção de aplicativos para a Web, inicie executando os tutoriais de páginas
dinâmicas, que ensinam a criar p áginas interativas que se conectam a bancos de dados.
Ajuda do Dreamweaver
A ajuda do Dreamweaver, otimizada para uso on-line, contém informações completas sobre
todos os recursos do Dreamweaver. A ajuda do Dreamweaver é exibida no visualizador da
ajuda do sistema operacional: Ajuda HTML da Microsoft ou Apple Help (Macintosh). Em ambas
as plataformas, as informações necessárias podem ser encontradas de quatro maneiras:
Conteúdo permite exibir todas as informações organizadas por assunto. Clique nas entradas
de-nível superior para exibir os subtópicos.
Ajuda contextual possibilita abrir um tópico relevante da ajuda a partir de cada caixa de
diálogo, painel e inspetor. Para exibir a ajuda contextual, clique no botão Ajuda da caixa de
diálogo, escolha Ajuda no menu Opções, na barra de título de um grupo de painéis, ou clique no
ícone de ponto de interrogação em um inspetor ou outro tipo de janela.
Cada tópico da Ajuda contém botões que podem ser clicados para que se possa passar de um
tópico a outro. Os botões seta à direita e à esquerda levam ao pr óximo tópico ou ao anterior em
uma seção (de acordo com a ordem dos tópicos no conteúdo).
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 4 de 160
Para que o usu ário possa aproveitar ao máximo o Dreamweaver, é necessário consultar um
centro de suporte na Web: O site do Centro de suporte do Dreamweaver na Web, é atualizado
regularmente com as informações mais recentes sobre o Dreamweaver, além de conter
recomendações de usu ários experientes, exemplos, dicas, atualizações e informações sobre os
tópicos avançados. Verifique o site da Web com freqüência para conhecer as novidades sobre o
Dreamweaver e saber como obter o melhor rendimento do programa.
Atalhos de teclado
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 5 de 160
Há diversos métodos possíveis para se criar um site da Web. No fluxo de trabalho apresentado
nesta documentação, o usuário inicia definindo os objetivos e as estratégias do site. Se você
estiver desenvolvendo um aplicativo para a Web, ser á preciso configurar os servidores e bancos
de dados de acordo com a necessidade. Em seguida, o usuário projetará a aparência do site.
Quando o projeto estiver completo, serão criados o site e as páginas de c ódigo, adicionando o
conteúdo e a interatividade. Em seguida, as páginas ser ão vinculadas e a funcionalidade do site
será testada para verificar se atende aos objetivos definidos. É possível incluir também páginas
dinâmicas no site. No final do ciclo, o site é publicado em um servidor. Muitos programadores
efetuam ainda uma manuten ção periódica para assegurar que o site permaneça atualizado e
funcional.
Se você fizer parte de uma equipe de desenvolvimento da Web, os tópicos a seguir podem ser
de interesse:
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 6 de 160
Cada vez mais os sites da Web contêm páginas dinâmicas que permitem aos visitantes exibir as
informações armazenadas em bancos de dados. Além disso, alguns visitantes podem adicionar
e editar novas informações nos bancos de dados. Para criar essas páginas, é necessário
executar v árias etapas preparatórias.
Muitos projetos de design da Web começam pela criação de “roteiros” visuais ou fluxogramas
que se tornam páginas de exemplo. Utilize o Dreamweaver para criar páginas de exemplo ou
“protótipos” à medida que trabalha em um projeto final. Os protótipos-geralmente mostram o
layout do desenho, a navegação do site, os componentes técnicos, os temas, a cor e as
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 7 de 160
imagens gr áficas ou outros elementos de mídia, mas não contêm os elementos finais das
páginas.
Muitas páginas da Web são estáticas e contêm apenas texto e imagens. O Dreamweaver
permite ir além das páginas est áticas, adicionando interatividade e animações para atrair o
interesse dos visitantes. É possível fornecer comentários aos visitantes à medida que navegam
pelo site, demonstrar conceitos, animar elementos da p ágina. Em resumo, você poderá criar
uma maior interatividade com o visitante do site.
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 8 de 160
como o realce de um botão quando o visitante passar o ponteiro sobre ele, a validação de
um formul ário quando o visitante clique no botão Enviar ou a abertura de uma segunda
janela do navegador quando a página principal terminar de ser carregada. Consulte o
Como utilizar comportamentos JavaScript.
l Utilize as linhas de tempo para criar animações que dispensam plug-ins, controles ActiveX
ou Java. As linhas de tempo utilizam HTML dinâmico para alterar a posição de uma
camada ou a origem de uma imagem ao longo do tempo, ou para chamar certas a ções de
comportamento automaticamente após a carga da página. Consulte o Animação de
camadas.
Páginas individuais não compõem um site. É necessário vinculá-las através da cria ção de links
HTML e reutilizando conteúdo para que as páginas tenham uma aparência uniforme.
l Com o Dreamweaver, é possível criar links HTML padrão, incluindo links âncora e de
correio eletrônico ou configurar facilmente sistemas de navegação gr áfica, como menus
de salto e barras de navegação. Consulte o Links e navegação.
l Os modelos e arquivos de biblioteca do Dreamweaver permitem aplicar conteúdo
reutilizável e desenhos de páginas no site com facilidade. Novas páginas podem ser
criadas com base em um modelo do Dreamweaver e, em seguida, seu layout poderá ser
atualizado automaticamente quando o modelo for alterado. Consulte o Como gerenciar as
propriedades do site, bibliotecas e modelos.
O seu site está completo e pronto para ser publicado, mas antes de publicá-lo em um servidor é
necessário testá-lo. Dependendo do tamanho do projeto, das especificações do cliente e dos
tipos de navegadores que os visitantes utilizarão, talvez seja necessário mover o site para um
servidor de teste onde possa ser testado e editado. Depois que as correções forem feitas, o site
poderá ser publicado onde o público possa acessá-lo. Após a publicação do site, estabeleça um
ciclo de manutenção para assegurar a qualidade deste, responda aos comentários dos usuários
e atualize as informações do site.
l Para adicionar novas tags em uma página ou corrigir o seu código, utilize o painel
Referência do Dreamweaver, para pesquisar código JavaScript, CSS e HTML. Veja Acesso
a refer ências de linguagem.
l Utilize o Depurador JavaScript para ajudar a corrigir erros de JavaScript no seu c ódigo. O
depurador permite definir pontos de interrupção no c ódigo e, depois, visualizar o c ódigo
quando uma página for depurada no Dreamweaver. Veja Como utilizar o depurador
JavaScript.
l Execute verificações de navegador e plug-in, teste e corrija links em seus documentos e
execute relatórios de site para verificar arquivos HTML quanto a erros comuns. Consulte o
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 9 de 160
A página pode ser definida para exibir um ou muitos registros de uma s ó vez, mais de uma
página de registros, adicionar links especiais para que se possa passar de uma página de
registros à próxima (e retornar) e criar contadores de registros, para ajudar os usuários a
controlar os registros.
l Crie rapidamente páginas que efetuam buscas e modificam bancos de dados, além de
exibir os resultados da pesquisa. Consulte o Como criar páginas-mestras/detalhes, o
Como criar páginas que realizam buscas em bancos de dados e o Como criar páginas para
modificar bancos de dados.
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 10 de 160
l Ofere ça segurança restringindo o acesso às páginas. Consulte o Como criar páginas que
restringem o acesso ao site.
Onde iniciar
A Ajuda do Dreamweaver contém informações para os leitores em vários níveis. Para tirar o
melhor proveito desta documentação, inicie lendo as partes mais adequadas ao seu nível de
experiência.
1. Inicie lendo os dois primeiros capítulos do Guia de introdução: Introdução e Como criar
seu primeiro site da Web com o Dreamweaver. Se alguma seção desses capítulos lhe
parecer muito avançada ou complexa, ignore-a e volte a ela posteriormente.
2. Na ajuda do Dreamweaver, consulte o Exploração da área de trabalho, Como planejar e
configurar o seu site, Como gerenciar o seu site e Configuração de um documento.
3. Aprenda sobre layouts de páginas no Definição do layout de p áginas na visualização de
layout.
4. Para saber como formatar texto e incluir imagens nas páginas, consulte o Como inserir e
formatar texto e o Como inserir imagens.
5. Isso é tudo que você precisa para começar a produzir sites da Web de alta qualidade.
Quando estiver pronto para aprender a utilizar as ferramentas mais avançadas, poderá
continuar lendo os capítulos restantes sobre as páginas estáticas, na ordem em que são
apresentados. Talvez seja mais conveniente adiar a leitura dos capítulos sobre as páginas
dinâmicas para quando estiver mais familiarizado com a cria ção de páginas da Web.
1. Inicie lendo os dois primeiros capítulos do Guia de introdução: Introdução e Como criar
seu primeiro site da Web com o Dreamweaver.
2. Na ajuda do Dreamweaver, consulte o Exploração da área de trabalho para obter mais
detalhes sobre a interface do usuário do Dreamweaver.
3. Embora você esteja provavelmente familiarizado com grande parte do conteúdo em Como
planejar e configurar o seu site e Como gerenciar o seu site, examine esses capítulos para
saber como os conceitos já conhecidos são implementados no Dreamweaver. D ê atenção
especial às seções que tratam da utilização do Dreamweaver para configurar um novo
site.
4. Siga as etapas em qualquer tutorial que lhe interesse, para saber mais sobre como utilizar
o Dreamweaver para executar determinadas tarefas. Para exibir os tutoriais no sistema
de ajuda, escolha Ajuda> Tutoriais.
5. O Como inserir e formatar texto e o Como inserir imagens contêm informações úteis e
detalhadas sobre a utilização do Dreamweaver para criar páginas HTML básicas.
6. Consulte a visão geral, no início de cada um dos outros capítulos, para verificar se os
tópicos correspondentes são de seu interesse.
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 11 de 160
3. Embora você esteja provavelmente familiarizado com grande parte do conteúdo em Como
planejar e configurar o seu site e Como gerenciar o seu site, examine esses capítulos para
saber como os conceitos já conhecidos são implementados no Dreamweaver. D ê atenção
especial às seções que tratam da utilização do Dreamweaver para configurar um novo
site.
4. Para mais detalhes sobre codificação com o Dreamweaver, consulte o Configuração do seu
ambiente de codificação, Codificação no Dreamweaver, Otimização e depuração do código
e Edição do c ódigo na visualização do projeto.
5. Consulte a visão geral, no início de cada um dos outros capítulos, para verificar se os
tópicos correspondentes são de seu interesse.
1. Inicie pela leitura r ápida do Guia de introdução para familiarizar-se com os conceitos
básicos do Dreamweaver.
2. Na ajuda do Dreamweaver, consulte o Exploração da área de trabalho para obter mais
detalhes sobre a interface do usuário do Dreamweaver.
3. Embora você esteja provavelmente familiarizado com grande parte do conteúdo em Como
planejar e configurar o seu site e Como gerenciar o seu site, examine esses capítulos para
saber como os conceitos já conhecidos são implementados no Dreamweaver. D ê atenção
especial às seções que tratam da utilização do Dreamweaver para configurar um novo
site.
4. Siga as etapas em qualquer tutorial que lhe interesse, para saber mais sobre como utilizar
o Dreamweaver para executar determinadas tarefas. Para exibir os tutoriais no sistema
de ajuda, escolha Ajuda > Tutoriais.
5. Para configurar servidores da Web e de aplicativos utilizando o Dreamweaver, consulte o
Configuração de um aplicativo para a Web.
6. Conectar-se a um banco de dados. Dependendo da tecnologia de servidor utilizada pelo
servidor de aplicativos, consulte o Conexões de banco de dados para programadores
ColdFusion, Conexões de banco de dados para programadores ASP.NET, Conexões de
banco de dados para programadores ASP, Conexões de banco de dados para
programadores JSP ou Conexões de banco de dados para programadores PHP.
7. Consulte a visão geral, no início de cada um dos outros capítulos, para verificar se os
tópicos correspondentes são de seu interesse.
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 12 de 160
l Os itens de menu são mostrados neste formato: nome do menu > nome do item de
menu. Os itens nos submenus s ão mostrados neste formato: nome do menu > nome do
submenu > nome do item de menu.
l Fonte do código indica os nomes de tags e de atributos HTML, bem como o texto
utilizado nos exemplos.
l Fonte do código em itálico indica os itens substituíveis (às vezes denominados
metassímbolos) no c ódigo.
l Texto romano em negrito indica o texto a ser digitado exatamente conforme a indicação.
Novidades do Dreamweaver MX
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 13 de 160
O assistente de definiçã o de sites permite configurar o site de forma rápida é fácil, tanto
para criar um site dinâmico pela primeira vez quanto para configurar uma conta junto ao
provedor Internet.
Sugestões de código fornecem acesso fácil aos menus personalizados que mostram os
atributos de tags adequados, às propriedades dos m étodos, aos parâmetros das funções e aos
estilos CSS durante a edição na visualização de c ódigo.
A barra de ferramentas do documento poder ser agora personalizada para atender às suas
necessidades e preferências, utilizando XML e JavaScript.
Painel de respostas estabelece a conexão direta com os recursos on-line do Centro de suporte
da Macromedia. É possível recuperar novos conteúdos à vontade, para garantir o seu acesso
freqüente às mais recentes dicas e truques.
Sinalizaçã o da sintaxe por cores pode ser agora inteiramente configurada e personalizada,
de acordo com as suas necessidades.
A barra de ferramentas padrão permite o acesso rápido aos comandos utilizados com
freqüência (Abrir, Salvar e Novo) e da área de trabalho.
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 14 de 160
Crie com rapidez aplicativos para a Web dinâmicos e orientados para banco de dados,
manualmente ou utilizando objetos visuais e comportamentos.
Bibliotecas de código do servidor para ColdFusion, ASP, ASP.NET, JSP e PHP permitem
criar visualmente sites da Web dinâmicos, utilizando todas as tecnologias de servidor mais
avançadas. Utilize um ambiente de desenvolvimento para integrar-se a vários sites e
tecnologias de especializadas.
O painel Trechos permite armazenar partes de código arbitrárias, para utilização posterior. É
possível reutilizar c ódigo, layouts e funções complexas.
O banco de dados de tags com base em XML personaliz ável armazena informa ções sobre
a estrutura de todas as tags disponíveis. Esse mecanismo centralizado de armazenamento de
informações permite que os recursos, como as sugestões de código, o seletor de tags e o
inspetor de tags, funcionem com as tags importadas originais e personalizadas.
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 15 de 160
Visualize as informações sobre vari áveis, consultas e outras estatísticas importantes de páginas,
e vá direto para as áreas problemáticas, sem sair do ambiente de desenvolvimento.
Suporte a RDS permite transferir arquivos de/para e examinar a estrutura dos bancos de
dados nos servidores ColdFusion, utilizando as conexões RDS.
Bibliotecas de tags JSP ajudam os programadores a suprimir a lógica do servidor das páginas
JSP. O Dreamweaver MX pode importar as informações da biblioteca de tags JSP dos arquivos
TLD (Tag Library Descriptor, descritor de biblioteca de tags) e torná-las disponíveis nas
sugestões de código, no seletor de tags e no inspetor de tags.
Análise completa dos componentes de software reutiliz áveis para Java mostra os
métodos getProperty e setProperty dos componentes de software reutilizáveis para Java no
painel Ligações, além de poder exibir todos os métodos e propriedades destes no painel
Componentes do servidor, permitindo que os programadores integrem completamente os
componentes de software reutilizáveis aos aplicativos JSP.
Objetos de formulário dinâmicos permitem criar listas de seleção orientadas para banco de
dados e outros elementos de formul ário, através da simples escolha do objeto de formulário
adequado na barra Inserir.
Crie sites da Web compatíveis com os padrões mais recentes da Web, incluindo XML e serviços
da Web, e mantenha seus recursos atualizados com as tecnologias de desenvolvimento mais
avançadas.
Análise dos serviços da Web para ASP.NET, ColdFusion e Java permite examinar e
interagir com os padrões mais recentes de serviços da Web com base em XML, em todas as
tecnologias de servidor mais avançadas. Incorpore funcionalidades complexas aos seus
aplicativos para a Web, utilizando o recurso de análise dos serviços da Web no Dreamweaver
MX.
Suporte aprimorado às CSS, incluindo a integra ção TopStyle ajuda a criar sites
compatíveis com os padrões mais recentes de folhas de estilos CSS. O painel Estilos CSS do
Dreamweaver MX foi aperfeiçoado para mostrar os estilos definidos interna e externamente,
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 16 de 160
além de permitir o uso das folhas de estilo na fase de projeto. Também é oferecido suporte a
muitas novas construções de CSS2. O inspetor de propriedades do texto também pode ser
utilizado na aplicação de estilos CSS.
Suporte a XHTML permite garantir que os sites estão atualizados de acordo com os padr ões
mais recentes de desenho HTML, configurando o Dreamweaver MX para gerar código compatível
com XHTML. Além disso, converte rapidamente arquivos HTML mais antigos em XHTML,
utilizando o conversor de XHTML.
Opção de acessibilidade para gerar c ódigos compatíveis auxilia durante o ciclo de edição
para assegurar que o conteúdo que está sendo criado atenda às instruções de acessibilidade.
Configure o Dreamweaver para solicitar atributos específicos, relacionados à acessibilidade,
quando as tags e os objetos adequados forem inseridos na página.
Inspetor de tags para exibir XML, HTML e CFML permite ver a estrutura de um documento
com rapidez e facilidade. É possível detectar e eliminar rapidamente aninhamentos e rela ções
principais indevidos, sem ter que examinar o c ódigo-fonte original.
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 17 de 160
A especifica çã o HTML 4.01 é o documento oficial para HTML do World Wide Web Consortium.
Índice DOT HTML é uma lista completa de tags, atributos e valores HTML, bem como sua
compatibilidade com os diversos navegadores.
O site XML.com da O'Reilly fornece informa ções, tutoriais e dicas sobre a Extensible Markup
Language (XML), assim como outras tecnologias da Web.
As especifica ções para o nível 1 das Cascading Style Sheets (CSS1) e para o nível 2
(CSS2) são os documentos oficiais para as folhas de estilo do World Wide Web Consortium.
Guia de referência das folhas de estilos da Web Review explica o que são os estilos CSS e
em quais navegadores funcionam.
As páginas Visão geral das ASP da Microsoft contêm informações sobre as Active Server
Pages (ASP).
Tabela de entidades apresenta uma lista dos nomes de entidades utilizadas pelo padrão ISO
8859-1 (Latin-1).
A JavaScript Bible, de autoria de Danny Goodman (IDG Books), traz informações sobre a
linguagem JavaScript 1.2 de maneira detalhada.
“CGI Scripts for Fun and Profit ” é um artigo do site Hotwired Webmonkey sobre a inclusão
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 18 de 160
Para obter o máximo de sua experiência com o Macromedia Dreamweaver MX, é necessário
compreender os conceitos básicos inerentes à á rea de trabalho do Dreamweaver e saber como
escolher as opções, utilizar os inspetores e painéis, e definir as preferências mais adequadas ao
seu estilo de trabalho.
Esta seção descreve os elementos básicos da área de trabalho no Windows e explica como
escolher um layout inicial para a mesma.
Na primeira vez que o Dreamweaver é iniciado, aparece uma caixa de di álogo que permite
escolher um layout de área de trabalho. Caso você mude de idéia posteriormente, é possível
alternar para uma área de trabalho diferente utilizando a caixa de diálogo Preferências.
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 19 de 160
Nota: Na maior parte do sistema de ajuda, presume-se que está sendo utilizada a área de
trabalho integrada do Dreamweaver MX.
Nota: Os grupos de painéis podem ser encaixados em ambos os lados da área de trabalho, em
qualquer dos layouts de área de trabalho.
Para alternar para uma área de trabalho diferente da que foi escolhida:
Será exibida uma mensagem de alerta informando que o novo layout ser á mostrado após
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 20 de 160
o reinício do Dreamweaver.
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 21 de 160
Os usuários do Windows podem alternar para essa área flutuante de trabalho utilizando a caixa
de diálogo Preferências; para obter mais informações, veja Escolha de um layout de área de
trabalho.
Para ter uma vis ão geral resumida das janelas e painéis, veja Sobre as janelas e os painéis .
Para obter mais detalhes sobre janelas e painéis específicos, veja Utilização de janelas e painéis
no Dreamweaver.
No layout da área de trabalho no estilo do Dreamweaver 4, cada documento está em sua janela
individual. Os grupos de painéis são inicialmente encaixados juntos, mas podem ser separados
e colocados em suas próprias janelas.
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 22 de 160
Na área flutuante de trabalho, as janelas se encaixam automaticamente umas nas outras, nas
laterais da tela e na janela do documento, à medida que são arrastadas ou redimensionadas.
Essa característica facilita o deslocamento e a organização dos diversos painéis e janelas
flutuantes no Dreamweaver.
Os usuários do Windows podem alternar para uma área de trabalho integrada em uma única
janela utilizando a caixa de diálogo Preferências; para obter mais informações, veja Utilização
da área de trabalho do Dreamweaver.
Para ter uma vis ão geral resumida das janelas e painéis, veja Sobre as janelas e os painéis .
Para obter mais detalhes sobre janelas e painéis específicos, veja Utilização de janelas e painéis
no Dreamweaver.
Esta seção descreve resumidamente alguns elementos que aparecem nos layouts de áreas de
trabalho integradas e flutuantes. Para obter mais informações sobre janelas e painéis
específicos, veja Utilização de janelas e painéis no Dreamweaver.
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 23 de 160
A janela Bem-vindo contém dicas sobre a configura ção da área de trabalho, para diversos
objetivos, e informações sobre os novos recursos, para as pessoas que utilizaram as vers ões
anteriores do Dreamweaver.
A barra Inserir contém botões para inserção de v ários tipos de “objetos”, como imagens,
tabelas e camadas em um documento. Cada objeto é uma parte do código HTML, que permite
ao usuário definir vários atributos à medida que são inseridos. Por exemplo: é possível inserir
uma imagem clicando no ícone de Imagem, na barra Inserir. Se preferir, inclua os objetos
utilizando o menu Inserir em vez da barra Inserir.
A barra de ferramentas padrão (que não é exibida no layout padrão da área de trabalho)
contém botões para executar operações comuns dos menus Arquivo e Editar: Novo, Abrir,
Salvar, Salvar como, Salvar tudo, Recortar, Copiar, Colar, Desfazer e Refazer. Para exibir a
barra de ferramentas padrão, escolha Exibir> Barras de ferramentas> Padrão.
Os grupos de pain éis são conjunto vejas de painéis relacionados, agrupados sob um
cabeçalho. Para expandir um grupo de painéis, clique na seta de expansão, à esquerda do nome
do grupo; para desanexar um grupo de painéis, arraste a pinça, na extremidade esquerda da
barra de título do grupo.
O painel Site permite gerenciar os arquivos e as pastas que compõem o site. Para obter mais
informações, veja Sobre o painel Site. Esse painel também possibilita a exibição de todos os
arquivos no disco local, como no Windows Explorer.
A barra do Iniciador (não é exibida no layout padrão de área de trabalho) exibe botões na
barra de status para abrir e fechar os painéis e inspetores utilizados com mais freqüência. Para
exibir a barra do Iniciador e especificar os ícones que ela mostrará, veja Definição das
preferências dos painéis .
O Dreamweaver fornece muitos outros painéis, inspetores e janelas que não s ão mostrados
nesta seção, como o painel Histórico e o inspetor de código. A maioria dos painéis pode ser
reunida em grupos de painéis. Para abrir os painéis, inspetores e janelas do Dreamweaver,
utilize o menu Janela. Uma marca de seleção próxima a um item, no menu Janela, indica que
ele está aberto (embora possa estar oculto atr ás de outras janelas). Para exibir um item que
não esteja aberto, escolha o nome do item no menu.
Se um painel, inspetor ou janela, que estiver marcado como aberto, não puder ser localizado,
escolha Janela > Organizar os painéis para posicionar todos os painéis abertos.
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 24 de 160
Esta seção explica como utilizar v árias janelas, barras de ferramentas, painéis, inspetores
específicos e outros elementos da área de trabalho do Dreamweaver.
Janela do documento
A janela do documento mostra o documento que está aberto. É possível escolher uma das
seguintes visualizações:
Para alternar rapidamente entre as duas visualizações, pressione Control+sinal de til (~).
Quando a janela do documento contém uma barra de título, esta exibirá o título da página e,
entre parênteses, o nome e caminho do arquivo. Após o nome do arquivo, o Dreamweaver
exibe um asterisco, se tiverem sido feitas alterações ainda não salvas.
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 25 de 160
O seletor de tags mostra a hierarquia das tags que envolvem a seleção atual. Clique em
qualquer tag na hierarquia para selecioná-la e exibir todo o seu conteúdo. Clique na tag <body>
para selecionar o corpo inteiro do documento. Para definir os atributos class ou id de uma tag,
no seletor de tags, clique com o botão direito do mouse na tag e escolha uma classe ou
identificação no menu contextual.
Para obter informações sobre a criação de um novo documento e como utilizar os documentos
pré-desenhados, fornecidos com o Dreamweaver, consulte o Configuração de um documento.
A barra de status exibe as dimensões atuais da janela do documento (em pixels). Para definir
um tamanho de janela caiba em qualquer um dos v ários tamanhos de monitores comumente
utilizados, clique no tamanho da janela e escolha um tamanho no menu pop-up Tamanho da
janela. Para redimensionar de modo menos preciso, utilize os métodos padrão do sistema
operacional de ajuste de janelas, por exemplo: arrastar o canto inferior direito da janela. Na
área de trabalho integrada do Windows, é possível maximizar uma janela de documento para
que ela preencha totalmente a área do documento da janela integrada.
Nota: Não é possível redimensionar uma janela de documento que estiver maximizada na área
de trabalho integrada.
Quando a janela do documento está maximizada, as guias aparecem na parte inferior da área
da janela do documento, mostrando os nomes de arquivos de todos os documentos que
estiverem abertos. Para alternar para um documento, clique na sua respectiva guia.
Para criar uma página cuja aparência seja melhor em um determinado tamanho, é possível
ajustar a janela do documento para qualquer um dos tamanhos predeterminados, editá-los ou
criar novos tamanhos.
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 26 de 160
Escolha um dos tamanhos no menu pop-up situado na parte inferior da janela do documento.
Para que a janela do documento se ajuste apenas a uma largura específica (mantendo a
altura inalterada), selecione um valor de altura e exclua-o.
3. Clique na caixa de texto Descrição, para digitar um texto descritivo sobre um determinado
tamanho.
4. Clique em OK para salvar a altera ção e retornar à janela do documento.
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 27 de 160
Para definir as preferências da barra de status, escolha Editar > Preferências e selecione Barra
de status, na lista de categorias, à esquerda. Para obter mais informações, veja Sobre a barra
de status.
A barra do Iniciador é mostrada na barra de status e contém botões para abrir e fechar vários
painéis, inspetores e janelas.
Para exibir a barra do Iniciador, ative a opção Mostrar os ícones nos painéis e no Iniciador, nas
preferências dos painéis. É possível especificar quais itens serão exibidos na barra do Iniciador.
Para obter mais informações, veja Definição das preferências dos pain éis.
Para exibir ou ocultar a barra de ferramentas do documento, escolha Exibir > Barras de
ferramentas > Documento.
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 28 de 160
l Título permite digitar um título para o documento, que será exibido na barra de título do
navegador.
l Navegaçã o do código permite navegar pelo c ódigo JavaScript. Para obter mais
informações, veja Como utilizar o depurador JavaScript .
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 29 de 160
Para obter mais informações sobre as op ções da visualização de c ódigo, veja Definição de
preferências de visualização.
As opções da visualização do projeto permitem ocultar todos os auxílios visuais (por ex.:
tabelas, camadas e bordas da moldura) de uma s ó vez, ou mostrar e ocultar aux ílios
individuais, conforme a preferência. Essas opções também possibilitam exibir o conteúdo
do cabeçalho e as guias visuais. Para obter mais informações sobre essas opções, que
também se encontram no menu Exibir, veja Sele ção de elementos na janela do
documento, Visualização e edição do conteúdo do HEAD e Utilização de guias visuais no
processo de projeto.
A barra de ferramentas padrão contém botões para executar opera ções comuns dos menus
Arquivo e Editar: Novo, Abrir, Salvar, Salvar como, Salvar tudo, Recortar, Copiar, Colar,
Desfazer e Refazer. Utilize esses botões da mesma forma que os comandos equivalentes nos
menus. Para obter mais informações sobre as opera ções Abrir e Salvar, consulte o Configuração
de um documento.
Para exibir a barra de ferramentas padrão, escolha Exibir > Barras de ferramentas > Padrão.
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 30 de 160
A barra Inserir contém botões para criar e inserir objetos, como tabelas, camadas e imagens.
Os botões estão organizados em guias.
Escolha Janela>Inserir.
l Para mudar a posição da barra Inserir de horizontal para vertical, clique no ícone de
orientação vertical, próximo ao canto superior direito.
l Para mudar a posição da barra Inserir, de vertical para horizontal, clique no ícone de
orientação horizontal, pr óximo ao canto inferior direito.
l Se a barra Inserir estiver configurada com as guias na horizontal, clique em uma guia.
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 31 de 160
Dependendo do objeto, poderá ser exibida uma caixa de di álogo de inserção de objeto
correspondente, solicitando a busca um arquivo ou parâmetros específicos a um objeto.
Por exemplo: para inserir um alocador de espaço de uma imagem sem especificar um arquivo
de imagem, pressione Control e clique no botão Imagem.
Nota: Esse procedimento não ignora todas as caixas de di álogo de inserção de objeto. Muitos
objetos, inclusive as barras de navegação, camadas, bot ões Flash e conjuntos de molduras, não
inserem alocadores de espaço ou objetos com valor padrão.
A barra Inserir contém várias guias: Comuns, Layout, Texto, Tabelas, Molduras, Formulários,
Modelos, Caracteres, Mídia, Cabeçalho, Script e Aplicativo. S ão exibidas guias adicionais quando
o documento que estiver em exibição contiver código do servidor, como documentos ASP ou
CFML.
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 32 de 160
Nota: Embora alguns botões na guia Texto sejam semelhantes aos encontrados no
inspetor de propriedades, suas funções são diferentes. Os botões na guia Texto servem
apenas para inserir c ódigo e não refletem o estado atual da seleção; se a sele ção contiver
texto em negrito, o botão Negrito, no inspetor de propriedades, será exibido como
selecionado, enquanto que o mesmo botão na guia Texto não estará ativado.
l As guias de c ódigo do servidor, disponíveis apenas para as páginas que utilizam uma
determinada linguagem de servidor, incluem ASP , ASP.NET, CFML Basic, CFML Flow,
CFML Advanced, JSP e PHP. Cada uma dessas guias fornece objetos de código do
servidor, que podem ser inseridos na visualização de código.
Se apenas alguns objetos estiverem visíveis em uma determinada guia, será mostrada uma
pequena seta no canto inferior esquerdo da barra Inserir; para exibir os outros objetos da guia,
clique na seta.
Alguns objetos, como as âncoras com nome, não estão visíveis quando a página é exibida na
janela do navegador. Para exibir os ícones que marcam os locais desses objetos invisíveis na
visualização do projeto, escolha Exibir > Auxílios visuais > Elementos invis íveis. Para selecionar
os objetos invisíveis na visualização do projeto, clique em seus respectivos ícones. Para obter
mais informações, veja Sobre os elementos invisíveis.
Algumas das definições de preferências gerais afetam a barra Inserir. Para modificá-las, escolha
Editar > Prefer ências e selecione Geral na lista de categorias à esquerda.
l Ao inserir objetos, como imagens, tabelas, scripts e elementos head, uma caixa de
diálogo solicitará informações adicionais. As caixas de diálogo podem ser suprimidas,
desativando a opção Mostrar a caixa de diálogo ao inserir objetos ou mantendo
pressionada a tecla Control durante a criação do objeto. Quando o objeto é inserido com
essa opção desativada, são conferidos valores de atributos padrão ao objeto. Utilize o
inspetor de propriedades para alterar as propriedades do objeto após a inserção.
l A opção barra Inserir permite exibir o seu conteúdo apenas como ícones, texto, ou texto e
ícones.
É possível modificar qualquer objeto na barra Inserir ou criar os seus próprios objetos; veja
“Customizing Dreamweaver”, no Centro de suporte da Macromedia.
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 33 de 160
Para obter mais informações, veja Como adicionar comportamentos de servidor a uma página.
Quebra de linha insere uma quebra de linha (br) no ponto de inserção. Também é possível
pressionar Shift+Enter para inserir uma quebra de linha.
A guia Comuns, na barra Inserir, permite inserir os objetos utilizados mais comumente.
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 34 de 160
Âncora com nome coloca uma âncora com nome ( a name="") no ponto de inser ção. Será
exibida uma caixa de di álogo; digite o nome da âncora. Veja Estabelecimento de um link a um
local específico de um documento.
Tabela coloca uma tabela no ponto de inserção. Consulte o Apresentação do conteúdo com
tabelas.
Desenhar camada cria uma camada. Clique no botão Camada e, em seguida, mova o ponteiro
para a janela do documento e arraste, para definir o tamanho e a posição da camada. Como
padrão, o Dreamweaver cria uma camada definida pela tag div. Utilize o inspetor de
propriedades para selecionar uma outra tag ou alterar a configuração padrão nas preferências
de camadas. Veja Cria ção de camadas na página.
Imagem insere uma imagem no ponto de inserção. Será exibida uma caixa de diálogo, para
que se possa especificar um arquivo de imagem. Veja Como inserir uma imagem.
HTML do Fireworks coloca um arquivo HTML produzido pelo Fireworks no ponto de inserção.
Consulte o Integração do Dreamweaver com outros aplicativos.
Régua horizontal coloca uma régua horizontal no ponto de inserção. Veja Utilização de r éguas
horizontais.
Data coloca a data atual no ponto de inserção. É exibida uma caixa de diálogo na qual se pode
especificar um formato de data e indicar se o Dreamweaver deverá atualizar automaticamente a
data quando o arquivo for salvo. Veja Como inserir datas.
Dados tabulares cria uma tabela no ponto de inserção, preenchida com os dados tabulares
extra ídos de um arquivo de texto delimitado (por ex.: um arquivo exportado do Microsoft Excel
ou de um banco de dados). Veja Como importar dados tabulares.
Seletor de tags permite escolher uma tag em uma hierarquia de tags categorizadas, para
inseri-la. Veja Como inserir tags com o Seletor de tags.
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 35 de 160
Na barra Inserir, a guia Formulários contém botões para criar formul ários e inserir os elementos
do formul ário.
Para inserir um elemento de formulário, coloque o ponto de inserção dentro dos limites de um
formul ário; os elementos de formulário situados fora das tags form não aparecerão em todos os
navegadores. Ao tentar inserir um elemento de formul ário fora de um formulário, uma caixa de
diálogo perguntará se você deseja adicionar uma tag ao redor do elemento; clique em Sim,
para criar um novo formulário contendo o elemento, ou em Não, para inserir o elemento fora de
um formul ário.
Campo de texto coloca um campo de texto no ponto de inserção. Defina o nome, tamanho e
valor inicial no inspetor de propriedades. Veja Definição do inspetor de propriedades do campo
de texto.
Campo oculto coloca um campo oculto no ponto de inserção. Defina o nome e valor no
inspetor de propriedades. Veja Como criar um campo oculto.
Área de texto insere um campo de texto com v árias linhas no ponto de inserção.
Grupo de botões de rádio insere um grupo de botões de opção no ponto de inser ção.
Menu de lista coloca uma lista ou menu pop -up no ponto de inserção. Defina o nome, tipo e
valores da lista no inspetor de propriedades. Veja Definição das opções do inspetor de
propriedades de lista/menu.
Nota: O termo menu pop-up pode ser aplicado a pelo menos dois diferentes objetos no
Dreamweaver. Esse objeto insere um campo de menu pop-up em um formulário, para que o
visitante de um site possa escolher um valor quando preencher um formul ário. Para obter
informações sobre a inserção de um menu pop-up para navegação gráfica, veja Mostrar o menu
pop-up.
Menu de salto coloca um menu pop-up de URLs no ponto de inserção. A escolha de um valor
nesse menu levará o usuário à URL. Defina a lista de valores na caixa de diálogo que for
exibida. Veja Criação de menus de salto.
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 36 de 160
Botão coloca um botão com name e value padrão “Enviar” no ponto de inserção. Para inserir
um botão, coloque o ponto de inserção dentro dos limites de um formulário; os botões situados
fora dos formulários não aparecerão em todos os navegadores. Utilize o inspetor de
propriedades para definir o nome, identificador e a ação. Veja Definição das opções do inspetor
de propriedades de Botão.
Conjunto de campos é uma tag de conten ção para um grupo lógico de elementos do
formul ário.
Na barra Inserir, a guia Molduras contém botões para criar layouts comuns de conjuntos de
molduras. Veja Utilização de molduras.
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 37 de 160
Na barra Inserir, a guia Head contém objetos para adicionar elementos à seção head dos
documentos.
Meta insere uma tag meta na se ção head do documento. Será exibida uma caixa de diálogo, na
qual é possível digitar informações relativas aos atributos meta . Veja Definição de propriedades
meta.
Palavras-chave insere uma tag meta name="keywords" na se ção head do documento. Será
exibida uma caixa de diálogo, na qual é possível digitar as palavras-chave relacionadas ao
documento. Veja Definição de propriedades de palavras-chave.
Descriçã o insere uma tag meta de descrição na se ção head do documento. Será exibida uma
caixa de diálogo, na qual é possível digitar o texto que descreve o documento. Veja Definição de
propriedades de descrição.
Atualizar insere uma tag meta de atualização na se ção head do documento. Será exibida uma
caixa de diálogo, na qual é possível digitar o número de segundos que se deve aguardar até
que seja efetuada a atualização, assim como a instrução para recarregar a página atual ou ir
até outra página. Veja Definição de propriedades de atualização.
Base insere uma tag base na se ção head do documento. Será exibida uma caixa de diálogo na
qual é possível digitar uma URL básica dos links do documento. Veja Definição de propriedades
de base.
Link insere uma tag link na seção head do documento. Será exibida uma caixa de diálogo, na
qual é possível digitar informações relativas aos links. Observe que esse link não é de
hipertexto; ele é utilizado com mais freqüência para especificar uma folha de estilos externa.
Veja Definição de propriedades de link.
Na barra Inserir, a guia Layout permite exibir as tabelas nas visualizações padrão ou de layout.
Na visualização de layout, é possível desenhar células e tabelas de layout.
Tabela coloca uma tabela no ponto de inserção. Veja Apresentação do conteúdo com tabelas.
Desenhar camada cria uma camada. Clique no botão Camada e, em seguida, mova o ponteiro
para a janela do documento e arraste, para definir o tamanho e a posição da camada. Como
padrão, o Dreamweaver cria uma camada definida pela tag div. Utilize o inspetor de
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 38 de 160
propriedades para selecionar uma outra tag ou alterar a configuração padrão nas preferências
de camadas. Veja Cria ção de camadas na página.
Visualizaçã o padrão exibe as tabelas como uma grade de linhas. Veja Sobre as células e
tabelas de layout.
Visualizaçã o de layout exibe as tabelas como caixas que podem ser desenhadas, arrastadas e
redimensionadas. Veja Sobre as células e tabelas de layout.
Na barra Inserir, a guia Mídia contém botões para inserir objetos especiais configuráveis, como
plug-ins e applets.
Flash coloca um filme Flash no ponto de inserção, utilizando as tags object e embed. Será
exibida uma caixa de diálogo, na qual é possível procurar os arquivos de filmes. Os atributos
codebase, class id e pluginspage foram predefinidos com os valores adequados ao
Macromedia Flash Player; utilize o inspetor de propriedades para especificar outros atributos do
filme. Veja Definição de propriedades de filme Flash e Shockwave .
Botão Flash e Texto Flash colocam os objetos Flash no ponto de inser ção. Veja Como inserir
um objeto de bot ão Flash e Como inserir um objeto de texto Flash.
Applet coloca um applet Java no ponto de inserção (o applet Java aparecerá apenas quando o
documento for exibido em um navegador). É exibida uma caixa de diálogo na qual você pode
especificar o arquivo que contém o código do applet, ou clique em Cancelar para manter a
origem sem especificação. Utilize o inspetor de propriedades para especificar as outras
propriedades do applet Java. Veja Definição de propriedades de applets Java.
Param insere uma tag que permite transferir os parâmetros para um applet ou objeto.
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 39 de 160
Plug-in utiliza a tag embed para inserir, no ponto de inserção, um arquivo que requer um plug-
in do Netscape Navigator para sua execução. É exibida uma caixa de diálogo na qual é possível
especificar o arquivo de origem. Veja Definição de propriedades de plug-ins do Netscape
Navigator.
Na barra Inserir, a guia Script permite inserir elementos de cria ção de script em uma p ágina.
Script coloca um script no ponto de inserção. É exibida uma caixa de diálogo; escolha uma
linguagem e digite o texto do script. Veja Edição de scripts.
Diferente de script insere uma seção noscript, para que o código HTML seja exibido nos
navegadores cuja criação de scripts tenha sido desativada.
Server-Side Include coloca uma inclusão do servidor no ponto de inserção. É exibida uma
caixa de diálogo na qual é possível escolher o arquivo de origem da inclusão. Veja Como
trabalhar com inclusões do servidor.
Tabela coloca uma tabela no ponto de inserção. É exibida uma caixa de diálogo que permite
especificar os atributos da tabela, como o número de linhas e de colunas. Veja Apresentação do
conteúdo com tabelas.
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 40 de 160
Na barra Inserir, a guia Modelos permite salvar um documento como um arquivo de modelo e
inserir v ários tipos de regiões nesse arquivo.
Na barra Inserir, a guia Texto permite inserir as tags de formatação de texto e de parágrafo.
Nota: Embora alguns botões na guia Texto sejam semelhantes aos encontrados no inspetor de
propriedades, suas funções são diferentes. Os botões na guia Texto servem apenas para inserir
código e não refletem o estado atual da seleção; se a sele ção contiver texto em negrito, o botão
Negrito, no inspetor de propriedades, será exibido como selecionado, enquanto que o mesmo
botão na guia Texto não estará ativado.
Editor de tags de fonte exibe o editor da tag da fonte, permitindo definir atributos antes da
inser ção da mesma. Veja Edi ção de tags utilizando editores de tags.
Lista não-ordenada, Lista ordenada e Item da lista colocam as tags de lista HTML
correspondentes em volta da seleção.
Lista de definições, Termo de defini ção e Descrição da definiçã o colocam as tags de lista
de defini ções HTML correspondentes em volta da seleção.
Abreviaçã o e Sigla inserem tags que permitem especificar o texto completo de uma
abreviação ou sigla, para beneficiar potencialmente os mecanismos de busca, as leitoras de
tela, etc.
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 41 de 160
Utilizaçã o da barra Inserir: ASP, ASP.NET, CFML Basic, CFML Flow, CFML Advanced,
JSP e PHP
Na barra Inserir, as guias relativas ao c ódigo do servidor contêm botões para inserir partes
úteis de código em várias linguagens de servidor. Cada uma das guias está disponível apenas
nos documentos que utilizam uma determinada linguagem de servidor. Nessas guias, os objetos
mais complexos fornecem caixas de diálogo com bot ões de ajuda; para obter informaçõ es sobre
esses objetos, clique no botão Ajuda.
Dica: Em alguns casos, é possível que certas propriedades incomuns não apare çam, mesmo no
inspetor de propriedades expandido; nesses casos, utilize o inspetor de código ou a visualização
de c ódigo, para codificar essas propriedades manualmente, ou selecione a tag na visualização
de c ódigo e escolha Modificar > Editar a tag.
No Dreamweaver, os painéis são reunidos em grupos de painéis. Cada grupo pode ser
expandido ou reduzido, e encaixado ou separado de outros grupos de painéis. Os grupos de
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 42 de 160
painéis também podem ser encaixados na janela integrada do aplicativo (apenas na área de
trabalho integrada do Windows). Esse recurso facilita o acesso aos painéis necessários sem
desorganizar a área de trabalho. Em um grupo, os painéis são mostrados como guias.
Nota: Quando um grupo de painéis é flutuante (separado), aparece uma barra vazia estreita na
parte superior do grupo de painéis. Nesta documentação, o termo “barra de título do grupo de
painéis ” refere -se à á rea na qual o nome do grupo de painéis é mostrado, e não à barra vazia
estreita.
Arraste o grupo de painéis pela respectiva pinça (no lado direito da barra de título do grupo de
painéis) até que o contorno indique que ele não está mais anexado.
Arraste o grupo de painéis utilizando a pinça, até que o seu contorno indique que ele não está
mais anexado.
A maioria dos painéis pode ser encaixada apenas à esquerda ou à direita da janela do
documento na área de trabalho integrada, enquanto os outros (como o inspetor de
propriedades e a barra Inserir) podem ser encaixados somente nas partes superior e inferior da
janela integrada.
Arraste o grupo de painéis pela barra situada acima da barra de título. O grupo de painéis não
será encaixado encaixado, contanto que não seja arrastado pela respectiva pinça.
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 43 de 160
Dica: Algumas opções estão disponíveis no menu contextual do grupo de painéis mesmo
quando o grupo for reduzido; clique com o botão direito do mouse na barra de título do grupo
de painéis para exibir o menu contextual.
Arraste o painel pela respectiva guia até que o seu contorno indique que ele não está mais
encaixado.
Arraste o painel pela respectiva guia até que o seu contorno indique que ele está encaixado.
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 44 de 160
No menu Opções da barra de título do grupo de painéis, escolha Fechar o grupo de painéis.
Utilize as preferências de painéis para especificar quais painéis e inspetores sempre aparecerão
em primeiro plano na janela do documento e quais ser ão ocultados por essa janela. As
preferências de painéis também podem ser utilizadas para especificar se os ícones ser ão
mostrados nas guias dos painéis, se a barra do Iniciador será exibida e quais painéis e
inspetores ela conterá.
Para definir as preferências dos pain éis, escolha Editar > Preferências e selecione Painéis, na
lista de categorias, à esquerda. Em seguida, escolha qualquer das seguintes opções:
Sempre visíveis permite especificar quais painéis sempre serão mostrados em primeiro plano
na janela do documento. Como padrão, todos os painéis, inspetores e outras janelas desse tipo
sempre “flutuarão” em primeiro plano na janela do documento. Se for cancelada a seleção de
um item nessa lista, a janela do documento poderá ser exibida na frente desse item.
Por exemplo: para que a janela do documento esteja na frente do inspetor de propriedades,
desmarque a opção Propriedades. O inspetor de propriedades aparecerá agora na frente da
janela do documento, apenas quando ele estiver ativo.
Para que a janela do documento esteja na frente de qualquer painel flutuante, incluído na
personalização do Dreamweaver, desmarque Todos os outros painéis.
Nota: A op ção Sempre visíveis não se aplicará à área de trabalho integrada quando todos os
painéis estiverem encaixados.
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 45 de 160
1. Para incluir um item à barra do Iniciador, clique no botão com o sinal de adição (+).
2. Para remover um item da barra do Iniciador, selecione o item e clique no botão com o
sinal de subtra ção ( -).
3. Para alterar a ordem dos itens na barra do Iniciador, selecione um item na lista e clique
no botão de seta.
Por exemplo: para mover um item para a direita na barra do Iniciador, desloque-o para a
baixo na lista.
4. Clique em OK.
O painel Site permite definir um site, gerenciar os arquivos locais no site, efetuar o upload e
download de arquivos de um site remoto e procurar arquivos no disco local, fora do site. Para
obter detalhes sobre a utilização do painel Site, consulte o Como gerenciar o seu site.
O painel Histórico mostra a lista de etapas realizadas no documento ativo desde que foi criado
ou aberto, até um número máximo especificado de etapas (o painel Histórico não mostra as
etapas realizadas em outras molduras, janelas de documento ou no painel Site). Ele permite
desfazer uma ou mais etapas, executá-las novamente e criar novos comandos para automatizar
tarefas repetitivas.
O botão deslizante (polegar) do painel Histórico indica inicialmente a última etapa efetuada.
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 46 de 160
O painel Histórico controla cada etapa do seu trabalho no Dreamweaver. Utilize o painel
Histórico para desfazer diversas etapas simultaneamente.
Se desejar desfazer a última operação realizada em um documento, escolha Editar > Desfazer,
como em qualquer outro aplicativo. O nome do comando Desfazer no menu Editar será
alterado, refletindo a última operação efetuada.
Arraste o controle deslizante do painel Histórico uma etapa acima na lista. Esta ação provoca o
mesmo efeito que a seleção de Editar > Desfazer.
Nota: Para rolar automaticamente até uma determinada etapa, clique à esquerda da mesma; o
clique em uma etapa seleciona-a. A sele ção de uma etapa é diferente da volta à etapa no
histórico dos comandos Desfazer.
Da mesma maneira que uma única etapa não pode ser refeita, se v árias etapas forem desfeitas,
não será mais possível refazê-las depois de efetuar uma nova ação no documento, já que elas
desaparecerão do painel Histórico.
O valor padr ão deve ser suficiente para a maioria dos usuários. Quanto mais alto for o
número, maiores serão os requisitos de mem ória do painel Histórico. Isso poderá afetar o
desempenho e diminuir significativamente a velocidade do computador. Quando o painel
Histórico atingir o número máximo de etapas, as primeiras etapas serão descartadas.
Nota: Não é possível reordenar as etapas no painel Histórico. N ão imagine o painel Histórico
como uma coleção arbitrária de comandos; considere-o como uma maneira de visualizar as
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 47 de 160
Esse comando também limpará todas as informações relacionadas aos comandos Desfazer do
documento; depois de escolher Limpar o histórico, n ão será mais possível desfazer as etapas
que tiverem sido limpas (observe que o comando Limpar o histórico não refaz as etapas; ele
simplesmente remove o registro das etapas da mem ória do Dreamweaver).
O Painel de respostas fornece acesso rápido a informações que o ajudam a trabalhar de modo
eficaz com o Dreamweaver. Ele inclui tutoriais, Notas técnicas, as extensões do Dreamweaver e
outros conteúdos úteis.
Para obter as informações mais recentes sobre o Dreamweaver no site macromedia.com, clique
no botão Atualizar.
l Para obter informações sobre a utilização do Dreamweaver com outros editores de HTML,
como HomeSite ou BBEdit, veja Utilização de um editor de HTML externo com o
Dreamweaver.
l É possível especificar os navegadores preferidos para visualizar o site. Veja Como
visualizar as páginas nos navegadores.
l Um editor de imagens externo, como o Macromedia Fireworks, pode ser iniciado no
Dreamweaver. Veja Utilização de um editor de imagens externo.
l É possível configurar o Dreamweaver para que inicie um editor diferente, de acordo com o
tipo de arquivo. Veja Como iniciar um editor externo para arquivos de mídia .
l Para obter informações sobre a inclusão de interatividade no seu site utilizando o
Macromedia Flash, veja Sobre o conteúdo Flash.
l Para saber como adicionar animações no seu site utilizando os filmes Macromedia
Shockwave, veja Como inserir filmes Shockwave .
l Para obter informações sobre a utilização do ColdFusion, consulte o Configuração de um
aplicativo para a Web.
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 48 de 160
Existem algumas técnicas básicas que podem ser utilizadas para personalizar o Dreamweaver,
de modo a adequá-lo às suas necessidades, sem precisar conhecer códigos complexos ou saber
como editar arquivos de texto. Por exemplo: é possível definir preferências, criar os seus
próprios atalhos de teclado e adicionar extensões ao Dreamweaver.
Para obter informações sobre a personalização dos arquivos de configura ção manualmente, veja
“Customizing Dreamweaver” no Centro de suporte da Macromedia.
Para obter informações sobre as diversas opções das preferências, consulte os seguintes
tópicos:
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 49 de 160
Advertir ao abrir arquivos somente de leitura alerta quando for aberto um arquivo
somente de leitura (bloqueado). São oferecidas as opções de desbloquear/retirar ou visualizar o
arquivo, ou cancelar.
Alterar a área de trabalho (apenas no Windows) permite escolher um dos três layouts de
área de trabalho: área de trabalho integrada com os painéis à direita, área de trabalho
integrada com os painéis à esquerda, adaptada aos codificadores, ou área flutuante de trabalho
semelhante à do Dreamweaver 4. Após a escolha da nova área de trabalho, saia do
Dreamweaver e reinicie -o para ver as altera ções. Para obter mais informações, veja Escolha de
um layout de área de trabalho.
Ediçã o mais rápida de tabela (atualizaçã o adiada) acelera a digitação em tabelas adiando
alguns ajustes na largura de colunas e na altura de linhas, até que você clique fora da tabela.
Quando essa opção está ativa, é possível atualizar a tabela durante a sua edição, pressionando
as teclas Control e a barra de espaço.
Ativar a entrada linear de bytes duplos permite inserir texto de bytes duplos diretamente
na janela do documento se você estiver utilizando um ambiente de programação ou kit de
linguagem que facilite o texto de bytes duplos (por exemplo: os caracteres japoneses). Quando
essa opção for cancelada, aparecerá uma janela para a entrada de texto, destinada à digitação
e convers ão de texto de bytes duplos; o texto aparecerá na janela do documento após ter sido
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 50 de 160
Alternar para o parágrafo simples depois do cabeçalho especifica que o ato de pressionar
Enter no final de um parágrafo de cabeçalho, na visualização do projeto, criará um novo
parágrafo com a tag p. (o parágrafo de cabeçalho é aquele que contém uma tag de cabeçalho,
por exemplo: h1 ou h2). Quando a opção estiver desativada, o ato de pressionar Enter, no final
de um parágrafo de cabeçalho, criará um novo parágrafo com a mesma tag de cabeçalho
(permitindo que sejam digitados v ários cabeçalhos em uma linha e, em seguida, voltar e
preencher os detalhes).
Nota: O World Wide Web Consortium não recomenda a utilização das tags b e i; as tags
strong e em fornecem mais informações semânticas do que as tags b e i.
Barra de inserçã o permite visualizar o conteúdo da barra Inserir como ícones e texto, apenas
ícones ou apenas texto.
Utilize as preferências de fontes para definir as fontes que o Dreamweaver usará para exibir
cada codificação de fonte. A codificação do documento determina como ele será exibido no
navegador. As definições de fontes do Dreamweaver permitem mostrar uma determinada
codificação utilizando a fonte e o tamanho preferidos, sem afetar a aparência do documento
quando for visualizado por outras pessoas em um navegador. Veja Configuração de um
documento para obter informações sobre a defini ção de uma codificação padrão para novos
documentos.
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 51 de 160
codifica çã o:
Nota: Para que uma fonte seja exibida nos menus pop-up de fontes, é necessário que ela
esteja instalada no computador. Por exemplo: para poder visualizar textos escritos em japonês,
é necessário contar com uma fonte japonesa instalada.
Para especificar as fontes utilizadas no ingl ês dos EUA e em todos os idiomas da Europa
ocidental, escolha Ocidental, na lista Definições de fontes e, em seguida, escolha um conjunto
de quatro fontes nos menus pop-up de fontes. Para definir as fontes apropriadas de bytes
duplos dos idiomas asiáticos, escolha Japon ês, Chin ês tradicional, Chinês simplificado ou
Coreano. Para exibir um idioma asiático, é necessário utilizar um sistema operacional que aceite
as fontes de bytes duplos. Também é possível escolher as fontes para as codifica ções Centro-
europeu, Cirílico, Grego, Islandês Mac ou Outra.
Fonte proporcional é a fonte utilizada pelo Dreamweaver para exibir texto normal (por
exemplo: texto em parágrafos, cabeçalhos e tabelas). O padrão depende das fontes que
estiverem instaladas no seu sistema. Na maior parte dos sistemas dos EUA, o padrão é Times
New Roman 12 pontos (Média).
Fonte fixa é a fonte utilizada pelo Dreamweaver para exibir o texto contido nas tags pre, code
e tt. O padrão depende das fontes que estiverem instaladas no seu sistema. Na maior parte
dos sistemas dos EUA, o padrão é Courier New 10 pontos (Pequena).
Visualizaçã o de código é a fonte utilizada para todos os textos que aparecem no inspetor de
código. O padrão depende das fontes que estiverem instaladas no seu sistema.
Inspetor de tags é a fonte utilizada para todos os textos que aparecem no inspetor de tags.
Para obter mais informações, veja Edição de tags utilizando o inspetor de tags.
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 52 de 160
l Nos modelos e nos arquivos que neles se basearem, as regiões editáveis e as bloqueadas
são marcadas em cores diferentes de realce. Para personalizar as cores do realce do
modelo, veja Como definir as preferências de realce do modelo.
l Para especificar a cor do realce dos itens de biblioteca, veja Defina as preferências de
realce da biblioteca.
l Para especificar uma cor de realce do conteúdo contendo tags de outros fabricantes, veja
“Customizing Dreamweaver”, no Centro de suporte da Macromedia.
l Para especificar as cores do realce das c élulas e tabelas de layout, veja Sobre as células e
tabelas de layout.
l Para especificar as cores do texto na visualização de c ódigo da janela do documento ou no
inspetor de c ódigo, veja Definição de preferências de cores de código.
Utilize o editor de atalhos de teclado para criar as suas pr óprias teclas de atalho, editar os
atalhos existentes ou utilizar os conjuntos de atalhos predeterminados.
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 53 de 160
¡ Adicionar o item (+) adiciona um novo atalho ao comando. Clique nesse botão
para adicionar uma nova linha em branco na caixa de texto Atalhos. Digite uma
nova combinação de teclas e clique em Alterar, para adicionar um novo atalho de
teclado a este comando. Podem ser atribuídos dois diferentes atalhos de teclado a
cada comando; se já existirem dois atalhos designados para um comando, o botão
Adicionar o item não executará nenhuma ação.
¡ Remover o item (-) remove o atalho selecionado da lista de atalhos.
¡ Pressione a tecla exibe a combinação de teclas a ser digitada ao adicionar ou
alterar um atalho.
¡ Alterar adiciona a combinação de teclas, mostrada na caixa de texto Pressione a
tecla, à lista de atalhos ou altera o atalho selecionado de modo a refletir a
combinação de teclas especificada.
¡ Duplicar duplica o conjunto atual. Denomine o novo conjunto; o nome padrão é o
nome atual do conjunto acrescido da palavra cópia .
¡ Renomear renomeia o conjunto atual.
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 54 de 160
3. Selecione um atalho.
4. Clique no botão Remover o item (-).
Nota: Se ocorrer algum problema com a combinação de teclas (por exemplo: se ela já
tiver sido atribuída a outro comando), será exibida uma mensagem explicativa, logo
abaixo do campo Atalhos, e talvez não seja poss ível adicionar ou editar o atalho.
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 55 de 160
Nota: Se ocorrer algum problema com a combinação de teclas (por exemplo: se ela já
tiver sido atribuída a outro comando), será exibida uma mensagem explicativa, logo
abaixo do campo Atalhos, e talvez não seja poss ível adicionar ou editar o atalho.
As extensões são novos recursos que podem ser facilmente adicionados ao Dreamweaver. É
possível utilizar muitos tipos de extensões; por exemplo: há extensões que permitem
reformatar tabelas, efetuar conexões a bancos de dados auxiliares ou que podem ajudá-lo a
escrever scripts para navegadores.
Nota: Para instalar extensões que todos os usuários possam utilizar em um sistema operacional
multiusuário, é necessário ter efetuado login como Administrador. Para obter mais informações
sobre os sistemas multiusuário, veja Personalização do Dreamweaver nos sistemas
multiusuário.
Para ter acesso às mais recentes extensões do Dreamweaver, utilize o site de intercâmbio da
Macromedia na Web. Neste site, é possível efetuar o login e o download das extensões (muitas
das quais são gratuitas), participar de grupos de discussão, visualizar as avaliações e cr íticas
dos usuários, além de instalar e utilizar o Extension Manager. É necessário instalar o Extension
Manager antes de instalar as extensões.
Utilize o Extension Manager para remover extensões ou ver mais informações sobre uma
determinada extensão.
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 56 de 160
Nota: Em sistemas operacionais mais antigos (Windows 98 e Windows ME), todos os usuários
compartilham um único conjunto de arquivos de configura ção do Dreamweaver, mesmo que o
sistema esteja configurado para oferecer suporte a vários usuários.
Nota: Se n ão quiser aguardar até a cria ção dos documentos, tente utilizar algumas das
ferramentas de criação de documentos do Dreamweaver, para criar um exemplo de documento
(consulte Como criar um novo documento em branco). Mas não tente criar os documentos
definitivos antes de configurar o site.
Se você já tiver um site em um servidor da Web e desejar utilizar o Dreamweaver para editá-lo,
consulte Como editar um site do Dreamweaver.
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 57 de 160
A decis ão de quais serão os objetivos do seu site é a primeira etapa na criação de um site da
Web. Consulte o cliente sobre o site que ele deseja. O que pretende atingir com um site da
Web? Tome nota de seus objetivos, para que se lembre deles durante o processo de criação. Os
objetivos ajudam a concentrar e destinar o site da Web às suas necessidades particulares.
Um site da Web que divulga notícias sobre um tema específico deve ter aparência e navegação
diferentes de um site da Web destinado a vender produtos. A complexidade dos seus objetivos
afetará a navegação, as ferramentas de cria ção a serem utilizadas (Flash, Director e assim por
diante) e até mesmo a aparência e impressão causadas pelo site.
Após decidir o que deseja alcançar com o seu site da Web, você precisará decidir quem deseja
que o visite. Esta pode ser uma pergunta pouco importante, j á que a maioria das pessoas
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 58 de 160
deseja que todo mundo visite o seu site da Web. No entanto, é dif ícil criar um site da Web que
todas as pessoas do mundo irão utilizar. As pessoas utilizam navegadores diferentes, se
conectam em velocidades diferentes e podem ou não possuir plug -ins de mídia. Todos estes
fatores podem afetar o uso do seu site. Por estes motivos, você precisa determinar o seu
público-alvo.
Pense nas pessoas que serão atra ídas ao seu site da Web ou quem espera atrair. Que tipos de
computadores você acredita que elas usarão? Qual será a plataforma predominante (Macintosh,
Windows, Linux e assim por diante)? Qual é a velocidade de conexão m édia (modem 33,6 ou
DSL)? Que tipos de navegadores e tamanhos de monitores estas pessoas estarão utilizando?
Você está criando um site de intranet onde todos estarão utilizando o mesmo sistema
operacional de computador e o mesmo navegador? Todos estes fatores podem afetar muito a
aparência que a sua página da Web terá para os visitantes.
Depois de ter escolhido o seu público e determinado que tipos de computadores, velocidades de
conexão e navegadores os seus visitantes utilizarão, inicie o seu projeto.
Digamos, por exemplo: que o seu público-alvo seja composto predominantemente de usuários
do Windows que possuem monitores de 17 polegadas e utilizam a versão 3.0 ou mais avançada
do Internet Explorer. À medida que projetar a sua página da Web, você deverá testar o
funcionamento do site no Internet Explorer num computador com Windows e um tamanho de
tela de 800 por 600 pixels. É pouco provável que haja visitantes utilizando o Netscape
Navigator na plataforma Macintosh, mas você deve assegurar que o seu site funcione nestes
tipos de computadores mesmo assim, até mesmo se a exibi ção não for exatamente a mesma
que a do público-alvo.
Ao criar um site, você deve se lembrar de que há vários navegadores da Web que poderão ser
utilizados pelos seus visitantes. Se possível, desenhe sites com ampla compatibilidade com o
navegador, levando em considera ção as outras restrições do projeto.
São utilizados cerca de 25 navegadores da Web diferentes, sendo que a maioria deles foi
lançada em mais de uma versão. Mesmo que você vise apenas o Netscape Navigator e o
Microsoft Internet Explorer, que são utilizados pela maioria dos usuários da Web, lembre-se de
que nem todos têm a vers ão mais recente desses navegadores. Se o site estiver na Web, mais
cedo ou mais tarde alguém irá visitá-lo utilizando o Netscape Navigator 2.0, o navegador que a
AOL fornece aos seus clientes ou algum navegador somente de texto como o Lynx.
Em algumas circunstâncias, não é necessário criar sites compatíveis com diversos navegadores.
Por exemplo: se o site estiver disponível apenas na intranet de sua empresa e você souber que
todos os funcionários utilizam o mesmo navegador, é possível otimizar o site de modo a ser
compatível com esse navegador. Da mesma forma, se for criado conteúdo HTML para ser
distribuído em CD-ROM junto com um determinado navegador, é razoável supor que todos os
seus clientes terão acesso a esse navegador.
Na maioria dos sites da Web projetados para visitas públicas, é conveniente torná-los
visualizáveis no maior número possível de navegadores. Escolha um ou dois navegadores como
principais e desenhe o site visando-os, mas tente explorar o site com outros navegadores de
vez em quando, para evitar incluir muito conteúdo incompatível. Também é possível enviar uma
mensagem para um grupo de discussão, solicitando-lhes que visualizem o seu site. Esta pode
ser uma boa maneira de obter comentários de um público variado.
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 59 de 160
Quanto mais sofisticado for o site termos de layout, animação, conteúdo de multimídia e
intera ção, menor será a probabilidade de que seja compatível com diversos navegadores. Nem
todos os navegadores podem executar o JavaScript, por exemplo. Uma página contendo texto
simples que não utiliza caracteres especiais será exibida sem problemas em qualquer
navegador, porém essa página parecerá menos atraente do que aquelas que contêm imagens,
layout e forem interativas. Tente equilibrar o projeto, para obter o máximo de efeito e
compatibilidade com diferentes navegadores.
Um procedimento útil consiste em fornecer v árias versões de certas páginas importantes, como
a home page do site. Por exemplo: é possível desenhar uma versão dessa página com molduras
e outra sem molduras. Você poderá incluir na sua página da Web um comportamento para
direcionar automaticamente os visitantes que não dispuserem de navegadores com suporte a
molduras para a versão sem molduras. Para obter mais informações, consulte Como utilizar as
ações de comportamentos enviadas com o Dreamweaver.
Em geral, a configuração de um site envolve a cria ção de uma pasta no disco local, que contém
todos os arquivos do site (conhecido como o site local), e a cria ção e edição de documentos
contidos nesta pasta. Quando o site estiver pronto para ser publicado e visualizado pelo p úblico,
estes arquivos poderão, então, ser copiados para um servidor da Web. Esta abordagem é
melhor do que criar e editar os arquivos no pr óprio site público ativo da Web, pois ela permite
testar as alterações no site local antes de torná-las publicamente visualizáveis e, em seguida,
quando o site estiver finalizado, efetuar o upload dos arquivos locais e atualizar todo o site
público de uma vez só.
Para coordenar o site local com o Dreamweaver, consulte Como configurar um site do
Dreamweaver. Depois que o site local tiver sido configurado com o Dreamweaver, você poderá,
entre outras coisas, gerenciar os arquivos do site, manter um registro dos links e atualizar as
páginas com mais facilidade.
Decida onde serão armazenados itens como imagens e arquivos de som Por exemplo: é
conveniente colocar todas as imagens em um único local, para facilitar a localização das
mesmas quando forem inseridas em uma página. Algumas vezes, os criadores colocam todos os
itens destinados a um site e que não forem HTML em uma pasta denominada Propriedades. É
possível que esta pasta contenha outras pastas (para imagens, filmes Shockwave e arquivos de
som, por exemplo). Alternativamente, é possível que haja uma pasta Propriedades para cada
grupo de páginas relacionadas no site, se os diversos grupos não compartilharem muitas
propriedades.
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 60 de 160
Utilize a mesma estrutura nos sites locais e remotos O site local e o site remoto da Web
deverão ter exatamente a mesma estrutura. Se você criar um site local utilizando o
Dreamweaver e, em seguida, efetuar o upload de tudo para o site remoto, o Dreamweaver se
encarregará de duplicar com exatidão a estrutura local no site remoto.
Muito tempo será economizado no processo se o seu projeto e layout forem planejados antes de
iniciar o trabalho no Dreamweaver. Pode ser tão simples como criar um desenho de protótipo
numa folha de papel, de acordo com a aparência desejada do layout do site. Uma abordagem
mais avançada seria criar um desenho composto do site, utilizando aplicativos como o
Macromedia FreeHand ou Fireworks. O importante é ter um protótipo do layout e projeto, para
que este possa ser seguido mais tarde, quando o site estiver sendo constru ído.
É importante manter a coer ência no layout e projeto da sua página. É do seu interesse que os
usuários possam clique nas páginas do seu site sem ficarem confusos, porque todas as páginas
têm uma aparência diferente ou a navegação está posicionada num local diferente em cada
página.
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 61 de 160
seguintes aspectos:
A informaçã o “Você está aqui” permite aos visitantes saber facilmente onde estão no seu
site e como retornar à página inicial.
Projete a aparência da sua navegação. A navegação deve ser coerente no site inteiro. Se uma
barra de navegação for colocada no alto da sua home page, procure mantê-la nesta posi ção em
todas as páginas vinculadas.
O Dreamweaver possui duas ferramentas de navegação que podem ser utilizadas para criar o
esquema de navegação. Para obter mais informações, consulte Links e navegação.
Depois que souber qual será a aparência do projeto e do layout, é possível criar e reunir as
propriedades que serão necessárias. As propriedades podem ser itens como imagens, texto ou
mídia (Flash, Shockwave, entre outros). Antes de começar a desenvolver o site, assegure -se de
ter todos estes itens reunidos e prontos para serem utilizados. Caso contrário, você terá que
interromper o desenvolvimento constantemente para localizar uma imagem ou criar um botão.
Se estiver utilizando imagens de um site de clip-art ou elas estiverem sendo criadas por alguma
outra pessoa, assegure-se de reuni-las e colocá-las numa pasta do site (consulte Como
organizar a estrutura do site). Se estiver criando as propriedades você mesmo, assegure -se de
criá-las antes de iniciar o desenvolvimento, incluindo todas as imagens necessárias, se estiver
utilizando imagens cambiáveis. Em seguida, organize as propriedades, para que possa acessá-
las facilmente enquanto estiver criando o site no Dreamweaver.
Utilize os modelos, se souber que muitas de suas páginas utilizarão o mesmo layout. Planeje
e projete um modelo para tal layout e, em seguida, você poderá criar novas páginas a partir do
modelo. Se decidir alterar o layout de todas as páginas, basta alterar o modelo.
Nota: Existem algumas restrições quanto às alterações que podem ser feitas aos documentos
que se baseiam em modelos. O melhor aproveitamento que se pode dar aos modelos ocorre em
ambientes de colabora ção, para garantir que todos estejam utilizando o mesmo layout de
página. É possível que os itens de biblioteca ofereçam uma maior flexibilidade de uso fora dos
ambientes de colabora ção.
Utilize itens de biblioteca, se você já souber que determinadas imagens ou outros elementos
aparecerão em muitas páginas do site. Crie estes elementos com antecedência e transforme-os
em itens de uma biblioteca. Se estes itens forem alterados posteriormente, a nova versão
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 62 de 160
Para obter mais informações sobre como reutilizar os layouts e elementos de uma página,
consulte Como gerenciar as propriedades do site, bibliotecas e modelos.
l Pasta local é o diretório de trabalho. O Dreamweaver se refere a essa pasta como “site
local”. Para obter mais informações, consulte Como configurar uma pasta local.
l Pasta remota é onde são armazenados os arquivos, dependendo do ambiente: para
teste, produção, colaboração e assim por diante. O Dreamweaver se refere a essa pasta
como “site remoto”. Para obter mais informações, consulte Como configurar uma pasta
remota.
l Pasta de páginas dinâmicas é a pasta onde o Dreamweaver processa as páginas
dinâmicas. Para obter mais informações, consulte Como especificar onde as páginas
dinâmicas podem ser processadas.
Há duas maneiras de configurar um site do Dreamweaver: utilize o Assistente Defini ção do site,
que o guiará através do processo de configuração, ou as defini ções avançadas de Defini ção do
site, que permitem configurar cada pasta local, remota e de teste, conforme a necessidade.
2. Clique na guia Básico, para utilizar o Assistente Defini ção do site, ou na guia Avançado,
para utilizar as definições avançadas.
3. Conclua o processo de configuração do site do Dreamweaver:
¡ No Assistente Defini ção do site, responda às perguntas e clique em Avançar, para
continuar o processo de configuração (consulte Como utilizar o Assistente Definição
do site).
¡ Nas definições avançadas, preencha os dados nas categorias Informações locais
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 63 de 160
(consulte Como configurar uma pasta local), Informações remotas (consulte Como
configurar uma pasta remota) e Servidor de teste (consulte Como especificar onde
as páginas dinâmicas podem ser processadas), conforme a necessidade.
Nota: Recomenda-se aos usuários que ainda não conhecem o Dreamweaver que utilizem o
Assistente Definição do site; os usuários mais experientes do Dreamweaver poderão utilizar as
definições avançadas.
O Assistente possui três seções. Dependendo das definições selecionadas, cada seção
apresentará diversas telas, denominadas partes. As tr ês principais seções incluem os seguintes
itens:
l Como editar os arquivos é o local onde se configura a pasta local. Para obter mais
informações, consulte Como configurar uma pasta local.
l Como testar os arquivos é o local onde se configura uma pasta para que o
Dreamweaver processe páginas dinâmicas. Para obter mais informações, consulte Como
especificar onde as páginas dinâmicas podem ser processadas.
l Como compartilhar os arquivos é o local onde se configura a pasta remota. Para obter
mais informações, consulte Como configurar uma pasta remota.
O nome da seção em negrito, situado no alto da caixa de diálogo, indica o ponto do processo de
configuração. Talvez não haja necessidade de configurar as pastas nas três seções. Cada seção
fará perguntas, com o objetivo de auxiliá-lo a determinar as suas necessidades.
Para utilizar o Assistente Defini ção do site para configurar um site do Dreamweaver:
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 64 de 160
Ela é o local onde são armazenados os arquivos “em andamento” de um site do Dreamweaver.
Os sites do Dreamweaver são estabelecidos com a configuração de uma pasta local. Também é
possível adicionar pastas remotas e de teste (consulte Como configurar uma pasta remota e
Como criar uma pasta raiz para o aplicativo), mas é necessário configurar pelo menos uma
pasta local para poder começar a projetar sites no Dreamweaver.
Para obter mais informações, consulte Como definir as opções da categoria Informações
locais.
4. Clique em OK.
Posteriormente, quando o site estiver pronto para ser publicado em um servidor remoto, inclua
informações adicionais relacionadas ao site. Para obter informações, consulte Como configurar
uma pasta remota.
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 65 de 160
Depois que você tiver configurado uma pasta local de um site do Dreamweaver (consulte Como
configurar uma pasta local), configure uma pasta remota. As pastas local e remota permitem
transferir arquivos entre o disco local e o servidor da Web, o que facilita o gerenciamento de
arquivos dos sites do Dreamweaver.
Nota: Não será necessário especificar uma pasta remota, se a pasta que tiver sido especificada
como pasta local, na categoria Informações locais (consulte Como configurar uma pasta local),
for a mesma pasta que tiver sido criada para os arquivos do site no sistema que estiver
executando o servidor da Web. Isso implica que o servidor da Web está em execução no
computador local.
Determine como se dará o acesso à pasta remota e tome nota das informações de conex ão.
Quando terminar de reunir essas informações, utilize o comando Editar os sites, para configurar
a pasta remota. Caso você tenha problemas, consulte Como solucionar problemas de
configuração da pasta remota.
Depois que a pasta remota estiver configurada, conecte-se à mesma, procure e gerencie os
arquivos do site do Dreamweaver. Se você estiver criando um site dinâmico, precisará adicionar
uma pasta para processar as páginas dinâmicas (consulte Como especificar onde as páginas
dinâmicas podem ser processadas).
Se não houver sites do Dreamweaver definidos, crie uma pasta local antes de continuar
(consulte Como configurar uma pasta local).
3. Clique em Editar.
Para obter mais informações, consulte Como definir as opções da categoria Informações
remotas.
7. Clique em OK.
No painel Site, escolha Site > Conectar, ou clique no botão Conectar ao host remoto, na barra
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 66 de 160
Nota: Se o site utilizar FTP com SSH para acessar a pasta remota, quando você tentar
estabelecer a conexão com o servidor remoto, um prompt de comando solicitará o seu logon no
servidor SSH. Depois que efetuar o logon, clique em OK, na caixa de diálogo do Dreamweaver.
No painel Site, escolha Site > Desconectar, ou clique no botão Desconectar, na barra de
ferramentas do painel Site.
Se optar pelo FTP para acessar a pasta remota (consulte Como configurar uma pasta remota),
será necessário determinar o diretório do host desta. O diretório do host especificado deverá
corresponder à pasta raiz da pasta local. O diagrama a seguir mostra um exemplo de pasta
local, à esquerda, e um exemplo de pasta remota, à direita.
Se a estrutura do site não coincidir com a da pasta local, o Dreamweaver carregará os arquivos
para o local incorreto e estes não estarão visíveis para os visitantes do site. Os caminhos até as
imagens e os links também se romperão.
É necessário que o diretório raiz remoto exista, para que o Dreamweaver possa se conectar a
ele. Se não houver um diretório raiz correspondente à pasta remota, solicite ao administrador
do servidor que crie um ou faça-o você próprio.
Se estiver em dúvida sobre o que digitar na caixa de texto Diretório do host, entre em contato
com o administrador do servidor ou tente deixar a caixa de texto em branco. Em alguns
servidores, o diretório raiz será idêntico àquele com o qual você estabeleceu a primeira conexão
com o FTP. Para descobrir isso, conecte-se ao servidor. Se aparecer uma pasta com um nome
semelhante a public_html, ou www ou o seu nome de logon na visualização de arquivos
remotos, no painel Site, este será provavelmente o diretório a ser utilizado na caixa de texto
Diretório do host.
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 67 de 160
Na caixa de diálogo Definição do site, quando você selecionar FTP para acessar a pasta remota,
terá a opção de utilizar o SSH (Secure Shell). Para ativar o SSH no Windows consulte Como
configurar as opções de informações remotas para o acesso de FTP.
Para utilizar o SSH no Macintosh, efetue o download do cliente de SSH para Macintosh, no site
do Centro de suporte do Dreamweaver na Web.
Um servidor da Web pode ser configurado de várias maneiras. A lista a seguir contém
informações sobre algumas questões comuns que podem ocorrer durante a configuração de
uma pasta remota e como solucioná-las.
Caso você tenha problemas com o acesso de FTP, peça ajuda ao administrador de
sistemas local.
Por exemplo: se a pasta raiz remota for um diretório de nível mais elevado, é possível que
você precise especificar ../../ correspondente ao diretório do host.
Utilize sinais de sublinhado em vez de espaços e evite os caracteres especiais nos nomes
de arquivos e pastas, sempre que possível. Em particular, dois pontos, barras inclinadas,
pontos e apóstrofes nos nomes de arquivos ou pastas podem causar problemas.
Ocasionalmente, os caracteres especiais em nomes de pastas ou arquivos tamb ém podem
impedir que o Dreamweaver crie um mapa do site.
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 68 de 160
mais curtas.
l Observe que muitos servidores podem utilizar links simbólicos (no UNIX), atalhos (no
Windows) para conectar uma pasta em uma parte do disco do servidor a uma outra que
esteja em uma localização diferente.
Por exemplo: o subdiretório public_html do seu diretório principal no servidor pode ser,
na verdade, um link para outra parte do servidor. Na maioria dos casos, esses apelidos
não provocam qualquer efeito sobre a possibilidade de conexão à pasta ou diretório
adequado, mas se for possível conectar-se a uma parte do servidor mas não a outras,
pode ocorrer uma discrepância devida ao apelido.
l Caso apareça uma mensagem de erro como: “não é possível colocar o arquivo”, é possível
que não haja espaço na pasta remota. Verifique o registro do FTP, para obter informações
mais detalhadas.
l Escolha Site > Editar os sites, selecione um site e, em seguida, clique em Editar.
l Escolha Site > Abrir o site e, em seguida, selecione um site.
Utilize o Dreamweaver para editar sites existentes, mesmo se o site original não tiver sido
criado no Dreamweaver. É possível editar os sites existentes no sistema local ou em um sistema
remoto.
É possível utilizar o Dreamweaver para editar um site da Web já existente no disco local,
mesmo se o site original não tiver sido criado no Dreamweaver.
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 69 de 160
Para obter mais informações, consulte Como definir as opções da categoria Informações
locais.
3. Clique em OK.
É possível utilizar o Dreamweaver para copiar um site remoto já existente (ou um ramo deste)
para o disco local e editá-lo aí, mesmo se o site original não tiver sido criado no Dreamweaver.
Mesmo se pretender editar apenas uma parte do site remoto, duplique localmente toda a
estrutura da ramifica ção do site remoto, desde a raiz do mesmo até os arquivos a serem
editados.
Por exemplo: se a pasta raiz do site remoto (denominada public_html) contiver duas pastas
(Projeto1 e Projeto2) e você desejar trabalhar apenas com os arquivos HTML no Projeto1, não
haverá necessidade de efetuar o download dos arquivos do Projeto2, porém será necessário
mapear a pasta raiz local para public_html, em vez de Projeto1.
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 70 de 160
1. Crie uma pasta local que abrigará o site existente e defina-a como sendo a pasta raiz local
do site (consulte Como configurar uma pasta local).
2. Defina uma pasta remota utilizando as informações sobre o site já existente (consulte
Como configurar uma pasta remota). Certifique-se de escolher a pasta raiz correta para o
site remoto.
3. Clique no botão Conectar, no painel Site, para se conectar ao site remoto.
4. Dependendo da extensão do site remoto a ser editada, siga um dos
procedimentos abaixo:
¡ Se desejar trabalhar com o site inteiro, selecione a pasta raiz do site remoto e
clique em Obter, para efetuar o download do site inteiro no disco local.
¡ Se desejar trabalhar apenas com um dos arquivos ou pastas do site, localize-o na
visualização remota do painel Site e clique em Obter o(s) arquivo(s), para efetuar o
seu download no disco local.
Referência
Procedimento
Tópico relacionado
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 71 de 160
O objetivo desta caixa de diálogo é indicar a criação de um aplicativo para a Web, ou seja, se o
site contém conteúdo dinâmico. Um aplicativo para a Web é um conjunto de páginas que
interagem com o usuário, entre si e com vários recursos em um servidor Web, incluindo bancos
de dados.
Procedimento
1. Selecione Não, caso não planeje utilizar uma tecnologia de servidor para criar um
aplicativo para a Web, ou Sim, caso planeje utilizá-la.
2. Se selecionar Sim, escolha uma tecnologia de servidor.
É possível utilizar o Dreamweaver para criar aplicativos para a Web utilizando cinco
tecnologias de servidor: ColdFusion, ASP.NET, ASP, JSP ou PHP. Cada uma destas
tecnologias corresponde a um tipo de documento no Dreamweaver. A escolha de uma
tecnologia para seu aplicativo da Web depende de v ários fatores, incluindo o grau de
familiaridade com v árias linguagens de cria ção de scripts e o servidor de aplicativos que
deseja utilizar.
Tópicos relacionados
Procedimento
1. Selecione o método a ser utilizado para lidar com os arquivos durante a cria ção.
2. Digite o local onde deseja armazenar os arquivos ou clique no ícone correspondente à
pasta, para procurá-la.
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 72 de 160
3. Se selecionar um m étodo que utilize o FTP ou RDS, você poderá optar por efetuar o
upload automático dos arquivos para o servidor a cada vez em que forem salvos.
O objetivo desta caixa de diálogo é selecionar o m étodo de acesso a ser utilizado pelo
Dreamweaver para se comunicar com o servidor de teste.
O Dreamweaver funciona com um servidor de teste para gerar e exibir o conteúdo dinâmico
enquanto você trabalha. O servidor de teste pode ser o computador local, um servidor de
desenvolvimento, de testes ou de produção. Contanto que o servidor possa processar o tipo de
páginas dinâmicas que se planeja criar, a escolha não é muito importante.
Quando o servidor de teste for configurado, o Dreamweaver também irá configurar uma pasta
correspondente ao servidor remoto. Dependendo do ambiente de criação, essa pasta receberá
os arquivos para teste, colabora ção, produção, disposição ou outros tipos de atividades.
Normalmente, a pasta remota está situada no computador onde estiver em execução o servidor
da Web.
No painel Site do Dreamweaver, a pasta remota é conhecida como site remoto. A pasta remota
permite transferir arquivos entre o disco local e o servidor da Web, o que facilita o
gerenciamento de arquivos dos sites do Dreamweaver.
Procedimento:
Nesse método de acesso, a pasta remota deverá estar em um computador que execute o
ColdFusion.
Tópicos relacionados
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 73 de 160
O objetivo desta caixa de diálogo é selecionar uma pasta no computador local ou na rede, na
qual deverão ser armazenados os arquivos para teste.
Procedimento
Digite o caminho até a pasta local ou da rede onde serão armazenados os arquivos para teste,
ou clique no ícone correspondente à pasta, para procurá-la.
O objetivo desta caixa de diálogo é fornecer informações sobre o acesso de FTP ao servidor de
teste onde serão armazenados os arquivos para teste.
Procedimento
1. Digite o nome do host de FTP para o qual deseja efetuar o upload dos arquivos para teste.
Nota: Se n ão souber qual é o host de FTP, entre em contato com o provedor de serviços
da Internet.
2. Digite o caminho até a pasta onde serão armazenados os arquivos para teste, ou clique
no ícone correspondente à pasta, para procurá-la.
3. Digite o nome de logon e a senha utilizados para estabelecer a conexão ao servidor de
FTP.
4. Clique em Testar a conexão, para testar o logon e a senha.
Tópico relacionado
O objetivo desta caixa de diálogo é fornecer informações sobre o acesso de RDS ao servidor de
teste onde serão armazenados os arquivos.
Procedimento
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 74 de 160
Tópico relacionado
Procedimento
1. Digite a URL que os usuários digitarão nos seus navegadores para abrir o aplicativo para a
Web, mas não inclua qualquer nome de arquivo.
Tópico relacionado
O prefixo de URL
O objetivo desta caixa de diálogo é decidir se h á necessidade de configurar uma pasta remota.
Dependendo do ambiente de criação, essa pasta receberá os arquivos para teste, colabora ção,
produção, disposição ou outros tipos de atividades. Normalmente, a pasta remota está situada
no computador onde estiver em execução o servidor da Web.
No painel Site do Dreamweaver, essa pasta é conhecida como site remoto. A pasta remota
permite transferir arquivos entre o disco local e o servidor da Web, o que facilita o
compartilhamento e gerenciamento dos arquivos dos sites do Dreamweaver.
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 75 de 160
Procedimento
Selecione Sim, para configurar uma pasta remota, ou Não, para ignorar a configuração da pasta
remota.
O objetivo desta caixa de diálogo é selecionar o m étodo de acesso a ser utilizado pelo
Dreamweaver para se comunicar com a pasta remota.
Procedimento
Nesse método de acesso, a pasta remota deverá estar em um computador que execute o
ColdFusion.
O suporte aos bancos de dados SourceSafe está disponível apenas no Windows. Para
poder utilizar o SourceSafe com o Windows, é necessário que a vers ão 6 do Microsoft
Visual SourceSafe Client esteja instalada.
Nesse método de acesso, é necessário que haja um servidor com suporte a esse
protocolo, como o Microsoft Internet Information Server (IIS) 5.0 ou o servidor da Web
Apache.
Tópicos relacionados
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 76 de 160
O objetivo desta caixa de diálogo é selecionar uma pasta no computador local ou na rede, na
qual deverão ser armazenados os arquivos.
Procedimento
Digite o caminho até a pasta local ou da rede onde serão armazenados os arquivos, ou clique
no ícone correspondente à pasta, para procurá-la.
O objetivo desta caixa de diálogo é fornecer informações sobre o acesso de FTP ao servidor
remoto onde serão armazenados os arquivos.
Procedimento
1. Digite o nome do host de FTP para o qual deseja efetuar o upload dos arquivos.
Nota: Se n ão souber qual é o host de FTP, entre em contato com o provedor de serviços
da Internet.
2. Digite o caminho até a pasta onde serão armazenados os arquivos, ou clique no ícone
correspondente à pasta, para procurá-la.
3. Digite o nome de logon e a senha utilizados para estabelecer a conexão ao servidor de
FTP.
4. Clique em Testar a conexão, para testar o logon e a senha.
Tópico relacionado
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 77 de 160
Procedimento
Esta opção é útil para informar aos outros usuários sobre a retirada de um arquivo para
edição, ou para alertar a si próprio que uma versão mais recente de um arquivo foi
deixada em um outro computador.
Nota: A utilização da opção Arquivo > Abrir, para abrir um arquivo não o retira, mesmo
quando esta estiver selecionada.
O seu nome aparecerá no painel Site, juntamente com os arquivos que tiverem sido
retirados; esse sistema permite que os membros de uma equipe comuniquem o
compartilhamento de arquivos entre si.
Tópico relacionado
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 78 de 160
Procedimento
l Clique no botão Voltar, para retornar a uma página anterior e alterar uma definição.
l Clique no botão Concluída, se estiver satisfeito com as definições e quiser que o
Dreamweaver crie o site.
Quando você clique em Concluída, o Dreamweaver criará o site e o exibirá no painel Site.
O objetivo desta caixa de diálogo é configurar uma pasta local de um site do Dreamweaver
(também denominada site local).
Procedimento
O nome do site aparecerá no painel Site e no submenu Site > Abrir o site. Utilize qualquer
nome que preferir. Ele servirá apenas de referência e não aparecerá no navegador.
2. Na caixa de texto Pasta raiz local, digite o nome da pasta no disco local onde serão
armazenados os arquivos do aplicativo, modelos e itens de biblioteca, ou clique no ícone
correspondente à pasta, para procurá-la.
O Dreamweaver resolve os links relativos à raiz levando em conta esta pasta (consulte
Caminhos relativos à raiz do site). Se a pasta raiz local ainda não existir, crie -a na caixa
de diálogo de busca de arquivos.
Para atualizar manualmente o painel Site, clique no botão Atualizar, situado neste painel.
Para atualizar manualmente apenas a visualização local do painel Site, escolha Exibir >
Atualizar.
4. Na caixa de texto Pasta padrão de imagens, digite o caminho até a pasta padrão de
imagens desse site, ou clique no ícone correspondente à pasta, para procurá-la.
Essa é a pasta onde o Dreamweaver coloca as imagens incluídas no site. Por exemplo:
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 79 de 160
quando uma imagem for arrastada da área de trabalho para um documento ativo, o
Dreamweaver a incluirá no site na pasta padrão de imagens.
5. Na caixa de texto Endere ço HTTP, digite a URL a ser utilizada pelo site da Web finalizado.
Isso permitirá ao Dreamweaver verificar os links dentro do site que utilizarem URLs
absolutas (consulte Como verificar os links em uma página ou site).
6. Na opção Ativar o cache, indique se deseja criar um cache local para melhorar a
velocidade das tarefas de vinculação e gerenciamento do site.
Tópicos relacionados
O objetivo desta caixa de diálogo é selecionar o m étodo de acesso a ser utilizado pelo
Dreamweaver para se comunicar com o servidor da Web no qual está localizada a pasta remota
(também denominada site remoto).
Procedimento
1. Selecione um método de acesso no menu pop-up. A caixa de diálogo vai variar conforme
a seleção. Escolha uma dentre as seguintes opções:
¡ Nenhum , caso não planeje efetuar o upload do site para um servidor.
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 80 de 160
Nesse método de acesso, é necessário que haja um servidor com suporte a esse
protocolo, como o Microsoft Internet Information Server (IIS) 5.0 e o servidor da
Web Apache.
3. Nos acessos por RDS, SourceSafe Database e WebDAV, selecione as opções Ativar a
devolução e retirada de arquivos e Efetuar o upload automático dos arquivos para o
servidor no salvamento, para ativá-las. Em seguida, clique no botão Defini ções, para
fornecer as informações de acesso.
4. Clique em OK.
Tópicos relacionados
O objetivo desta caixa de diálogo é fornecer informações sobre o acesso local ou via rede.
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 81 de 160
Procedimento
1. Clique no ícone de pasta, ao lado da caixa de texto Pasta remota, para procurar e
selecionar a pasta onde são armazenados os arquivos do site.
2. Marque a caixa de sele ção Atualizar automaticamente a lista de arquivos remotos, se
desejar que o painel Remoto do painel Site seja atualizado automaticamente quando os
arquivos forem incluídos ou excluídos.
Para aumentar a velocidade de c ópia dos arquivos no site remoto, não selecione esta
opção.
Nota: Para atualizar manualmente o painel Site a qualquer momento, clique no botão
Atualizar, neste painel. Para atualizar manualmente apenas o painel Remoto, escolha
Exibir > Atualizar o remoto, no painel Site.
3. Marque a caixa de sele ção Efetuar o upload automático dos arquivos para o servidor no
salvamento, se quiser que o Dreamweaver efetue o upload do arquivo para o site remoto
quando for salvo.
4. Marque a caixa de sele ção Ativar a devolução e retirada de arquivos, se quiser ativar o
sistema de devoluções e retiradas de arquivos.
Para obter mais informações, consulte Como utilizar as opções de devolução e retirada de
arquivos.
5. Clique em OK.
Tópicos relacionados
Procedimento
1. Digite o nome do host de FTP para o qual deseja efetuar o upload dos arquivos que
compõem o site da Web.
Nota: Se n ão souber qual é o host de FTP, entre em contato com o provedor de serviços
da Internet.
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 82 de 160
O FTP passivo permite ao software local configurar a conexão do FTP, em vez de solicitar
que o servidor remoto o faça. Caso não tenha certeza se o FTP passivo está sendo
utilizado, informe-se com o administrador do sistema.
7. Marque a caixa de sele ção Utilizar a firewall, se a conexão ao servidor remoto se der atrás
de uma firewall.
8. Clique em Definições da Firewall, para editar o host ou a porta da firewall.
9. Marque a caixa de sele ção Utilizar o logon seguro criptografado por SSH, para utilizar o
SSH para a autenticação segura do FTP.
Nota: Para poder utilizar o SSH (Secure Shell) com o Macintosh, é necessário instalar o
cliente de SSH disponível no site do Centro de suporte do Dreamweaver na Web.
10. Marque a caixa de sele ção Efetuar o upload automático dos arquivos para o servidor no
salvamento, se quiser que o Dreamweaver efetue o upload do arquivo para o site remoto
quando for salvo.
11. Marque a caixa de sele ção Ativar a devolução e retirada de arquivos, se quiser ativar o
sistema de devoluções e retiradas de arquivos.
Para obter mais informações, consulte Como utilizar as opções de devolução e retirada de
arquivos.
Tópicos relacionados
O objetivo desta caixa de diálogo é configurar uma conexão ao servidor remoto utilizando os
RDS.
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 83 de 160
Procedimento
Nota: É possível que essas opções não apare çam, se você tiver definido o seu nome de
usuário e a sua senha nas definições de segurança do Administrador de ColdFusion.
5. Marque a caixa de sele ção Salvar, se desejar que o Dreamweaver memorize as suas
definições.
Tópicos relacionados
O objetivo desta caixa de diálogo é configurar uma conexão ao banco de dados SourceSafe.
Nota: O suporte aos bancos de dados SourceSafe está disponível apenas no Windows.
Procedimento
1. Na caixa de texto Caminho do banco de dados, clique em Procurar, para procurar o banco
de dados VSS desejado, ou digite o caminho completo do arquivo.
2. Na caixa de texto Projeto, digite o projeto do banco de dados VSS que deseja utilizar
como diretório raiz do site remoto.
3. Nas caixas de texto Nome de usuário e Senha, digite o seu nome de usuário e a sua
senha para acesso ao banco de dados selecionado.
Se não souber o seu nome de usu ário e a sua senha, informe-se com o administrador do
sistema.
Tópicos relacionados
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 84 de 160
O objetivo desta caixa de diálogo é configurar uma conexão ao servidor remoto utilizando o
protocolo WebDAV.
Procedimento
1. Na caixa de texto URL, digite a URL completa até o diretório do servidor WebDAV ao qual
deseja se conectar.
Esta URL inclui o protocolo, a porta e o diretório (se este for diferente do diretório raiz).
Por exemplo: http://apache1/WebDAV/meusite.
Estas informações se destinam à autentica ção pelo servidor e não estão relacionadas ao
Dreamweaver. Se estiver em dúvida quanto ao seu nome de usu ário e à sua senha,
informe-se com o administrador do sistema ou webmaster.
4. Clique na caixa de sele ção Salvar a senha, se desejar que o Dreamweaver memorize-a
sempre que for iniciada uma nova sessão.
5. Clique em OK, para retornar à caixa de diálogo Definição do site.
Tópicos relacionados
O objetivo desta caixa de diálogo é editar os sites. Esta caixa de di álogo permite criar um novo
site, editar, duplicar, remover um site, ou importar e exportar um site.
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 85 de 160
Procedimento
Tópicos relacionados
Um site local é criado no Dreamweaver utilizando o comando Novo site, que cria a pasta raiz
local do site, ou transformando uma pasta existente em pasta raiz local (consulte Como
configurar uma pasta local). Ao criar um novo site, você estará definindo um site remoto. É
possível adicionar essas informações posteriormente, utilizando o comando Editar os sites
(consulte Como configurar uma pasta remota).
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 86 de 160
Uma vez que o site tiver sido publicado, qualquer pessoa de sua equipe poderá continuar a
mantê-lo. Antes e após a publicação do site, é recomendável manter um procedimento contínuo
para a resolução de quaisquer problemas encontrados no site (para obter mais informações,
consulte Como testar um site).
O painel Site permite exibir um site, inclusive todos os arquivos locais, remotos e do servidor de
teste que estiverem associados a ele. O site local aparecerá como padrão. Altere o layout do
painel Site, para exibir o site remoto ou o servidor de teste (consulte Como alterar o layout do
painel Site). Expanda o painel Site, para obter uma visualização mista (consulte Como utilizar o
painel Site).
Nota: No Macintosh, o painel Site é sempre exibido na visualização mista (não é fechado).
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 87 de 160
Utilize o painel Site para executar as operações padrão de manutenção de arquivos, como, por
exemplo:
O painel Site contém um navegador de arquivos integrado. Esse navegador de arquivos permite
navegar o disco e a rede local, além do próprio site (consulte Como utilizar o navegador de
arquivos integrado).
Nota: Se você clique no botão Expandir/Fechar para expandir o painel enquanto este estiver
encaixado, ele ser á maximizado, de modo a impossibilitar o trabalho na janela do documento.
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 88 de 160
Para retornar à janela do documento, clique novamente no botão Expandir/Fechar, para reduzir
o painel. Se você clique no botão Expandir/Fechar para expandir o painel enquanto este estiver
flutuando, ele não sofrerá alterações e você poderá continuar a trabalhar na janela do
documento. É necessário reduzir o painel para poder encaix á-lo novamente.
Utilize os seguintes botões e opções da barra de ferramentas do painel Site, para determinar o
que será exibido nele e para transferir arquivos:
Nota: Os botões Arquivos do site, Servidor de teste e Mapa do site aparecerão apenas quando
o painel Site estiver expandido.
A visualizaçã o dos arquivos do site exibe a estrutura de arquivos do site local e remoto nos
painéis do painel Site. Uma definição de preferência determinará qual site aparecerá nos painéis
esquerdo e direito; consulte Como definir as preferências do site. A visualização dos arquivos do
site constitui a visualização padrão do painel Site.
A visualizaçã o do mapa do site exibe uma imagem do mapa do site, levando em conta como
os documentos estão vinculados uns aos outros. Mantenha pressionado este botão, para
escolher no menu pop-up a opção Apenas o mapa ou Mapa e arquivos.
O menu pop-up Site lista os sites que tiverem sido definidos. Para alternar entre diversos
sites, escolha um outro site da lista. Para adicionar um site ou editar as informaçõ es relativas a
um site existente, escolha Editar os sites, na parte inferior do menu (consulte Como configurar
uma pasta remota).
Para alterar o limite de tempo, escolha Editar > Preferências e, em seguida, selecione Site, na
lista de categorias exibida à esquerda.
Atualizar atualiza as listas de diretórios locais e remotos. Utilize esse botão para atualizar
manualmente as listas de diretórios, caso seja cancelada a seleção das op ções Atualizar
automaticamente a lista de arquivos locais ou Atualizar automaticamente a lista de arquivos
remotos, na caixa de diálogo Definição do site (consulte Como configurar uma pasta remota).
Obter o(s) arquivo(s) copia os arquivos selecionados do site remoto ou do servidor de teste
para o site local (substituindo a cópia local do arquivo já existente, se houver). Se a opção
Ativar a devolução e retirada de arquivos estiver ativada, as c ópias locais serão somente de
leitura; os arquivos continuarão disponíveis no site remoto, para que outros membros da equipe
possam retirá-los. Se a opção Ativar a devolução e retirada de arquivos estiver desativada, a
obtenção de um arquivo transferir á uma cópia com os privilégios de leitura e gravação.
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 89 de 160
O Dreamweaver copiará os arquivos que tiverem sido selecionados no painel ativo do painel
Site. Se o painel Remoto ou Servidor de teste estiver ativo, os arquivos remotos ou do servidor
de teste que tiverem sido selecionados serão copiados para o site local; se o painel Local estiver
ativo, o Dreamweaver copiará a versão remota ou do servidor de teste dos arquivos locais
selecionados para o site local. Para obter mais informações, consulte Como obter arquivos de
um servidor remoto ou de teste.
Nota: É possível obter os arquivos remotos ou do servidor de teste, mas os recursos pr óprios à
devolução e retirada se aplica apenas aos arquivos remotos.
Colocar o(s) arquivo(s) copia os arquivos selecionados do site local para o site remoto ou
para o servidor de teste.
O Dreamweaver copiará os arquivos que tiverem sido selecionados no painel ativo do painel
Site. Se o painel Local estiver ativo, os arquivos locais que tiverem sido selecionados serão
copiados para o site remoto ou para o servidor de teste; se o painel Remoto ou Servidor de
teste estiver ativo, o Dreamweaver copiará a versão local dos arquivos remotos ou do servidor
de teste para o site remoto. Para obter mais informações, consulte Como colocar arquivos em
um servidor remoto ou de teste.
Nota: É possível colocar os arquivos no servidor remoto ou de teste, mas os recursos próprios à
devolução e retirada se aplica apenas aos arquivos remotos.
Se você estiver colocando um arquivo que ainda não exista no site remoto e a opção Ativar a
devolução e retirada de arquivos estiver ativa, o Dreamweaver adicionará o arquivo ao site
remoto como “retirado”. Clique no botão Devolver os arquivos, se desejar adicionar um arquivo
sem o status de retirada.
Retirar o(s) arquivo(s) transfere uma cópia do arquivo do servidor remoto para o site local
(substituindo a cópia local do arquivo já existente, se houver) e marca esse arquivo como tendo
sido retirado do servidor. Esta opção não estará disponível se a opção Ativar a devolu ção e
retirada de arquivos, na caixa de diálogo Defini ção do site, estiver desativada no site. Para
obter mais informações, veja Como devolver e retirar os arquivos de um servidor remoto.
Devolver o(s) arquivo(s) transfere uma cópia do arquivo local para o servidor remoto,
tornando-o disponível para edição por outros usuários. O arquivo local se tornará somente de
leitura. Esta opção não estará disponível se a opção Ativar a devolução e retirada de arquivos,
na caixa de diálogo Defini ção do site, estiver desativada no site. Para obter mais informações,
veja Como devolver e retirar os arquivos de um servidor remoto.
O botão Expandir/Fechar expande ou fecha o painel Site, exibindo apenas um ou dois painéis.
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 90 de 160
Para obter mais informações, consulte Como definir as opções de preferências do painel
Site
4. Clique em OK.
É possível definir se os tipos de arquivos serão transferidos no formato ASCII (texto) ou binário,
através da personalização do arquivo FTPExtensionMap.txt, na pasta
Dreamweaver/Configuration. Para obter mais informações, consulte Bem-vindo ao
Dreamweaver.
É possível personalizar as colunas que serão exibidas nas listas Site local e Site remoto, no
painel Site. Siga qualquer um dos procedimentos abaixo:
l Reordene as colunas
l Adicione novas colunas (dez, no máximo)
l Exclua colunas
l Oculte colunas
l Designe colunas a serem compartilhadas com todos os usuários que estiverem conectados
a um site
As colunas padrão s ão Nome, Notas, Tamanho, Tipo, Modificado e Retirado por. Para ordenar
segundo qualquer coluna, clique no respectivo cabeçalho, no painel Site. O ato de clique em
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 91 de 160
uma coluna mais de uma vez inverterá a ordem (ascendente ou descendente) de acordo com a
qual o Dreamweaver a organiza.
Nota: Não é possível excluir ou renomear uma coluna padrão, ou associar uma Design Note à
mesma. É possível alterar a ordenação e o alinhamento das colunas padrão, assim como ocultá-
las, com exceção da coluna Nome, que não pode ser oculta.
1. No painel Site, siga um dos procedimentos abaixo, para acessar as opçõ es das colunas de
visualização de arquivos:
¡ Escolha Exibir > Colunas de visualização de arquivos.
¡ Escolha Site > Editar os sites e, em seguida, clique em Editar. Em seguida, na lista
de categorias à esquerda na caixa de di álogo Definição do site, selecione Colunas de
visualização de arquivos.
Para obter mais informações, consulte Como definir as opções da categoria Colunas de
visualização de arquivos.
3. Clique em OK.
Tópico relacionado
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 92 de 160
Quando o painel Site estiver reduzido, ele exibirá o conteúdo dos sites local e remoto, ou do
servidor de teste como uma lista de arquivos. Quando o painel Site estiver expandido, além do
site local, ele exibirá o site remoto ou o servidor de teste em uma visualização mista. Quando
estiver expandido, o painel Site também pode exibir um mapa visual do site local.
Nota: Para poder exibir um site remoto ou um servidor de teste, é necessário configurá-lo
(consulte Como configurar uma pasta remota ou Como especificar onde as páginas dinâmicas
podem ser processadas). Para poder exibir o mapa de um site, é necessário configurar uma
home page (consulte Como utilizar o mapa do site).
No painel Site, selecione um site no menu pop-up Site (esse é o local onde o nome do site
examinado aparecerá).
Com esse painel reduzido, selecione Visualização local, Visualização remota ou Servidor de
teste, no menu pop-up no qual a visualização estiver sendo exibida.
Nota: Como padr ão, Visualização local aparecerá nesse menu pop-up.
Com esse painel expandido, clique no botão Arquivos do site (no site remoto), Servidor de teste
ou Mapa do site, na barra de ferramentas do painel.
Nota: O botão Mapa do site permite optar pela visualização apenas do mapa do site ou deste e
dos arquivos do site. Para obter mais informações, consulte Como utilizar o mapa do site.
Tópico relacionado
Quando o painel Site estiver em visualização mista, o site local aparecerá, como padrão, no
lado direito do painel Site. Como padrão, o site remoto, servidor de teste ou mapa do site
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 93 de 160
l Arraste a barra de divis ão que separa as duas visualizações, para aumentar ou diminuir a
área de exibição do painel direito ou esquerdo.
l Utilize as barras de rolagem, na parte inferior do painel Site, para rolar pelo conteúdo das
visualizações.
l No mapa do site, arraste a seta acima de um arquivo para alterar o espaço entre os
arquivos.
Tópico relacionado
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 94 de 160
Utilize o painel Site para exibir os sites como listas de arquivos, abrir ou renomear arquivos,
adicionar novas pastas ou arquivos a um site ou atualizar a visualização do site depois de
concluir as altera ções.
Também é possível utilizar o painel Site para determinar quais arquivos (no site local ou
remoto) foram atualizados desde a última vez em que foram transferidos. Para obter mais
informações sobre a sincronização do site local com o remoto, consulte Como sincronizar os
arquivos nos sites local e remoto.
O Dreamweaver criará o novo arquivo ou pasta dentro da pasta que estiver selecionada
ou na mesma pasta do arquivo que estiver selecionado.
2. Para criar uma nova pasta, escolha Arquivo > Nova pasta, no painel Site.
Para criar um novo arquivo, escolha Arquivo > Novo arquivo, no painel Site.
Nota: O Dreamweaver atualizará automaticamente o painel Site quando você fizer alterações
em outro aplicativo e retornar ao Dreamweaver.
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 95 de 160
Para localizar e selecionar os arquivos que forem mais recentes no site local do que
no remoto:
Para localizar e selecionar os arquivos que forem mais recentes no site remoto do que
no local:
No painel Site, é possível procurar um arquivo nos sites local e remoto. Para obter mais
informações sobre como procurar e substituir o texto contido nos arquivos, consulte Busca e
substituição de texto.
1. Abra o arquivo do site remoto ou selecione-o na visualização Site remoto, no painel Site.
2. Siga um dos procedimentos abaixo:
¡ Se tiver aberto o arquivo na janela do documento, escolha Site > Localizar no site.
¡ Se tiver selecionado o arquivo no painel Site, clique com o botão direito do mouse e
selecione Localizar no site local.
1. Abra o arquivo do site local ou selecione-o na visualização Site local, no painel Site.
2. Siga um dos procedimentos abaixo:
¡ Se tiver aberto o arquivo na janela do documento, escolha Site > Localizar no site.
¡ Se tiver selecionado o arquivo no painel Site, clique com o botão direito do mouse e
selecione Localizar no site remoto.
Nota: Se, enquanto a janela do documento estiver ativa, for selecionado Site > Localizar no
site e o arquivo não fizer parte do site que estiver aberto, o Dreamweaver tentará determinar a
qual dos sites definidos localmente pertence o arquivo; se ele pertencer a apenas um site local,
o Dreamweaver abrirá este site e, em seguida, procurará nele o arquivo.
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 96 de 160
O navegador de arquivos integrado do painel Site fornece acesso à área de trabalho e à rede
local, a outros sites definidos e a arquivos que não estiverem associados a um site. Utilize o
navegador de arquivos integrado para efetuar as seguintes operações em arquivos situados fora
do site:
l Arrastar arquivos
l Excluir arquivos
l Renomear arquivos
l Procurar na rede
l Abrir arquivos no Dreamweaver ou em outros aplicativos
l Operações envolvendo sites, como a transferência de arquivos
Nota: Efetue essas opera ções da mesma maneira que aquelas que envolvem arquivos em um
site definido (consulte Sobre o painel Site. A melhor maneira de gerenciar os arquivos consiste
em criar um site do Dreamweaver (consulte Como configurar um site do Dreamweaver).
Quando se arrasta um arquivo de um site para outro ou para uma pasta que não esteja
associada a um site, o Dreamweaver copia o arquivo arrastado para o local em que for solto. Se
o arquivo for arrastado dentro do mesmo site, o Dreamweaver o moverá do local original para o
local em que for solto.
Quando se arrasta um arquivo que não esteja associado a um site, o Dreamweaver o copia para
o local em que for solto. Se o arquivo que não estiver associado ao site for arrastado para uma
outra pasta sem associação com o site, o Dreamweaver o transferir á para o local em que for
solto.
Nota: Para mover um arquivo que o Dreamweaver copia como padrão, mantenha pressionada a
tecla Shift enquanto arrasta o arquivo. Para copiar um arquivo que o Dreamweaver move como
padrão, mantenha pressionada a tecla Control enquanto arrasta o arquivo.
No navegador de arquivos, as pastas do site aparecerão com uma cor diferente das pastas que
não pertencerem a ele, para que se possa distingui-las. Se você tentar efetuar uma operação
no site que afete uma pasta ou arquivo que não esteja associado ao site, o Dreamweaver
solicitará a definição de um site no programa antes de efetuar a opera ção.
Na hierarquia de arquivos do painel Site, clique no sinal de adição (+) ao lado da área de
trabalho.
Utilize a visualização do mapa do site para exibir uma pasta local de um site do Dreamweaver
como um mapa visual de ícones vinculados, adicionar novos arquivos a um site do
Dreamweaver, ou adicionar, modificar ou remover links. A visualização do mapa do site é ideal
para criar o layout da estrutura do site. É possível configurar rapidamente a estrutura inteira do
site e, em seguida, criar uma imagem gráfica do mapa do site.
Nota: O mapa do site se aplica apenas aos sites locais. Para criar o mapa de um site remoto,
copie o conteúdo deste para uma pasta na unidade local e utilize o comando Editar os sites,
para definir o site como sendo local. Para obter mais informações, consulte Como configurar
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 97 de 160
É necessário definir uma home page correspondente ao site antes de exibir o mapa do mesmo.
A home page pode ser qualquer página do site; ela não precisa ser a página principal do site.
Nesse caso, a home page é apenas o ponto de partida do mapa.
4. Clique no ícone da pasta, para procurar a home page do site, ou digite um caminho de
arquivo na caixa de texto Home page.
5. Clique em OK.
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 98 de 160
Selecione Apenas o mapa, para exibir o mapa do site sem a estrutura de arquivos locais,
ou Site e mapa, para exibir o mapa do site e a estrutura de arquivos locais.
Nota: Se você não tiver definido uma home page ou se o Dreamweaver não puder
localizar uma página denominada index.html ou index.htm no site para utilizar como
home page, aparecerá uma caixa de di álogo, solicitando a seleção de uma home page
mediante o clique em Editar os sites. Escolha um site, clique em Editar e, em seguida,
selecione Layout do mapa do site, na lista de categorias à esquerda da caixa de di álogo
Definição do site.
O painel Site exibe um mapa do site, juntamente com a estrutura de arquivos locais.
O mapa do site mostrará os arquivos HTML e outras páginas como ícones. Os links serão
exibidos na ordem em que forem detectados no código-fonte HTML, da seguinte maneira:
Como padrão, o mapa exibe dois níveis da estrutura do site, a partir da home page atual. Clique
nos sinais de adição (+) ou subtração ( -), ao lado de uma página, a fim de mostrar ou ocultar
as páginas vinculadas abaixo do segundo nível, respectivamente.
Como padrão, o mapa do site n ão exibe arquivos ocultos ou dependentes. Os arquivos ocultos
são arquivos HTML marcados como ocultos. O conteúdo das páginas de arquivos dependentes é
diferente de HTML, podendo incluir imagens, modelos, arquivos do Macromedia Shockwave ou
do Macromedia Flash. Para obter mais informações, consulte Como mostrar e ocultar os
arquivos do mapa do site.
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 99 de 160
Utilize as opções do Layout do mapa do site para personalizar a aparência do mapa do site. É
possível especificar a home page, o número de colunas exibidas, se os identificadores de ícones
exibirão o nome do arquivo ou o título da página, e decidir se os arquivos ocultos e
dependentes serão mostrados.
1. Siga um dos procedimentos abaixo, para abrir a caixa de diálogo Defini ção do site:
¡ Escolha Site > Editar os sites e, em seguida, clique em Editar. Na lista de
categorias, à esquerda, selecione Layout do mapa do site.
¡ No painel Site, escolha Site > Layout.
Para obter mais informações, consulte Como definir as opções da categoria Layout do
mapa do site .
Durante o trabalho no mapa do site, é possível selecionar páginas, abrir uma página para
edição, adicionar novas páginas ao site, criar links entre arquivos e alterar os títulos das
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 100 de 160
páginas.
Para selecionar v árias páginas no mapa do site, siga um dos procedimentos abaixo:
l Pressione a tecla Shift e clique, para selecionar uma faixa de páginas adjacentes.
l Inicie em uma parte em branco da visualização e arraste um grupo de arquivos,
para selecioná-los.
l Pressione a tecla Control e dê um clique, para selecionar páginas n ão-contíguas.
Para abrir uma página do mapa do site para ediçã o, siga um dos procedimentos
abaixo:
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 101 de 160
Para alterar a home page no mapa do site, siga um dos procedimentos abaixo:
l Na visualização Site local, no painel Site, selecione um arquivo e, em seguida, clique com
o botão direito do mouse e escolha Definir como home page.
l Na visualização Site local, no painel Site, clique no arquivo a ser transformado em nova
home page e, em seguida, escolha Site > Definir como home page.
l Selecione um arquivo no mapa do site e escolha Site > Nova home page.
l Escolha Site > Editar os sites e clique em Editar. Selecione Layout do mapa do site, na
lista de categorias da caixa de diálogo Definição do site. Procure uma nova home page e,
em seguida, clique em OK.
Para atualizar a visualizaçã o do mapa do site depois de ter conclu ído as alterações:
1. Clique em qualquer ponto do mapa do site, para cancelar a sele ção dos arquivos.
2. Escolha Exibir > Atualizar.
É possível modificar o layout do mapa do site, para mostrar ou não os arquivos ocultos e
dependentes. Esse procedimento é útil quando se deseja enfatizar tópicos ou conteúdos
importantes e retirar a ênfase de materiais menos relevantes.
Para ocultar um arquivo utilizando o mapa do site, é necessário marcar o arquivo como oculto.
Quando um arquivo for ocultado, os links a ele também se tornarão ocultos. Quando um
arquivo marcado como oculto for exibido, o ícone e os links a ele estarão visíveis no mapa do
site, porém os nomes aparecerão em itálico.
Para mostrar ou ocultar os arquivos marcados como ocultos no mapa do site, siga um
dos procedimentos abaixo:
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 102 de 160
É possível exibir os detalhes de uma determinada seção de um site, tomando como ponto de
referência uma das ramificações do mapa do site.
Selecione a página a ser exibida e escolha Exibir > Exibir como raiz.
O mapa do site será redesenhado na janela como se a página especificada estivesse na raiz do
site. A caixa de texto Navegação no site, situada acima do mapa do site, exibe o caminho da
home page até a página especificada. Selecione qualquer item nesse caminho para exibir o
mapa do site a partir desse nível, clicando uma vez.
É possível salvar o mapa do site como uma imagem e, em seguida, exibi-la (ou imprimi-la) em
um editor de imagens.
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 103 de 160
O Dreamweaver salvará o site como um arquivo XML com a extensão STE no local
especificado.
Nota: Para poder importar o arquivo, é necessário exportar o site do Dreamweaver, que o
salvará como um arquivo XML.
4. Clique em Abrir.
O Dreamweaver importará o site, cujo nome aparecerá na caixa de diálogo Editar os sites.
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 104 de 160
Se não desejar mais trabalhar com um site no Dreamweaver, remova-o da lista de sites. Os
arquivos do site não serão removidos.
Nota: Quando um site for removido da lista, todas as informações de configuração sobre o site
serão perdidas em caráter permanente.
4. Clique em Sim, para remover o site da lista, ou em N ão, para manter o seu nome.
5. Clique em Concluída, para fechar a caixa de diálogo Editar os sites.
A retirada de um arquivo equivale a declarar: “Estou trabalhando com este arquivo – não o
toque!”. Quando um arquivo for retirado, o Dreamweaver exibirá no painel Site o nome da
pessoa que o retirou, juntamente com uma marca de seleção vermelha (se um membro da
equipe o tiver retirado), ou verde (se você for essa pessoa) ao lado do ícone do arquivo.
No servidor remoto, o Dreamweaver não modifica o status dos arquivos retirados para somente
leitura. Caso os arquivos sejam transferidos com um aplicativo diferente do Dreamweaver, será
possível sobrescrever os arquivos retirados. No entanto, nos outros aplicativos, o arquivo .LCK
estará visível ao lado do arquivo retirado na hierarquia de arquivos, a fim de evitar acidentes
deste gênero.
Para ativar a opção Devolver/retirar em alguns sites, consulte Como configurar o sistema de
devoluções e retiradas. Para obter mais informações sobre a transferência de arquivos entre os
sites local e remoto sem devolvê-los ou retirá-los, consulte Como obter arquivos de um servidor
remoto ou de teste e Como colocar arquivos em um servidor remoto ou de teste.
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 105 de 160
Nota: É possível utilizar os recursos de obten ção e colocação de arquivos com um servidor de
teste, mas não os recursos de devolução e retirada de arquivos.
Para poder utilizar o sistema de devoluções e retiradas, é necessário associar o site local a um
servidor remoto (consulte Como configurar uma pasta remota).
Nota: Se as opções de devoluções e retiradas não forem exibidas, o servidor remoto não
foi configurado (consulte Como configurar uma pasta remota).
Para obter mais informações, consulte Como definir as opções de devoluções e retiradas.
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 106 de 160
5. Clique em OK.
Se você retirar um arquivo e decidir não editá-lo (ou descartar as altera ções feitas), poderá
desfazer a retirada.
Uma marca de seleção verde aparecerá ao lado do ícone do arquivo, indicando que você o
retirou.
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 107 de 160
4. Clique em Sim no aviso, para efetuar o download dos arquivos dependentes, juntamente
com os arquivos selecionados, ou em Não, para não efetuar o download dos arquivos
dependentes.
Para devolver ou retirar um arquivo que estiver aberto na janela do documento, siga
um dos procedimentos abaixo:
Nota: Se você selecionar Site > Devolver, ou Site > Retirar e o arquivo não fizer parte do
site que estiver aberto, o Dreamweaver tentará determinar a qual dos sites definidos
localmente pertence o arquivo. Se o arquivo pertencer a apenas um site local, o
Dreamweaver abrirá este site e, em seguida, efetuará a opera ção de devolução ou
retirada do arquivo.
Se o arquivo ativo for retirado, a versão aberta deste será substitu ída pela nova versão
retirada. Se o arquivo ativo for devolvido, ele deverá ser automaticamente salvo antes da
devolução, dependendo das opções de preferência definidas (consulte Como definir as
preferências do site).
1. Selecione o arquivo.
2. Siga um dos procedimentos abaixo, para desfazer a retirada do arquivo:
¡ Escolha Site > Desfazer a retirada.
A c ópia local do arquivo se tornará somente de leitura e quaisquer alterações feitas serão
perdidas.
Nota: Se, enquanto a janela do documento estiver ativa, você selecionar Site > Obter, ou
Site > Colocar, e o arquivo não fizer parte do site que estiver aberto, o Dreamweaver tentará
determinar a qual dos sites definidos localmente pertence o arquivo; se ele pertencer a apenas
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 108 de 160
um site local, o Dreamweaver abrirá esse site e, em seguida, executará a opera ção de obtenção
ou coloca ção.
O comando Obter copia arquivos do site remoto ou do servidor de teste para o site local, da
seguinte maneira:
Para obter apenas os arquivos cuja versão remota for mais recente do que a local, utilize o
comando Sincronizar (consulte Como sincronizar os arquivos nos sites local e remoto).
Se já houver uma conexão aberta (indicada pelo botão Desconectar), ignore essa etapa.
Caso os arquivos remotos já estejam vis íveis no painel Remoto devido a uma conexão
anterior, não será preciso clique em Conectar; quando se clica em Obter, o Dreamweaver
estabelece automaticamente a conexão.
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 109 de 160
5. Para efetuar o download dos arquivos dependentes, clique em Sim; para ignorá-los, clique
em Não.
O comando Colocar copia arquivos do site local para o site remoto, geralmente sem alterar o
status de retirada dos mesmos. Há duas situações comuns nas quais é possível utilizar o
comando Colocar em vez de Devolver:
l Utilize Colocar quando você não estiver em um ambiente com muitos usu ários e não
estiver utilizando o sistema de devoluções e retiradas de arquivos.
l Utilize o comando Colocar quando desejar colocar a versão atual do arquivo no servidor e
continuar a editá-lo.
Nota: Caso você coloque um arquivo que ainda não exista no site remoto e esteja
utilizando o sistema de devoluções e retiradas, o arquivo será copiado no site remoto e,
em seguida, retirado, para que você possa continuar a editá-lo.
Para colocar apenas os arquivos cuja versão local for mais recente do que a remota, consulte
Como sincronizar os arquivos nos sites local e remoto.
Nota: Não utilize caracteres especiais (como é, ç ou ¥) ou pontuação, como dois pontos, barras
inclinadas ou pontos nos nomes dos arquivos que ser ão colocados em um servidor remoto ou
de teste. Muitos servidores converterão esses caracteres durante o processo do upload,
provocando a ruptura dos links entre os arquivos.
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 110 de 160
Se o arquivo estiver aberto na janela do documento, será possível escolher Site >
Colocar, na janela do documento.
5. Se o arquivo não tiver sido salvo, é possível que apareça uma caixa de di álogo
(dependendo da definição da prefer ência, no painel Site, na caixa de di álogo
Preferências), que permite salvar o arquivo antes de colocá-lo no servidor remoto.
Para salvar o arquivo, clique em Sim; para colocar a vers ão salva anteriormente no
servidor remoto, clique em N ão. Se preferir não salvar o arquivo, as alterações feitas após
o último salvamento não serão colocadas no servidor remoto. Contudo, o arquivo
continuará aberto para que ainda seja possível salv á-lo arquivo depois de colocá-lo no
servidor.
6. Para efetuar o upload dos arquivos dependentes, clique em Sim; para ignorá-los, clique
em Não.
Se o site remoto já contiver cópias dos arquivos dependentes, clique em Não. Para evitar
perguntas sobre os arquivos dependentes em uploads posteriores, selecione a opção N ão
indague novamente.
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 111 de 160
Depois que os arquivos forem criados nos sites local e remoto, é possível sincronizá-los. Utilize
o comando Site > Sincronizar, para transferir as versões mais recentes dos seus arquivos de e
para o site remoto.
Caso o site remoto seja um servidor de FTP (em vez de um servidor de rede), a sincronização
dos arquivos utilizará o FTP. Para obter mais informações sobre o uso do FTP, consulte Como
configurar uma pasta remota.
Antes de sincronizar os sites, o Dreamweaver permite verificar quais arquivos serão colocados
ou obtidos no servidor remoto. O Dreamweaver também confirmará quais arquivos foram
atualizados após o término da sincronização.
Para verificar quais arquivos são mais recentes no site local ou no site remoto, sem
sincronização, siga um dos procedimentos abaixo:
l Escolha Editar > Selecionar um local mais novo, ou Editar > Selecionar um remoto mais
novo (no painel Site).
l Escolha Site > Arquivos do site Exibir > Selecionar um local mais novo.
Para obter mais informações, consulte Como definir as opções da caixa de diálogo
Sincronizar os arquivos.
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 112 de 160
O encobrimento de sites permite excluir determinadas pastas e tipos arquivos de um site, nas
operações de obtenção e colocação. É possível encobrir pastas individuais, mas não arquivos
individuais. Para encobrir arquivos, é necessário selecionar um tipo de arquivo. O Dreamweaver
encobrirá todos os arquivos desse tipo e memorizará as defini ções de cada site, para evitar que
você tenha que fazer seleções a cada vez que trabalhar no site.
Por exemplo: se estiver trabalhando em um site grande e não desejar efetuar o upload diário
dos arquivos de multim ídia, utilize o encobrimento do site para encobrir a pasta de
componentes de multimídia. O sistema excluirá os arquivos desta pasta das opera ções que
afetarem o site.
É possível encobrir pastas e tipos de arquivos do site remoto ou local. O encobrimento exclui as
pastas e os arquivos encobertos nas seguintes operações:
Para realizar uma opera ção em uma determinada pasta encoberta, basta selecionar o item no
painel Site. A realização direta de uma operação em um arquivo ou uma pasta anula o
encobrimento.
Nota: Também é possível utilizar a opção Desencobrir tudo, para desencobrir todos os
arquivos, mas ela não desativará o encobrimento; também não há uma maneira de encobrir
novamente todas as pastas e os arquivos que estavam anteriormente encobertos, exceto
redefinindo o encobrimento de cada pasta e tipo de arquivo.
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 113 de 160
¡ Selecione um arquivo ou uma pasta e clique com o botão direito do mouse, para
exibir o menu contextual.
3. No submenu, siga um dos procedimentos abaixo:
¡ Selecione Ativar o encobrimento ou Desativar o encobrimento.
É possível encobrir determinadas pastas, mas não todas as pastas ou um site inteiro. É possível
encobrir diversas pastas simultaneamente.
1. No painel Site, selecione um site no menu pop-up Site que possuir a opção de
encobrimento de sites ativada.
2. Selecione a(s) pasta(s) que deseja encobrir ou desencobrir.
3. No painel Site, siga um dos procedimentos abaixo:
¡ Escolha Site > Encobrimento > Encobrir, ou Site > Encobrimento > Desencobrir.
¡ Clique com o botão direito do mouse. Em seguida, escolha Encobrimento >
Encobrir, ou Encobrimento > Desencobrir, no menu contextual.
1. No painel Site, selecione um site no menu pop-up Site que possuir a opção de
encobrimento de sites ativada.
2. Siga um dos procedimentos abaixo:
¡ Escolha Site > Encobrimento > Definições.
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 114 de 160
Por exemplo: .jpg, para encobrir todos os arquivos do site que terminarem com .jpg.
Nota: Separe os diversos tipos de arquivos com um espaço; não utilize vírgulas ou sinais
de dois pontos.
5. Clique em OK.
1. No painel Site, selecione um site no menu pop-up Site que possuir a opção de
encobrimento de sites ativada.
2. Siga um dos procedimentos abaixo:
¡ Escolha Site > Encobrimento > Definições.
¡ Clique com o botão direito do mouse e, em seguida, selecione Encobrimento >
Definições.
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 115 de 160
1. No painel Site, selecione um site no menu pop-up Site que possuir a opção de
encobrimento de sites ativada.
2. Selecione qualquer arquivo ou pasta do site.
3. No painel Site, siga um dos procedimentos abaixo:
¡ Escolha Site > Encobrimento > Desencobrir tudo.
¡ Clique com o botão direito do mouse e, em seguida, escolha Encobrimento >
Desencobrir tudo.
As Design Notes s ão notas que acompanham um arquivo. Elas estão associadas ao arquivo que
descrevem, mas s ão armazenadas em outro arquivo. Utilize as Design Notes para controlar as
informações adicionais relativas aos documentos, como nomes de arquivos de origem de
imagens e comentários sobre o status de arquivos.
Por exemplo: se um documento for copiado de um site para outro, é possível adicionar Design
Notes a esse documento, informando que seu original está na pasta do outro site.
Posteriormente, se esse documento for atualizado, você será informado que é necessário
atualizar também a página original.
O comando Design Notes pode ser utilizado também para controlar informações confidenciais
que não podem ser colocadas no interior de um documento por motivos de segurança. Por
exemplo: podem ser incluídas informaçõ es sobre a criação do documento ou notas sobre a
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 116 de 160
No painel Site é possível ver quais arquivos apresentam Design Notes anexadas: haverá um
ícone de Design Notes na coluna Notas.
Para obter informações gerais sobre a utilização das Design Notes, consulte Como salvar as
informações sobre o arquivo contidas nas Design Notes. Para obter informações sobre a
utilização das Design Notes com o Fireworks, consulte Como utilizar as Design Notes no
Fireworks e no Flash com o Dreamweaver.
Ative ou desative as Design Notes de um site na categoria Design Notes da caixa de diálogo
Definição do site. Ao ativar as Design Notes, é possível optar por utiliz á-las apenas localmente,
se desejar.
Aparecer á a caixa de diálogo Defini ção do site, que apresenta as opções das Design
Notes.
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 117 de 160
Para obter mais informações, consulte Como definir as opções da categoria Design Notes .
5. Clique em OK.
É possível criar um arquivo de Design Notes para cada documento ou modelo do site. Pode-se
criar também Design Notes referentes a miniaplicativos, controles ActiveX, imagens, filmes
Flash, objetos Shockwave e campos de imagem nos documentos.
Nota: Se forem adicionadas Design Notes a um arquivo de modelo, os documentos criados com
esse modelo não as herdarão.
Também é possível selecionar o arquivo no painel Site e, em seguida, escolher Arquivo >
Design Notes.
Para obter mais informações, consulte Como definir as opções da caixa de diálogo Design
Notes.
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 118 de 160
O Dreamweaver salvará as notas em uma pasta denominada _notes, no mesmo local que
o arquivo. O nome do arquivo será o mesmo do arquivo do documento, além da
extensão .mno.
Por exemplo: se o nome do arquivo for índice.html, o arquivo de Design Notes a ele
associado será denominado índice.html.mno.
1. Selecione o objeto.
2. Clique com o botão direito do mouse. Em seguida, escolha Design Notes, no menu
contextual do objeto.
Para obter mais informações, consulte Como definir as opções da caixa de diálogo Design
Notes.
l Selecione um arquivo no painel Site ou abra o arquivo e, em seguida, escolha Arquivo >
Design Notes.
l Na coluna Notas do painel Site, clique duas vezes no ícone amarelo das Design Notes.
6. Clique na guia Informações básicas e observe que o valor do novo status aparecerá no
menu pop-up Status.
Nota: É possível constar apenas um valor personalizado no menu de status de cada vez.
Se esse procedimento for realizado novamente, o Dreamweaver substituir á o valor de
status inserido na primeira vez pelo novo valor.
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 119 de 160
O Dreamweaver solicitará que verifique se as Design Notes que não estão mais
associadas a um arquivo do site deverão ser excluídas.
Nota: Se a opção Manter as Design Notes for cancelada antes de clique em Limpar, o
Dreamweaver excluirá todos os arquivos de Design Notes associados ao site.
fw_source="arquivo:///Meudisco/sites/propriedades/orig/minha_casa.png"
fl_source="arquivo:///Meudisco/sites/propriedades/orig/minha_casa.fla"
Nota: Para poder compartilhar as Design Notes, os usuários devem definir o mesmo caminho
relativo à raiz do site. Por exemplo: sites/propriedades/orig.
Quando a imagem for importada para o Dreamweaver, o arquivo de Design Notes será
automaticamente copiado para o site, juntamente com a imagem. Quando a imagem for
selecionada no Dreamweaver e você decidir editá-la no Fireworks (consulte Como iniciar um
editor externo para arquivos de mídia ), este programa abrirá o arquivo original a ser editado.
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 120 de 160
É possível utilizar os relatórios para aprimorar a colaboração entre os membros de uma equipe
de criação para a Web.
É possível executar relatórios de fluxo de trabalho que exibam as pessoas que retiraram certos
arquivos e quais destes apresentam Design Notes a eles associadas. É possível refinar ainda
mais os relatórios das Design Notes, especificando os parâmetros nome/valor.
Para obter mais informações sobre a execução de outros tipos de relatórios, consulte Como
utilizar os relatórios para testar um site.
Nota: É necessário contar com uma conexão definida a um site remoto, para poder executar os
relatórios de fluxo de trabalho.
1. Abra um documento.
2. Escolha Site > Relatórios.
4. Clique em Executar.
Dependendo do relatório a ser criado, será necessário salvar o arquivo, definir o site ou
selecionar uma pasta (se ainda não o tiver feito).
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 121 de 160
1. No painel Relatórios de site, clique no cabeçalho da coluna de acordo com a qual deseja
ordenar os resultados.
3. Clique duas vezes em qualquer linha do relatório, para exibir o código correspondente na
janela do documento.
Quando o relatório for salvo, ele poderá ser importado para um arquivo existente de modelo.
Em seguida, é possível importar o arquivo para um banco de dados ou planilha, e imprimir ou
exibi-lo em um site da Web.
Nota: O Sitespring está disponível apenas em inglês. Observe que os comandos de menu e as
tomadas de tela da interface mostrados nessa seção estão em inglês.
Requisitos do sistema
Para poder utilizar o painel Tarefas Sitespring com o Dreamweaver, é necessário que o
Dreamweaver MX ou mais avançado e o Sitespring estejam instalados no sistema ou no
servidor. Se o Sitespring ainda não estiver instalado, efetue o download de uma versão de teste
gratuita no site da Web Macromedia Sitespring. O Sitespring é compatível apenas com os
navegadores mais recentes que apresentam o Flash ativado, como o Netscape Communicator
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 122 de 160
Para poder utilizar o painel Sitespring, é necessário se conectar e efetuar o logon no servidor
Sitespring.
Nota: Para obter mais informações sobre como utilizar o Macromedia Sitespring, consulte a
documentação do mesmo.
1. Na janela do documento, escolha Janela > Outros > Sitespring, ou pressione a tecla F7.
Nota: Apenas essa opção permite fechar e abrir o painel Sitespring novamente,
dispensando a necessidade de digitar qualquer informação de logon. Se tiver efetuado o
logoff completo do Sitespring, através do Dreamweaver ou do próprio aplicativo, será
necessário digitar essas informações novamente.
O status da conexão aparecerá acima da caixa de texto Servidor Sitespring. Assim que a
conexão for estabelecida, o painel Sitespring exibirá as tarefas.
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 123 de 160
Utilize o painel Sitespring para visualizar todas as tarefas ou apenas aquelas associadas a um
determinado projeto. É possível editar uma tarefa e atualizar a lista de tarefas, para examinar
as alterações. A caixa de texto Tarefas exibe as tarefas, sua prioridade, seu status, data de
vencimento e o nome do projeto.
1. Na janela do documento, escolha Janela > Outros > Sitespring, ou pressione a tecla F7.
2. Efetue o logon no servidor Sitespring, se ainda não o tiver feito (consulte Como se
conectar ao servidor Sitespring).
O painel Sitespring exibe as tarefas atuais. Ele consiste de uma caixa de texto Tarefas,
que exibe as tarefas abertas, além de um menu e ícones para realizar certas ações. As
tarefas são ordenadas por nome. Clique no cabeçalho de uma coluna, para ordenar de
acordo com a mesma. O painel Sitespring não exibe tarefas com o status Suspenso or
Concluído.
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 124 de 160
Nota: Para evitar efetuar o logon repetidas vezes, é recomendável fechar o painel
Sitespring, ao inv és de efetuar o logoff.
¡ Clique no link Logoff, para efetuar o logoff do Sitespring ou para alterar o usuário.
Aparecer á a caixa de diálogo Logon em Sitespring. Digite outro nome de usuário e outra senha
para alterar o usuário, ou feche a caixa de di álogo, para efetuar a desconexão (consulte Como
efetuar o logoff do Sitespring no Dreamweaver).
Ao clicar no link Logoff no painel Sitespring, você também estará efetuando o logoff do
Sitespring no Dreamweaver.
Na pr óxima vez em que você acessar o painel Sitespring, não será necessário digitar a URL
novamente para se conectar (a não ser que você deseje acessar outro servidor Sitespring),
porém será necessário digitar a sua senha.
Referência
Esta seção contém informações sobre as caixas de diálogo apresentadas neste capítulo.
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 125 de 160
Procedimento
Mostrar sempre especifica qual site (remoto ou local) será sempre mostrado e em que
local do painel Site (esquerdo ou direito) aparecerão os arquivos locais e remotos.
Como padrão, o site local aparecerá sempre à direita. O painel que n ão for escolhido
(como padrão, o esquerdo) será variável: ele poderá exibir o mapa do site ou os arquivos
do outro site (como padrão, o site remoto).
Dica: Para forçar a solicitação Incluir os arquivos dependentes a aparecer mesmo quando
essas opções estiverem desmarcadas, pressione a tecla Alt (no Windows) enquanto
escolhe os comandos Obter, Colocar, Devolver ou Retirar.
Conexão de FTP determina se a conexão ao site remoto será terminada após o número
especificado de minutos sem atividade.
Se não houver resposta após o tempo especificado, o Dreamweaver exibirá uma caixa de
diálogo de advertência, alertando-o para esse fato.
Caso contrário, deixe esse espaço em branco. No caso de estar atrás de uma firewall,
selecione a opção Utilizar a firewall, na caixa de diálogo Defini ção do site. Consulte Como
configurar uma pasta remota.
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 126 de 160
Editar os sites exibe a caixa de diálogo Editar os sites, onde é possível editar um site
existente ou criar um novo site.
2. Clique em OK.
Tópico relacionado
O objetivo desta caixa de diálogo é efetuar alterações nas colunas de visualização de arquivos
do painel Site. É possível alterar a ordem das colunas, adicionar ou excluir uma coluna.
Selecione o nome de uma coluna e, em seguida, clique no botão de seta acima ou seta abaixo,
para alterar a posição da coluna selecionada.
Nota: É possível modificar a ordem de qualquer coluna, exceto a coluna Nome, que é sempre a
primeira.
É necessário associar uma nova coluna à Design Note, para que haja dados a serem
exibidos no painel Site.
Selecione uma coluna a ser excluída e, em seguida, clique no botão com o sinal de subtração ( -
).
Nota: A coluna ser á excluída imediatamente e sem confirmação, portanto certifique-se que
deseja exclui-la antes de clique no botão com o sinal de subtração ( -).
Tópico relacionado
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 127 de 160
Procedimento
1. Na caixa de texto Home Page, digite um caminho de arquivo até a home page do site ou
clique no ícone da pasta, para procurar o arquivo.
É necessário que a home page esteja no site local. Se você não especificar uma home
page ou se o Dreamweaver não localizar um arquivo denominado index.html ou
index.htm na raiz, o programa solicitará a seleção de uma home page quando o mapa do
site for aberto.
Se uma página estiver oculta, o seu nome e os links a ela aparecerão em itálico.
Para obter informações sobre como ocultar os arquivos, consulte Como mostrar e
ocultar os arquivos do mapa do site.
Tópico relacionado
Procedimento
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 128 de 160
Esta opção é útil para informar aos outros usuários sobre a retirada de um arquivo para
edição, ou para alertar a si próprio que uma versão mais recente de um arquivo foi
deixada em um outro computador.
Nota: A utilização da opção Arquivo > Abrir, para abrir um arquivo não o retira, mesmo
quando esta estiver selecionada.
O nome de retirada aparecerá no painel Site, juntamente com qualquer arquivo que for
retirado; isso permitirá que os membros da equipe se comuniquem com a pessoa certa se
um arquivo necessário tiver sido retirado.
Tópico relacionado
Procedimento
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 129 de 160
Se for escolhida a opção Colocar os arquivos mais novos no remoto e selecionada a opção
Excluir, o Dreamweaver excluirá os arquivos do site remoto que não tiverem
correspondentes locais. Se for escolhido Obter os arquivos mais novos do remoto, o
Dreamweaver excluirá os arquivos do site local que não tiverem correspondentes
remotos.
4. Clique em Visualizar.
Se a vers ão mais recente de cada arquivo escolhido já estiver em ambos os lugares e não
houver nada a ser excluído, aparecerá um alerta informando-lhe que a sincronização não
será necessária.
6. Clique em OK.
Tópico relacionado
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 130 de 160
Se essa opção estiver selecionada, será possível compartilhar as Design Notes com os
outros membros de sua equipe. Quando um arquivo for colocado ou obtido, o
Dreamweaver automaticamente colocará ou obterá o arquivo de Design Notes a ele
associado.
3. Clique em OK.
As Design Notes não serão transferidas para o site remoto quando os arquivos forem
devolvidos/retirados. Você ainda poderá adicionar e modificar localmente as Design Notes do
site.
Tópicos relacionados
Procedimento
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 131 de 160
atual local.
3. Digite os comentários na caixa de texto Notas.
4. Para que o arquivo de Design Notes seja sempre aberto simultaneamente à abertura do
arquivo, selecione Mostrar quando o arquivo estiver aberto.
5. Na guia Todas as informações, clique no botão com o sinal de adição (+) para adicionar
um novo par chave/valor; selecione um par e clique no bot ão com o sinal de subtração ( –
) para removê-lo.
Por exemplo: denomine uma chave Autor (na caixa de texto Nome) e defina o valor como
sendo Henfil (na caixa de texto Valor).
6. Clique em OK.
Tópicos relacionados
Procedimento
Tópicos relacionados
Configura çã o de um documento
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 132 de 160
possível criar e abrir documentos CFML, ASP, JavaScript, CSS ou documentos de texto.
A caixa de diálogo Novo documento fornece diversos tipos de documentos dos quais é possível
criar um novo documento. Nessa interface fácil de utilizar, é possível criar um novo documento
ou um modelo em branco, um documento com base em modelos existentes ou um documento
ou modelo com base em um dos layouts de p ágina projetados fornecidos com o Dreamweaver.
É possível utilizar esses modelos e layouts de página projetados básicos para rapidamente
começar a desenvolver páginas da Web com aparência profissional.
Outras opções de documentos também estão disponíveis na caixa de di álogo Novo documento.
É possível selecionar documentos de texto, tais como documentos JavaScript ou CSS (Folha de
estilo em cascata, Cascading Style Sheet), e documentos de página dinâmica, como páginas
Macromedia ColdFusion, Microsoft Active Server Pages (ASP) e PHP. Se geralmente o usuário
trabalha com um tipo de documento, poderá defini-lo como o tipo de documento padrão para as
novas páginas que criar.
A caixa de diálogo Novo documento exibe diversos tipos de documentos dos quais é possível
criar uma nova página. O Dreamweaver abre a caixa de diálogo Novo documento ao escolher
Arquivo > Novo. Se o usuário trabalha predominantemente com um tipo de documento, como
páginas HTML, ColdFusion ou páginas ASP (Active Server Pages), convém configurar um tipo de
documento padrão. A configuração de um tipo de documento padr ão permite ao usuário abrir
um novo documento de um tipo preferido ao criar um novo documento sem ter de abrir a caixa
de diálogo Novo documento.
Tópicos relacionados
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 133 de 160
A caixa de diálogo Novo documento fornece diversas opções para a seleção de um novo
documento de trabalho. É possível criar um novo documento das seguintes maneiras:
A guia Geral contém vários tipos de documento que podem ser utilizados para criar uma nova
página em branco. É possível selecionar um novo documento nas categorias Página básica,
Página din âmica e Conjunto de molduras. Crie uma página com base em um tipo de arquivo
especial, como arquivos CSS, JavaScript, VBScript ou de texto, selecionando um documento na
categoria Outro. A categoria Modelos fornece diversos tipos de documentos dos quais é possível
criar um modelo em branco, como modelos HTML e modelos nos quais é possível inserir
comportamentos de servidor.
As categorias Folhas de estilos CSS, Projetos de página e Projetos de páginas (acess íveis)
fornecem arquivos de design pré-criados que você pode utilizar para criar suas próprias
páginas. No caso de folhas de estilos CSS, é possível copiar uma folha de estilos padronizada e,
depois, aplicá-la ao documento.
Dependendo do tipo de documento selecionado, outras opções são exibidas na caixa de diálogo.
Se for selecionado um documento HTML, por exemplo: é possível tornar o documento
compatível com XHTML. Ao selecionar um arquivo de Projetos de página, é possível criar um
documento ou um modelo.
A guia Modelos contém uma lista de sites do Dreamweaver definidos pelo usuário. É possível
escolher um modelo de qualquer um dos sites listados para criar novos documentos com base
nesse modelo.
Selecione uma categoria para ver uma lista de tipos de documentos disponíveis na lista
Documentos, exibida à direita. Quando o usuário clica em um documento da lista, é exibida a
descri ção correspondente e, no caso de documentos das categorias Projetos de página, Folhas
de estilos CSS e Conjuntos de molduras, uma visualização do documento selecionado.
É possível utilizar a opção Preferências, localizada na parte inferior da caixa de diálogo Novo
documento, para definir preferências para o documento padrão, como tipo de documento,
codificação e extensão de arquivo. Além disso, é possível definir uma opção para abrir um novo
documento automaticamente sem utilizar a caixa de di álogo Novo documento. Para obter
informações sobre a definição das preferências de um documento, veja Definição de
preferências do novo documento.
Utilize o link Obter mais conteúdo, exibido na caixa de diálogo Novo documento, para ir para o
Dreamweaver Exchange e efetuar o download de mais conteúdo para o projeto da página.
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 134 de 160
É possível utilizar a caixa de diálogo Novo documento para selecionar o tipo de documento que
se deseja criar.
Se, geralmente, você trabalha com um tipo de documento específico, poderá definir um
documento padrão e automaticamente abrir um novo documento com base no documento
padrão por ele definido. Para obter informações, veja Definição de preferências do novo
documento.
Por exemplo: selecione Página básica para criar um documento HTML ou Página dinâmica
para criar um documento ColdFusion ou ASP e assim por diante.
3. Na lista de documentos, selecione o tipo de página que deseja criar e siga um dos
procedimentos abaixo:
¡ Clique em Criar.
O Dreamweaver vem com diversos arquivos de elementos de design e de layout de página com
aparência profissional. É possível utilizar esses arquivos de projeto como pontos de partida para
criar páginas do seu próprio site.
Os arquivos de projeto incluem documentos e modelos que seguem padr ões de acessibilidade,
documentos de layout de página com base em tabelas e Folhas de estilos CSS. É possível
visualizar um documento e ler uma breve descrição dos respectivos elementos de design de
itens nas categorias Folhas de estilos CSS, Conjuntos de molduras, Projetos de página e
Projetos de página (acessíveis).
Ao criar um documento com base em um arquivo de projeto, o Dreamweaver cria uma c ópia do
arquivo. Se o arquivo de projeto inclui links para arquivos de propriedades (tais como imagens,
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 135 de 160
elementos Flash ou uma Folha de estilos CSS externa), ao salvar o documento, o Dreamweaver
solicita que salve uma c ópia dos arquivos dependentes. Selecione o local dos arquivos
dependentes, conforme a sua preferência, ou utilizar a localização da pasta padr ão gerada pelo
Dreamweaver (com base no nome de origem do arquivo de projeto).
Também é possível criar um novo modelo a partir de um arquivo de projeto. O modelo já possui
regi ões editáveis definidas. É possível criar novas regi ões editáveis no modelo. O usuário será
solicitado a salvar o arquivo como um modelo para o site atual. Arquivos vinculados também
serão copiados para o site.
Nota: Se for criado um documento com base em um conjunto de molduras predefinido, apenas
a estrutura do conjunto de molduras será copiada e não o conteúdo da moldura. Além disso,
será necessário salvar cada arquivo de moldura separadamente. Para obter informações sobre
como salvar molduras, veja Como salvar arquivos de moldura e de conjunto de molduras.
A lista de documentos à direita é atualizada com uma seleção de Folhas de estilos CSS.
¡ Pressione Enter.
Se o arquivo tiver links para arquivos de propriedades, será exibida a caixa de diálogo
Copiar os arquivos dependentes.
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 136 de 160
A caixa de diálogo Novo documento pode ser utilizada para selecionar, visualizar e criar um
novo documento a partir de um modelo existente. É possível selecionar um modelo de
quaisquer sites definidos pelo Dreamweaver.
Para obter mais informações sobre como trabalhar com modelos e documentos baseados em
modelos, consulte o Sobre os modelos do Dreamweaver.
1. Escolha Arquivo > Novo para abrir a caixa de diálogo Novo documento.
2. Na guia Modelos, na lista Modelos para, selecione o site do Dreamweaver que contém o
modelo desejado.
3. A lista Site exibe modelos no site selecionado, se houver.
4. Selecione o modelo a ser utilizado.
5. Desmarcar a opção Atualizar a página quando o modelo for alterado se desejar desanexar
o novo documento do modelo.
6. Clique em Criar.
7. Salve o documento.
Salva de um documento
Ao salvar um documento, evite utilizar espaços e caracteres especiais nos nomes de arquivos e
pastas. Particularmente, não utilizar caracteres especiais (como é, ç ou ¥) ou pontuação (como
dois pontos, barras inclinadas ou pontos) nos nomes dos arquivos que serão colocados em um
servidor remoto; muitos servidores alteram esses caracteres durante o upload, o que causa o
rompimento dos links para os arquivos. Além disso, não colocar um número no início de um
nome de arquivo.
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 137 de 160
Também é possível abrir arquivos de texto diferentes de HTML, tais como arquivos JavaScript,
arquivos XML, Folhas de estilos CSS ou arquivos de texto salvos por processadores ou editores
de texto.
Se o documento a ser aberto é um arquivo do Microsoft Word 97, Word 98 ou Word 2000 salvo
como HTML, conv ém importá-lo para o Dreamweaver em vez de abri-lo. Ao importar um
arquivo HTML do Word, o Dreamweaver solicita limpar as tags de markup irrelevantes que o
Word insere em arquivos HTML. É possível utilizar o comando Limpar o HTML do Word para
definir uma cor de fundo para a página e limpar a formatação da Folha de estilos CSS no
documento importado.
Nota: Por padrão, documentos JavaScript, de texto e de Folhas de estilos CSS são
abertos na visualização do c ódigo. Para obter informações sobre como alterar a defini ção
de um editor de texto externo e exibir esses tipos de arquivos, veja Como iniciar um
editor externo para arquivos de m ídia .
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 138 de 160
4. Escolha opções na guia B ásica ou Detalhes para selecionar as opções de limpeza a serem
aplicadas ao documento.
Para obter mais informações sobre as op ções de limpeza, veja Como limpar o HTML do
Microsoft Word.
5. Clique em OK.
1. Salve o documento.
Os títulos de páginas, as cores e imagens de fundo, as cores do texto e dos links e as margens
são propriedades básicas de todo documento HTML. O t ítulo da página identifica e nomeia o
documento. Uma cor ou imagem de fundo define a aparência geral do documento. As cores do
texto e dos links ajudam os visitantes do site a distinguir entre texto comum e hipertexto e
também a identificar os links que foram ou não visitados.
Para obter informações sobre como preencher a caixa de diálogo Propriedades da página, veja
Sele ção de opções de Propriedades da página.
O título de uma página HTML ajuda os visitantes do site a controlar o que estão exibindo
enquanto navegam e também identifica a página nas listas de histórico e marcadores do
visitante. Se uma página não tiver um t ítulo, ela será exibida na janela do navegador e nessas
listas como um Documento sem título. Observar que o ato de salvar um documento e lhe
atribuir um nome não é o mesmo que dar um título a uma página. Para localizar todos os
documentos sem título existentes no site, utilizar o comando > Relatórios do site; veja Como
utilizar os relatórios para testar um site.
¡ Escolha Exibir > Barra de ferramentas (se ainda não estiver selecionada).
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 139 de 160
Para definir uma imagem ou cor de fundo da página, utilizar a caixa de diálogo Propriedades da
página. Se utilizar tanto uma imagem de fundo quanto uma cor de fundo, a cor aparecerá
durante o download da imagem e, então, esta cobrirá a cor. Se a imagem de fundo contiver
algum pixel transparente, a cor de fundo transparecerá.
3. Para definir uma cor de fundo, clique na caixa Cor de fundo e selecionar uma cor no
seletor de cores.
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 140 de 160
Deve-se observar que as paletas Cubos de cor e Tom contínuo são aceitas pela
Web, mas as paletas Windows, Mac OS e Tons de cinza não s ão. Se estiver
utilizando uma paleta que não for aceita pela Web e, em seguida, escolher Passar à
cor aceita pela Web, o Dreamweaver substituirá a cor selecionada pela cor mais
próxima aceita pela Web. Em outras palavras, é possível que a cor não corresponda
à que for visualizada.
¡ Para limpar a cor atual sem ter de escolher outra cor, clique no botão Tachado.
¡ Para abrir o seletor de cores do sistema, clique no botão Roda de cores. Para obter
mais informações, veja Sobre as cores aceitas pela Web.
Em HTML, as cores são expressas como valores hexadecimais (por exemplo: #FF0000) ou como
nomes de cores (vermelho). Uma cor aceita pela Web tem a mesma aparência no Netscape
Navigator e no Microsoft Internet Explorer nos sistemas Windows em execução no modo de 256
cores. Na prática, diz-se que h á 216 cores comuns e que qualquer valor hexadecimal que
combine os pares 00, 33, 66, 99, CC ou FF (valores RGB 0, 51, 102, 153, 204 e 255,
respectivamente) representa uma cor aceita pela Web.
No entanto, testes revelam que existem somente 212 cores aceitas pela Web em vez de 216,
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 141 de 160
No Dreamweaver, as paletas Cubos de cor (padr ão) e Tom contínuo utilizam a paleta de 216
cores aceitas pela Web; a sele ção de uma cor de uma dessas paletas exibir á o valor
hexadecimal da cor.
Para escolher uma cor fora da faixa de cores aceitas pela Web, abrir o seletor de cores do
sistema, clicando no botão Roda de cores, localizado no canto superior direito do seletor de
cores do Dreamweaver. O seletor de cores do sistema não se limita às cores aceitas pela Web.
As versões para UNIX do Netscape Navigator utilizam uma paleta de cores diferente daquela
usada nas versões para Windows e Macintosh. Se a programação for exclusiva para
navegadores UNIX (ou se o público-alvo for composto por usuários do Windows ou Macintosh
com monitores de 24 bits e por usuários do UNIX com monitores de 8 bits), deve-se considerar
a possibilidade de utilizar valores hexadecimais que combinem os pares 00, 40, 80, BF ou FF,
que produzem cores aceitas pela Web para o SunOS.
Defina as cores padrão do texto comum, links, links visitados e dos links ativos na caixa de
diálogo Propriedades da página ou escolher um esquema de cores predefinido para definir as
cores do texto e do fundo da página (veja Como trabalhar com as cores).
Nota: A cor dos links ativos é a cor assumida por um link quando se clica nele. Alguns
navegadores da Web podem não utilizar a cor que você especificar.
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 142 de 160
Alguns objetos são exibidos na página em um lugar diferente de onde foi inserido o código
correspondente. Por exemplo: uma camada pode estar em qualquer posi ção na página,
mas o código que a define estará em uma posição fixa. Quando os elementos invisíveis
estiverem sendo exibidos, o Dreamweaver mostrará os marcadores na janela do
documento para indicar a localização do c ódigo de tais elementos. A sele ção de um
marcador seleciona o elemento inteiro. Por exemplo: a seleção do marcador de uma
camada seleciona toda a camada (veja Sobre os elementos invisíveis).
l Para selecionar uma tag completa (inclusive o seu conteúdo, se houver), clique em uma
tag do seletor de tags, localizado na parte inferior esquerda da janela do documento (o
seletor de tags é exibido tanto na visualização do projeto como na visualização do
código). O seletor sempre mostra as tags que contêm a sele ção atual ou o ponto de
inser ção. A tag mais à esquerda é a tag mais externa que contém a sele ção atual ou o
ponto de inserção. A tag seguinte está contida na tag mais externa e assim por diante. A
tag mais à direita é a tag mais interna, que contém a sele ção atual ou o ponto de
inser ção.
No exemplo a seguir, o ponto de inserção está em uma tag de parágrafo, <p>. Para
selecionar a tabela na qual há um marcador de parágrafo, selecione a tag <table> à
esquerda da tag <p>.
Para ver o c ódigo HTML associado ao texto ou objeto selecionado, seguir um dos
procedimentos abaixo:
Para obter mais informações sobre a visualização do c ódigo, veja Exibição do seu c ódigo.
Alguns códigos HTML não possuem uma representação visível em um navegador. Por exemplo:
as tags comment não s ão exibidas nos navegadores. Entretanto, enquanto se está criando uma
página, pode ser útil selecionar tais elementos invisíveis, edit á-los, movê-los e excluí-los. O
Dreamweaver permite especificar se ícones devem ser exibidos marcando a localização de
elementos invisíveis na visualização do projeto da janela do documento.
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 143 de 160
Para exibir ou ocultar os ícones marcadores de elementos invisíveis, escolher Exibir > Aux ílios
visuais > Elementos invisíveis. A exibi ção de elementos invisíveis permite selecioná-los e alterar
as suas propriedades no inspetor de propriedades. A sua ocultação permite examinar a p ágina
mais detalhadamente, da maneira como ela será exibida no navegador. Observar que a exibição
dos elementos invisíveis pode alterar levemente o layout da página, movendo outros elementos
alguns pixels. Portanto, para obter uma precisão no layout, deve-se ocultar os elementos
invisíveis.
Para indicar os marcadores de elementos que são exibidos ao escolher a op ção Exibir > Auxílios
visuais > Elementos invisíveis, é possível definir opções nas preferências de Elementos
invisíveis. Por exemplo: pode-se especificar que as âncoras com nome deverão ficar visíveis,
mas não as quebras de linha. Veja Definição das preferências de elementos invisíveis.
É possível criar determinados elementos invis íveis (tais como comentários e âncoras com nome)
utilizando botões da categoria Comuns da barra Inserir (veja Utilização da barra Inserir:). Em
seguida, é possível modificar esses elementos utilizando o inspetor de propriedades.
O Dreamweaver fornece diversos tipos de guias visuais para auxiliá-lo a projetar os documentos
e prever (aproximadamente) a aparência que eles terão nos navegadores. Siga todos os
procedimentos abaixo:
As réguas podem ser exibidas nas bordas superior e esquerda da página, marcadas em pixels,
polegadas ou centímetros.
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 144 de 160
l Para mostrar ou ocultar as réguas, escolher Exibir > Réguas > Mostrar.
l Para alterar a origem, arrastar o ícone de origem da régua para qualquer lugar na página.
Este ícone é exibido no canto superior esquerdo da visualização do projeto da janela de
documento enquanto as réguas estão sendo exibidas. Para redefinir a origem para a
posição padrão, escolher Exibir > Réguas > Redefinir a origem.
l Para alterar a unidade de medida, escolher Pixels, Polegadas ou Centímetros no submenu
Exibir > R éguas.
Utilize uma imagem de rastreamento como guia para recriar o projeto de uma página da qual
foi feito um protótipo em um aplicativo gráfico. As imagens de rastreamento são imagens JPEG,
GIF ou PNG que s ão colocadas no fundo da janela do documento. É possível ocultar a imagem,
definir a sua opacidade e alterar a sua posição.
A imagem de rastreamento fica vis ível apenas no Dreamweaver. Ela nunca fica visível quando a
página é exibida em um navegador. Quando a imagem de rastreamento fica visível, a imagem e
a cor de fundo reais da página não podem ser visualizadas na janela do documento; contudo,
elas aparecem quando a página é exibida em um navegador.
Escolha Exibir > Imagem de rastreamento > Ajustar a posição. Depois, seguir um dos
procedimentos abaixo:
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 145 de 160
Escolha Exibir > Imagem de rastreamento > Redefinir a posição. A imagem de rastreamento
retorna ao canto superior esquerdo da janela do documento (coordenadas 0,0).
Os arquivos HTML são compostos por duas seções principais: a seção head e a se ção body. A
seção body é a parte principal do documento, a parte visível que contém texto, imagens, etc. A
seção head é a parte invisível, com exceção do título do documento, que é exibido nas barras
de título das janelas dos navegadores e do Dreamweaver. Cada página criada deve ter um
título.
A seção head tamb ém contém outras informações importantes, como o tipo do documento, a
codificação de idioma, as funções e vari áveis JavaScript e VBScript, as palavras-chave e os
indicadores de conteúdo para os mecanismos de pesquisa, bem como definições de estilo. Não é
necessário fornecer todos esses elementos para cada página; é possível, por exemplo: fornecer
somente as palavras-chave e os indicadores de conteúdo da home page. É possível exibir os
elementos da seção head utilizando-se o menu Exibir, a visualização do c ódigo da janela do
documento ou o inspetor de código.
Escolha Exibir > Conteúdo do HEAD. Para cada elemento do conteúdo do head, é exibido um
marcador na parte superior da janela do documento na visualização do projeto.
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 146 de 160
tópicos a seguir:
Ao criar documentos, talvez se deseje executar a mesma tarefa várias vezes. Esta seção explica
como utilizar o painel Hist órico para automatizar tarefas repetitivas.
Para repetir uma s érie de etapas uma ou duas vezes, deve-se executá-las diretamente no
painel Histórico, que registra as etapas executadas pelo usuário enquanto ele trabalha em um
documento (para informaçõ es básicas sobre o painel Histórico, veja Sobre o painel Histórico).
Para automatizar uma tarefa realizada com freqüência, deve-se criar um novo comando que
execute essa tarefa automaticamente.
Alguns movimentos do mouse, como o ato de clique ou arrastar para selecionar um elemento
na janela do documento, não poderão ser executados ou salvos como parte de comandos
salvos. Ao realizar um destes movimentos, uma linha preta é exibida no painel Histórico
(embora a linha não estará ó bvia enquanto uma outra ação não for efetuada). Para evitar
movimentos que não podem ser executados novamente, utilizar as teclas de seta em vez do
mouse para mover o ponto de inserção na janela do documento. Para efetuar ou estender uma
seleção, manter pressionada a tecla Shift ao pressionar uma tecla de seta.
Nota: Se uma linha preta de indicação do movimento do mouse aparecer enquanto você estiver
executando uma tarefa que deseja repetir mais tarde, é possível desfazer até antes desta etapa
e tentar novamente, talvez utilizando as teclas de seta.
Algumas outras etapas específicas também não podem ser repetidas, como arrastar um
elemento de página para outro local na página. Ao efetuar uma destas etapas, um ícone de
comando de menu com um pequeno X vermelho é exibido no painel Histórico.
As etapas serão repetidas da mesma forma como foram executadas originalmente. Elas não
podem ser modificadas enquanto estiverem sendo executadas. Por exemplo: se a cor de
uma célula de tabela tiver sido anteriormente alterada para vermelho, a aplicação dessa etapa a
uma outra célula de tabela também alterará sua cor para vermelho; é imposs ível especificar
uma cor diferente quando a mesma etapa é aplicada a uma nova célula.
Repetiçã o de etapas
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 147 de 160
Para repetir a última etapa executada, utilizar o comando Editar >Repetir ou o atalho de teclado
Control+Y. O nome deste comando do menu Editar é alterado para refletir a última etapa
executada; por exemplo: se a última etapa tiver sido a digitação de um texto, o nome do
comando será Repetir a digitação ( é imposs ível utilizar o comando Repetir imediatamente após
uma operação Desfazer ou Refazer).
Para repetir as etapas que diferirem da mais recente ou para repetir diversas etapas ao mesmo
tempo, utilizar o painel Histórico (para informações básicas sobre o painel Histórico, veja Sobre
o painel Histórico).
Observar que as etapas executadas novamente serão aquelas que tiverem sido selecionadas
(realçadas) e não necessariamente a etapa que está indicada pelo controle deslizante.
No painel Histórico, selecione a etapa e clique no botão Executar novamente. A etapa será
executada novamente e uma c ópia dela será exibida no painel Histórico.
Nota: Embora seja possível selecionar uma série de etapas que inclui uma linha
preta de indicação do movimento do mouse, esse movimento do mouse é ignorado
quando as etapas são executadas novamente.
1. Selecione uma etapa e, em seguida, manter a tecla Control pressionada e clique nas
outras etapas.
Também é possível clique na etapa selecionada mantendo a tecla Control pressionada (no
Windows) para desmarcar uma etapa selecionada.
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 148 de 160
1. Selecione o objeto.
2. Selecione as etapas relevantes no painel Histórico e, em seguida, clique em Executar
novamente.
Para aplicar uma série de etapas a cada objeto existente em um conjunto de objetos, é
necessário que a última etapa da série selecione o próximo objeto do conjunto. O procedimento
a seguir demonstra este princípio em uma determinada situação: defini ção do espaçamento
vertical e horizontal de uma série de imagens.
1. Inicie com um documento no qual cada linha consiste em uma pequena imagem (como
um marcador gr áfico ou um ícone) seguida de texto. O objetivo é manter as imagens
afastadas do texto e de outras imagens acima e abaixo delas.
2. Abra o inspetor de propriedades (Janela > Propriedades) caso não esteja aberto.
3. Selecione a primeira imagem.
4. No inspetor de propriedades, digite números nas caixas de texto Espaço V e Espaço H
para definir o espaçamento entre as imagens.
5. Clique na imagem novamente para tornar a janela do documento ativa sem mover o
ponto de inserção.
6. Pressione a tecla de seta à esquerda para mover o ponto de inserção para a esquerda da
imagem. Em seguida, pressionar a tecla de seta para baixo a fim de mover o ponto de
inser ção uma linha abaixo, deixando-o à esquerda da segunda imagem da série.
Pressione as teclas Shift+seta à direita para selecionar a segunda imagem.
Nota: Não selecionar a imagem clicando nela, pois desse modo não será possível
executar todas as etapas novamente.
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 149 de 160
8. Continuar clicando em Executar novamente até que todas as imagens sejam espaçadas
da forma correta.
Para aplicar etapas a um objeto de um outro documento, utilizar o botão Copiar as etapas; veja
Como copiar e colar as etapas entre documentos.
Cada documento aberto tem seu próprio histórico de etapas. É possível copiar as etapas de um
documento e colá-las em outro.
Nota: Copie as etapas (um botão do painel Histórico) é diferente de Copiar (no menu Editar). É
imposs ível utilizar Editar > Copiar para copiar as etapas, embora elas sejam coladas com o
comando Editar > Colar.
As etapas que incluem um comando Copiar ou Colar devem ser copiadas com cuidado:
l Não utilizar Copiar as etapas se uma das etapas for um comando Copiar; talvez não seja
possível colar estas etapas da maneira desejada.
l Se as etapas incluírem um comando Colar, será imposs ível colá-las, a n ão ser que
também incluam um comando Copiar antes do comando Colar.
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 150 de 160
de c ódigo, elas serão exibidas como c ódigo JavaScript. Este procedimento poderá ser útil para
aprender como gravar os seus pr óprios scripts. Para obter mais informações sobre como utilizar
o JavaScript no Dreamweaver, veja Como gravar e editar o código.
As etapas serão executadas novamente à medida que forem coladas no painel Histórico
do documento. O painel Histórico mostra as etapas como uma única etapa, denominada
Colar as etapas.
É possível salvar um conjunto de etapas do histórico como um comando com nome, que se
tornará disponível no menu Comandos.
Nota: O comando é salvo como um arquivo JavaScript (ou, às vezes, como um arquivo
HTML) na pasta Dreamweaver/Configuration/Commands.
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 151 de 160
Gravaçã o de comandos
O Dreamweaver permite gravar um comando temporário a ser utilizado por um curto período de
tempo. São estas as principais diferenças entre essa abordagem e a reexecução das etapas do
painel Histórico (veja Repetição de etapas ):
O Dreamweaver mantém apenas um comando gravado por vez; assim que for iniciada a
grava ção de um novo comando, o antigo se perderá. Para salvar um novo comando sem perder
um comando já gravado, salvar o comando no painel Histórico; veja Cria ção de novos
comandos a partir de etapas do histórico.
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 152 de 160
1. Escolha Comandos > Executar o comando gravado para executar o comando novamente.
Referência
Esta seção fornece informações sobre as caixas de diálogo apresentadas neste capítulo.
É possível definir o tipo de documento que o Dreamweaver configura como o documento padrão
de um site. Por exemplo: se a maioria das páginas de um site são de um determinado tipo de
arquivo (como documentos ColdFusion, HTML ou ASP), é possível definir as preferências de
documento que automaticamente criam novos documentos desse tipo de arquivo específico.
Para exibir ou definir as preferências do novo documento, escolher Editar > Preferências e,
depois, clique na categoria Novo documento.
Codificação padrão especifica a codificação a ser utilizada quando for criada uma
nova página e quando for aberto um documento que não especifique qualquer
codificação. A codificação padrão é armazenada com o documento em uma tag meta
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 153 de 160
Se for especificado Ocidental (Latin1), a seguinte tag meta será inserida: <meta
http-equiv="Content-Type" content="text/html; charset=iso-8859-1">. O
Dreamweaver exibirá o documento utilizando as fontes especificadas em
Preferências de fontes para a codificação Ocidental (Latin1); um navegador exibirá
o documento utilizando as fontes especificadas pelo usuário para a codificação
Ocidental (Latin1).
Se for especificado japonês (Shift JIS), a seguinte tag meta será inserida: <meta
http-equiv="Content-Type" content="text/html; charset=Shift_JIS">. O
Dreamweaver exibirá o documento utilizando as fontes especificadas para as
codificações japonesas; um navegador exibirá o documento utilizando as fontes
especificadas pelo usuário para as codificações japonesas.
Tópicos relacionados:
Para limpar o HTML ou XHTML que não foi gerado pelo Microsoft Word, veja Limpeza do código.
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 154 de 160
¡ Escolha Arquivo > Importar > Importar o HTML do Word e selecionar um arquivo a
ser aberto.
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 155 de 160
Utilize a caixa de diálogo Propriedades da página para especificar uma variedade de opções
relativas à página.
Para abrir a caixa de diálogo Propriedades da página, escolher Modificar > Propriedades da
página.
A opção Título especifica o título da página que é exibido na barra de título da janela do
documento e na maioria das janelas dos navegadores. Veja Alteração do título do documento.
As opções Imagem de fundo e Fundo especificam uma imagem de fundo e a cor de fundo da
página. Veja Definição de uma imagem de fundo ou de uma cor de fundo para a página.
A opção Texto e links define as cores padrão do texto, dos links, dos links visitados e dos links
ativos. Veja Como trabalhar com as cores. Também é possível controlar essas cores utilizando
as folhas de estilos CSS; veja Aplicação de um estilo (classe) CSS personalizado.
Para alterar as fontes que o Dreamweaver utiliza para exibir cada codifica ção, escolher Editar >
Preferências e selecionar Novo documento. Observar que as fontes selecionadas nas
preferências de Novo documento não afetam a maneira como os visitantes verão as páginas;
eles especificam as suas pr óprias fontes (para uma determinada codificação) nos navegadores
da Web que utilizam. Para obter mais informações, veja Definição das preferências de fontes.
A opção Imagem de rastreamento especifica uma imagem a ser utilizada como guia para a
cópia de um projeto. Veja Utilização de uma imagem de rastreamento. Esta imagem serve
apenas como referência e não aparece quando o documento é exibido em um navegador.
A opção Pasta do documento exibe a pasta na qual o documento atual foi salvo, se tiver sido
salvo.
A opção Pasta do site exibe o caminho da pasta raiz local do site na qual foi salvo o
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 156 de 160
documento atual, se tiver sido salvo. Veja Como configurar um site do Dreamweaver.
Estes são os elementos invisíveis cujos marcadores podem ser mostrados ou ocultados:
O elemento Âncoras com nome exibe um ícone que marca a localização de cada âncora com
nome (a name ="") no documento.
O elemento Scripts exibe um ícone que marca a localização do c ódigo JavaScript ou VBScript
no corpo do documento. Selecione o ícone para editar o script no inspetor de propriedades ou
para vincular a um arquivo de script externo.
O elemento Comentários exibe um ícone que marca a localização dos comentários de HTML.
Selecione o ícone para ver o comentário no inspetor de propriedades.
O elemento Quebras de linha exibe um ícone que marca a localização de cada quebra de linha
(BR). Por padrão, esta opção fica desmarcada.
O elemento Mapas de imagens do cliente exibe um ícone que marca a localização de cada
mapa de imagens do cliente no documento.
O elemento Estilos incorporados exibe um ícone que mostra a localização dos estilos CSS
incorporados no corpo do documento. Se os estilos CSS estiverem posicionados na seção head
de um documento, eles não serão exibidos na janela do documento.
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 157 de 160
Uma tag meta é um elemento do head que registra informações sobre a página atual, como a
codificação de caracteres, autor, direitos autorais ou palavras-chave. Estas tags tamb ém podem
ser utilizadas para informar o servidor sobre a data de vencimento, o intervalo de atualização e
a taxa PICS da página. A PICS (Plataforma para a sele ção de conteúdo da Internet, Platform for
Internet Content Selection), proporciona um método de atribui ção de classificação (como nos
filmes para cinema) às páginas da Web.
O elemento Atributo especifica se a tag meta contém informações descritivas sobre a p ágina
(name) ou informações do cabeçalho HTTP ( http-equiv).
O elemento Valor especifica o tipo de informação oferecida nesta tag. Alguns valores, como a
descrição, palavras-chave e o intervalo de atualização, já estão bem definidos (e
contam com os seus respectivos inspetores de propriedades no Dreamweaver), mas pode-se
especificar praticamente qualquer valor (por exemplo: creationdate , documentID ou level).
Existe apenas uma propriedade do título: o título da página. O título é exibido na barra de título
da janela do documento no Dreamweaver e na barra de título do navegador quando a página é
exibida na maioria dos navegadores. O título também é exibido na barra de ferramentas. Digite
o título da p ágina na caixa de texto Título.
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 158 de 160
Utilize o elemento Atualizar para especificar que o navegador deve atualizar automaticamente a
página – recarregando a página atual ou indo para outra página – após um certo período de
tempo. Esse elemento é utilizado com freqüência para redirecionar os usuários de uma URL
para outra, normalmente após exibir uma mensagem de texto informando que a URL mudou.
O elemento Atraso é o tempo, em segundos, até que seja efetuada a atualização da página
pelo navegador. Para fazer com que o navegador atualize a página imediatamente após a
carga, digite 0 nessa caixa de texto.
O elemento Açã o especifica se o navegador deve ir para uma URL diferente ou atualizar a
página atual depois do atraso especificado. Para abrir outra URL (em vez de atualizar a página
atual), clique no botão Procurar e, em seguida, selecione a página a ser carregada.
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 159 de 160
Utilize o elemento Base para definir a URL básica à qual estão relacionados todos os caminhos
associados a documentos presentes na página.
O elemento Href é a URL básica. Clique no botão Procurar para procurar e selecionar um
arquivo ou digitar um caminho na caixa de texto.
l _blank carrega o documento vinculado em uma janela nova e sem nome do navegador.
l _parent carrega o documento vinculado no conjunto-pai de molduras ou na janela da
moldura que contém o link. Se a moldura onde está o link não estiver aninhada, o
documento vinculado será carregado na janela inteira do navegador (isto equivale a
_top).
l _self carrega o documento vinculado na mesma moldura ou janela que o link. Esse
destino é o padrão, portanto geralmente não é necessário especificá-lo.
l _top carrega o documento vinculado na janela inteira do navegador, removendo, por
conseguinte, todas as molduras.
Utilize o elemento Link para definir uma relação entre o documento atual e um outro arquivo.
Observar que o elemento Link na se ção head não é a mesma coisa que um link HTML entre
documentos na seção body.
O elemento Href é a URL do arquivo para o qual está se definindo a rela ção. Clique no botão
Procurar para procurar e selecionar um arquivo ou digitar um caminho na caixa de texto.
Observar que este atributo não indica um arquivo que está sendo vinculado da maneira usual
em termos de HTML; as relações especificadas em um elemento Link são mais complexas.
O elemento Título descreve a relação. Este atributo tem especial relevância para as folhas de
estilos vinculadas. Para obter mais informações, ver a seção Folhas de estilos externas da
especificação HTML 4.0, no site do World Wide Web Consortium .
O elemento Rel especifica a relação entre o documento atual e o documento na caixa de texto
Href. Os valores possíveis incluem Alternate, Stylesheet, Start, Next, Prev, Contents,
Index, Glossary, Copyright, Chapter, Section, Subsection, Appendix, Help e Bookmark.
Para especificar mais de uma relação, separar os valores por um espaço.
O elemento Rev especifica uma relação inversa (o oposto de Rel) entre o documento atual e o
documento na caixa de texto Href. Os valores possíveis são os mesmos que os de Rel.
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002
Princípios básicos do Dreamweaver Página 160 de 160
file://C:\Documents%20and%20Settings\Luis%20Carlos%20Quinhone\Configurações... 11/10/2002