O Adobe Dreamweaver é uma ferramenta tão poderosa para os designers da Web, porque tem muitas coisas que você pode fazer com ele. Naturalmente, todas essas coisas que você pode fazer tornam difícil aprender. Descubra algumas das muitas coisas que o Dreamweaver pode fazer, incluindo alterações na versão mais recente, CS5. E não esqueça de verificar as coisas que estão faltando no Dreamweaver CS5.
Definindo um site
- Comece um novo site
- Crie um site
- Configure apenas as partes do site que você precisa, quando precisar delas * Novo no CS5
- Configurar servidores remotos, de controle de qualidade e de testes para fluxos de trabalho mais completos * Novo no CS5
- Crie e publique novos diretórios
- Alterar o doctype
- Inclua metadados em suas páginas
Colocando seu site ao vivo
- Definir um site remoto
- Arquivos FTP para o servidor da web
- Use um sistema de controle de versão para verificar arquivos dentro e fora
- Conecte-se ao Subversion para obter um controle de versão mais avançado * Novo no CS5
- Deixe notas para seus companheiros de equipe
Criando Páginas da Web
- Escrever uma página no modo WYSIWYG
- Escreva uma página em HTML
- Crie uma nova página a partir de um modelo
- Crie uma nova página a partir do zero
- Crie um modelo
- Salvar arquivos no diretório do seu site
- Definir as propriedades da página
CSS
- Use folhas de estilo CSS
- Adicionando estilos in-line
- Crie uma folha de estilos externa
- Anexar uma folha de estilos externa
- Criar seletores de CSS de classe, ID, tag e composto
- Editar regras CSS existentes
- Crie CSS para páginas imprimíveis
- Ativar e desativar propriedades de estilo * Novo no CS5
- Inspecionar visualmente o modelo de caixa CSS * Novo no CS5
Texto
- Modifique o texto
- Use fontes diferentes
- Inserir uma quebra de linha
- Use caracteres especiais
- Incluir a data de hoje
- Escreva comentários
- Aplicar tags HTML ao texto
- Adicionar atributos HTML a tags
Links
- Vincular texto e imagens
- Confira links do site
- Alterar as cores do link padrão (link, visitado, passar o mouse, ativo)
- Crie dicas de ferramentas em links
- Criar links mailto
- Crie âncoras de páginas da web
Imagens
- Adicione gráficos a uma página
- Editar imagens
- Redimensionar imagens
- Adicionar texto alternativo às imagens
- Adicione opções adicionais de acessibilidade às imagens
- Alinhar imagens e texto
- Crie uma imagem de rolagem
- Use mapas de imagens
- Use imagens de rastreamento
- Use espaços reservados para imagens
- Inserir HTML do Fireworks
- Inserir arquivos do Photoshop
Layout
- Use os modelos gratuitos incluídos * Novos layouts iniciais CSS no CS5
- Inserir divs para layout
- Editar divs no painel de estilos CSS
- Inserir elementos absolutamente posicionados
- Formatar elementos posicionados de maneira absoluta no inspetor de propriedades
- Use réguas, grades e guias
Listas
- Adicionar listas com marcadores e numeradas
- Personalizar marcadores e números da lista
Tabelas
- Crie uma tabela
- Adicionar linhas e colunas de cabeçalho
- Use imagens transparentes para manter as células da tabela abertas
- Criar colunas de largura fixa e largura flexível
- Alterar os estilos de borda das tabelas
- Incorporar uma tabela dentro de uma tabela
- Importar dados tabulares
Formulários
- Use um formulário mailto
- Definir ações de formulário
- Adicione texto, rádio, caixa de seleção, arquivo, imagem, caixas de seleção e campos de formulário ocultos
- Torne seus formulários acessíveis com campos fieldset e label
- Crie botões de envio personalizados
- Valide formulários com JavaScript (Spry)
Bancos de Dados e Scripts PHP
- Anexe seu site a um banco de dados
- Configurar um site PHP / mySQL
- Use elementos do Spry para se conectar ao banco de dados
- Inserir objetos de dados em suas páginas
- Teste e atualize uma fonte de dados ou exibição do Spry
- Editar sites dinâmicos complexos no modo de design
- Descubra todos os arquivos dinamicamente relacionados para montar sites PHP CMS (WordPress, Joomla e Drupal) * Novo no CS5
- Sugestões de classe personalizadas para código PHP, incluindo estruturas de terceiros como o framework Zend * Novo no CS5
Quadros
- Construa um site emoldurado
- Editar conteúdo noframes
- Formate e estilize seus quadros
- Configurar alvos de link padrão entre quadros
Adicionar Interatividade
- Construa um álbum de fotos (não mais no CS5)
- Adicionar som às páginas da web
- Crie um menu suspenso
- Use os comportamentos do Dreamweaver para abrir janelas pop-up, criar menus de salto, reproduzir sons, trocar imagens e muito mais
- Adicione feeds RSS a um site
- Inserir texto em Flash como um rollover
- Inserir texto CSS como um rollover
- Inserir outros plugins
- Adicionar barra de menu do Spry, painéis com abas, acordeão, ponta de ferramenta e painel dobrável
- Use o Navegador de widgets para encontrar novos widgets para o seu site, sem precisar conhecer JavaScript
Teste suas páginas
- Teste suas páginas no Live View para ver as alterações devido ao JavaScript e à interatividade * Novo no CS5
- Valide seu HTML
- Visualize suas páginas em vários navegadores
- Use o BrowserLab para visualizar suas páginas em outros sistemas operacionais * Novo no CS5
- Use o Device Central para verificar como as páginas aparecem em dispositivos móveis
- Verifique a compatibilidade do navegador
- Altere as configurações para corresponder ao que seu site precisa para trabalhar
- Verifique os links internos do site
- Teste a acessibilidade do seu site (não mais no CS5)
- Converter um documento do Word em HTML
Personalizar o Dreamweaver
- Adicionar extensões
- Desativar extensões
- Personalize o Dreamweaver com atalhos
Aumente sua eficiência
- Use atalhos de teclado incorporados
- Use trechos de código
- Crie e use modelos
- Gere novas páginas a partir de modelos personalizados
- Atualizar modelos
- Incluir um arquivo em outro com a biblioteca do Dreamweaver
- Atualizar itens da biblioteca
- Inclua um arquivo em outro usando o SSI
- Use a pesquisa e substitua
