Versões de 2015 do Dreamweaver CC
Resumo dos novos recursos

As versões 2015.1, 2015.2 e 2015.3 do Dreamweaver CC oferecem a você uma experiência inovadora no design e na criação de sites no Dreamweaver. As Bibliotecas da Creative Cloud e o Adobe Stock agora podem ser acessados dentro do Dreamweaver para integrar elementos e estilos de design em aplicativos para desktop e dispositivos móveis da Adobe, além de imagens e vídeos de alta qualidade. Os recursos de colaboração na Creative Cloud fornecem fluxos de trabalho suaves do designer ao desenvolvedor.

Essa versão também inclui várias melhorias no painel DOM, no Web design responsivo, no Extract, na edição na Visualização dinâmica e outras solicitações de melhoria feitas por usuários como você. Este artigo apresenta esses novos recursos e aprimoramentos, além de fornecer links de recursos para obter mais ajuda e aprendizado.

Adobe Dreamweaver CC 2015.3

Esta versão do Dreamweaver fornece uma correção para o problema em computadores Windows no qual o computador não pode entrar no modo de suspensão se estiver executando o Dreamweaver (problema do temporizador de despertar). 

Para obter mais informações, consulte O computador não entra no modo de suspensão se o Dreamweaver estiver em execução | Windows.

Adobe Dreamweaver CC 2015.2 (versão de março de 2016)

Aprimoramentos do painel DOM

Com suporte para várias seleções, edição de tags, classes e IDs e inserção de novos elementos, agora você pode esquematizar e projetar a maior parte de sua página da Web usando apenas o painel DOM.

Leia para saber mais sobre esses aprimoramentos no painel DOM:

Suporte para seleção de vários elementos do DOM 

Agora, você pode selecionar várias tags no painel DOM de um documento para editar ou executar outras operações simultaneamente em várias tags.

  • Para uma seleção adjacente, mantenha pressionada a tecla Shift e clique nas tags no painel DOM.
  • Para uma seleção não adjacente, mantenha pressionada a tecla Ctrl e clique nas tags no painel DOM.
Seleção adjacente no painel DOM
Seleção adjacente no painel DOM

Seleção não adjacente no painel DOM
Seleção não adjacente no painel DOM


Quando você seleciona vários elementos no painel DOM:

  • O Inspetor de propriedades e o CSS Designer são desativados.
  • A hierarquia de tags mostrada na parte inferior da página é esvaziada.
  • O ponto de inserção na Visualização de código torna-se inativo.

Editar tags, classes e IDs no painel DOM

Agora você pode editar tags, classes e IDs clicando nelas duas vezes no painel DOM. Você também pode adicionar classes ou IDs adicionais separando-as com um espaço. Para tags que não estão associadas a uma classe ou ID, você pode digitar o nome da classe ou da ID após clicar duas vezes na tag.

As dicas de código aparecem quando você começa a digitar um nome de tag, classe ou ID. Para limitar as dicas às classes, comece a digitar com um ponto. Para exibir apenas as IDs nas dicas, comece a digitar com uma cerquilha (#).

Editar tags no painel DOM
Editar tags no painel DOM

Editar ou adicionar classes no painel DOM
Editar ou adicionar classes no painel DOM

Editar e adicionar IDs no painel DOM
Editar e adicionar IDs no painel DOM

Para remover uma tag, clique com o botão direito na tag no painel DOM e clique em Remover tag.

Inserir elementos no painel DOM

Agora você pode inserir novos elementos na sua página da Web usando o painel DOM de uma das seguintes maneiras:

  • Pressione a barra de espaço ou clique no ícone de inserção adjacente ao elemento necessário no painel DOM. Na janela pop-up exibida, clique em uma das opções. Para delimitar vários elementos com uma tag, selecione os elementos necessários e escolha Colocar tag ao redor nas opções de inserção.
Uma tag div do alocador de espaço é inserida e exibida no modo de edição. Você pode digitar o nome da tag requerido no lugar da tag div.
Opções de inserção no painel DOM
Opções de inserção no painel DOM

  • No painel Inserir, clique no elemento necessário e arraste-o para o painel DOM. Os guias dinâmicos aparecem para indicar onde o elemento será inserido. Solte o elemento no local requerido.

Quando você insere tags usando o painel DOM, o texto padrão (alocador de espaço) e os atributos obrigatórios das tags também são inseridos:

  • Quando você insere qualquer uma das tags abaixo e confirma as alterações, o texto padrão é inserido nas Visualizações dinâmica, de código e de design:
    div, header, nav, aside, article, section, footer, h1-h6 e hgroup
  • Quando você insere uma tag table e confirma as alterações, uma tabela 3x3 é inserida.
  • Quando você insere uma tag embed ou img e confirma as alterações, a caixa de diálogo Selecionar arquivo é exibida e solicita que você selecione um arquivo apropriado.
  • Quando você insere uma meta tag e confirma as alterações, o seguinte código é adicionado à Visualização de código: <meta name="" content="">
  • Quando você insere uma tag figure e confirma as alterações, uma tag figure com figcaption aninhado é inserida.
  • Quando você insere uma tag ul ou uma tag ol e confirma as alterações, uma tag ol/ul com uma tag li aninhada é inserida.

Feedback visual para nós filho

Quando um nó é selecionado no painel DOM, os nós filho são exibidos em azul claro.

Se nós filho são explicitamente selecionados, o realce azul claro não é exibido.

Nós filho realçados quando o nó pai é selecionado
Nós filho realçados quando o nó pai é selecionado

Nó filho realçado semelhante ao nó pai
Nó filho realçado semelhante ao nó pai


Aprimoramentos de segurança para impedir ataques ao Gatekeeper

O Gatekeeper é um recurso incorporado de detecção de malware no Mac OS X 10.7 e superior. Esse recurso verifica assinaturas válidas de Developer IDs em aplicativos antes de serem instalados no Mac. Mas o Gatekeeper não detecta ou bloqueia aplicativos que são carregados dinamicamente dentro de aplicativos que têm assinaturas válidas. Se você comprar o Dreamweaver de fontes não autorizadas, esse problema no Gatekeeper pode ser explorado para introduzir plug-ins maliciosos no pacote de instalação do Dreamweaver. 

Para impedir qualquer possível ataque, agora o Dreamweaver solicita que você confirme se deseja carregar plug-ins de terceiros caso seja instalado em um local diferente de /Applications.

Prompt de confirmação para carregar bibliotecas de terceiros
Prompt de confirmação para carregar bibliotecas de terceiros

Para obter informações detalhadas, consulte Impedir possível ataque ao Gatekeeper.

Integração do CEF

O Dreamweaver agora é integrado à CEF3 2357. Agora a Visualização dinâmica pode
renderizar transições, animações e transformações CSS3 3D.

Para obter mais informações, consulte Integração do CEF.

Aprimoramentos na consulta de mídia visual

Agora você será capaz de selecionar uma unidade (px, em ou rem) ao adicionar consultas de mídia usando a barra de consulta de mídia visual. Quando você especifica um valor em uma unidade e altera a unidade, o valor é automaticamente convertido para a unidade recém-selecionada.

Especificar unidades ao adicionar uma consulta de mídia
Especificar unidades ao adicionar uma consulta de mídia

Para obter mais informações, consulte Criar e usar consultas de mídia no Dreamweaver.

Aprimoramentos das Bibliotecas da CC

Alterações na caixa de diálogo de nova amostragem

O rótulo de interface do usuário “Redimensionar para” na caixa de diálogo Otimização de imagem foi alterado para “Nova amostra”.

Além disso, quando você está fazendo amostras de uma imagem do painel Bibliotecas da CC, um ícone giratório aparece na imagem até que ela esteja completamente amostrada.

Caixa de diálogo de nova amostragem no Dreamweaver CC 2015.2
Caixa de diálogo de nova amostragem no Dreamweaver CC 2015.2

Para obter mais informações, consulte Bibliotecas da Creative Cloud no Dreamweaver.

Extrair das Bibliotecas da CC arquivos SVG otimizados para a Web

Se você salvou imagens licenciadas do Adobe Stock nas Bibliotecas da Creative Cloud, pode extrai-las como arquivos SVG otimizados para a Web nas páginas online do Dreamweaver. Quando você arrasta as imagens do painel Bibliotecas da CC para suas páginas da Web, elas são inseridas como arquivos SVG, por padrão.

Se desejar personalizar as propriedades dos arquivos SVG, você pode editar as preferências no arquivo options.json.

Para obter mais informações, consulte Extrair das Bibliotecas da CC arquivos SVG otimizados para a Web.

Novos modelos iniciais

Foram adicionados três novos modelos de email nesta compilação: Email - Fluido, Email - Híbrido, Email - Responsivo.

Para acessar os modelos, vá até Arquivo > Novo > Modelos iniciais > Modelos de email.

Novos modelos iniciais de email no Dreamweaver CC 2015.2
Novos modelos iniciais de email no Dreamweaver CC 2015.2

Aprimoramentos na edição de tabelas da Visualização dinâmica

Novas opções de edição para linhas e colunas

As seguintes opções de edição estão agora disponíveis para tabelas na Visualização dinâmica:

  • Excluir usando as teclas Delete/Backspace.
  • Cortar usando o menu de contexto, o menu Editar ou o atalho do teclado.
  • Copiar usando o menu de contexto, o menu Editar ou o atalho do teclado.
  • Colar usando o menu de contexto, o menu Editar ou o atalho do teclado.
  • Copiar e substituir outras linhas ou colunas usando a opção Substituir células selecionadas no menu de contexto.

Para ver essas opções, entre no modo de formatação de tabela selecionando a tabela e clicando no ícone de encaixado em Exibição do elemento. Selecione a(s) célula(s) necessária(s) e clique com o botão direito.

Opções de edição de células de tabela em Visualização dinâmica
Opções de edição de células de tabela em Visualização dinâmica

Agora, você pode navegar entre as células de uma tabela em Visualização dinâmica usando as setas esquerda e direita. Clique em uma célula na tabela e pressione a tecla de seta para a esquerda para ir para a célula anterior e a tecla de seta para a direita para ir para a próxima célula da tabela.

Alterações na tela de boas-vindas

A tela de boas-vindas foi alterada nesta versão do Dreamweaver:

Tela de boas-vindas no Dreamweaver CC 2015.2
Tela de boas-vindas no Dreamweaver CC 2015.2

Adobe Dreamweaver CC 2015.1 (versão de novembro de 2015)

Integração às Bibliotecas da Creative Cloud

Com o novo suporte para Bibliotecas da Creative Cloud, é possível compartilhar e colaborar com gráficos e temas de cores criados em outras ferramentas de design, como o Photoshop, o Illustrator ou aplicativos para dispositivos móveis. Você pode procurar, gerenciar e acessar ativos de criação a qualquer hora e em qualquer lugar, em projetos do Dreamweaver. 

Painel Bibliotecas da CC no Dreamweaver
Painel Bibliotecas da CC no Dreamweaver

Ao inserir ativos das Bibliotecas da Creative Cloud, é possível optar por manter o vínculo entre o ativo e a origem para que os ativos permaneçam sempre atualizados.

O novo painel Bibliotecas da CC no Dreamweaver ajuda a exibir os ativos nas bibliotecas da Creative Cloud e a inseri-los em suas páginas da Web. Você pode inserir os ativos na Visualização dinâmica ou Visualização de código usando dicas de código.

Para obter informações detalhadas, consulte Bibliotecas da Creative Cloud no Dreamweaver.

Integração ao Adobe Stock

A integração ao Adobe Stock permite baixar imagens, gráficos vetoriais e vídeos isentos de royalties diretamente nas Bibliotecas da Creative Cloud, bem como gerenciar e reutilizar com facilidade conteúdo do Adobe Stock diretamente no Dreamweaver.

Encontre as imagens, os gráficos e os vídeos perfeitos no Adobe Stock e deixe seu site com um visual atraente para o público-alvo enquanto estiver trabalhando no Dreamweaver.

Pesquisar e comprar imagens do Adobe Stock
Pesquisar e comprar imagens do Adobe Stock

Aprimoramentos no design responsivo

Aprimoramentos no Bootstrap

Suporte ao Bootstrap v3.3.5

A versão do Bootstrap usada no Dreamweaver foi atualizada para a versão 3.3.5. Como resultado, os componentes, snippets e modelos iniciais do Bootstrap agora estão na versão 3.3.5. 

O jQuery também foi atualizado para a versão 1.11.3.

Duplicar linhas e colunas

Além de ter os recursos Adicionar coluna/Adicionar linha para os documentos do Bootstrap em Visualização dinâmica, o Dreamweaver agora também permite duplicar linhas e colunas.

Você pode duplicar uma linha ou coluna selecionada clicando no ícone duplicado () que aparece no canto inferior direito. A linha ou a coluna inteira são duplicadas juntamente com seu conteúdo.

Observação:

a opção Adicionar linha ou Adicionar coluna duplica a linha ou a coluna com classes, mas sem o conteúdo.

Opção de duplicar linha e coluna nos documentos do Bootstrap
Opção de duplicar linha e coluna nos documentos do Bootstrap

Aprimoramentos no fluxo de trabalho de criação de documentos do Bootstrap

Se você cria um documento do Bootstrap na caixa de diálogo Novo documento ou em modelos iniciais, o fluxo de trabalho agora é contínuo. Nenhuma caixa de diálogo (Copiar arquivos dependentes e Substituir arquivos existentes) é exibida como nas versões anteriores do Dreamweaver.

Quando você cria e salva um documento do Bootstrap em um local específico, os arquivos dependentes também são salvos automaticamente no mesmo local.

Aprimoramentos na consulta de mídia visual

Realce dos valores atuais de pontos de interrupção

O Dreamweaver agora realça as consultas de mídia associadas ao tamanho atual do visor para que você possa rapidamente identificá-las. O realce aparece na forma de setas mais escuras e um fundo escuro dos valores de pontos de interrupção das consultas de mídia.

Consultas de mídia ativas e inativas (destacadas acima)
Consultas de mídia ativas e inativas (destacadas acima)

Aprimoramentos no fluxo de trabalho de adição de consulta de mídia

Agora, quando você clica no sinal + na barra de consulta de mídia visual, o Dreamweaver não solicita que você clique nas opções max-width or min-width. Em vez disso, o pop-up para adicionar a consulta de mídia é exibido imediatamente. 

Além disso, no pop-up, a opção max-width está selecionada por padrão. Uma lista suspensa é inserida para que você possa alterar a opção para min-width ou min-max. 

Alterações à adição de consultas de mídia
Alterações à adição de consultas de mídia

Aprimoramentos na edição de pontos de interrupção

Agora você pode editar os valores da consulta de mídia clicando duas vezes nos valores de pontos de interrupção na barra de consulta de mídia visual. Quando você clica duas vezes no valor de ponto de interrupção, uma borda laranja é exibida e o ponto de inserção aparece dentro da borda.

Após digitar os novos valores (em pixels), pressione Enter/Return para confirmar as alterações, ou pressione Escape para descartá-las.

Valor de ponto de interrupção 768 px no modo de edição com uma borda laranja
Valor de ponto de interrupção 768 px no modo de edição com uma borda laranja

Exibição do número de linha na opção Ir para código

A opção Ir para código no menu de contexto do botão direito do mouse na Consulta de mídia visual agora exibe o número da linha do código, facilitando a associação ao código correspondente.

Números de linha para o código correspondente às Consultas de mídia visual
Números de linha para o código correspondente às Consultas de mídia visual

Aprimoramentos no Extract

Suporte a várias pranchetas

Agora você pode abrir PSDs com várias pranchetas no painel Extract do Dreamweaver para extrair ativos. Cada prancheta é exibida como uma pasta no painel de camadas. Você pode expandir ou recolher a pasta para exibir ou ocultar seu conteúdo.

Para ampliar uma prancheta específica, basta clicar no nome da prancheta.

Clique duas vezes em “FIT” no cabeçalho do painel para aplicar menos zoom na prancheta e ajustar o PSD à exibição atual.

Suporte à extração de Sombra

Quando você extrai CSS de um arquivo PSD que tem a propriedade Sombra, agora, a propriedade é extraída como a sombra da caixa em CSS.

Dicas para lidar com estilos de camadas sem suporte

Em muitos casos, você cria vários estilos de camada em um arquivo PSD que funcionam individualmente, mas não podem trabalhar juntos. O Extract verifica esses casos e fornece sugestões sobre como lidar com esses estilos de camada.

O Extract detecta os seguintes casos:

  • Cenário 1: várias ocorrências de propriedades que se traduzem em cores de fundo. Por exemplo, duas sobreposições de cor ou duas sobreposições de degradê definidas no arquivo PSD.
  • Cenário 2: uma sobreposição de cor com uma opacidade inferior a 100% é colocada em cima de uma sobreposição de degradê, ou uma cor de fundo foi atribuída à camada. Nesse caso, é difícil determinar a cor da mistura resultante.
  • Cenário 3: uma sobreposição de degradê possui uma opacidade menor que 100% e uma cor de fundo foi atribuída à camada. Nesse caso, também é difícil determinar a cor da mistura resultante.

Quando esses casos são encontrados, o Extract exibe um ícone de aviso na miniatura da camada do painel Extract. A seguinte mensagem de aviso é exibida no pop-up da miniatura da camada e no CSS dessa camada:

“A camada contém vários estilos de camada que não podem ser representados no CSS. Use o seletor de cores ou extraia a camada como uma imagem.”

Além disso, nos casos em que uma cor de fundo semitransparente sobrepõe outra cor de fundo (cenários 2 e 3 acima), os valores para todas as cores de fundo são exibidos no CSS. Você então pode extrair o valor necessário.

Aprimoramentos na edição na Visualização dinâmica

Aprimoramentos na edição da tabela

Selecionar linhas ou colunas com um único clique

Agora, você pode selecionar linhas e colunas em uma tabela na Exibição dinâmica com um único clique. Um novo ícone de seta foi incluído (semelhante àquele na Visualização de design), no qual você pode clicar para selecionar uma linha ou coluna.

  1. Selecione a tabela para ver a Exibição de elementos com o ícone de encaixado.

  2. Clique no ícone de encaixado para entrar no modo de formatação da tabela.

  3. Passe o mouse sobre a linha ou coluna que deseja selecionar. Aponte o mouse para a borda externa da linha ou coluna para ver uma seta que indica que agora você pode clicar para selecionar.

  4. Clique para selecionar a linha ou coluna.

    Selecionar uma linha de tabela na Visualização dinâmica
    Selecionar uma linha de tabela na Visualização dinâmica

    Seleção de uma coluna de tabela
    Selecionar uma coluna de tabela na Visualização dinâmica

  5. Prossiga com a edição da linha ou coluna, conforme necessário, clicando com o botão direito do mouse para usar o menu de contexto.

Arrastar e selecionar várias células

Agora é possível selecionar várias células/linhas/colunas usando a função de arrastar. Clique em uma célula e arraste por várias células/linhas/colunas para selecioná-las.

  1. Selecione a tabela para ver a Exibição de elementos com o ícone de encaixado.

  2. Clique no ícone de encaixado para entrar no modo de formatação da tabela.

  3. Arraste e selecione as linhas e colunas necessárias.

    Arrastar para selecionar várias células
    Arrastar para selecionar várias células

  4. Prossiga com a edição da linha ou coluna, conforme necessário, clicando com o botão direito do mouse para usar o menu de contexto.

Excluir linhas ou colunas usando a tecla Delete

Agora é possível excluir linhas ou colunas selecionando-as e pressionando a tecla Delete/Backspace.

Inspetor de propriedades rápido de texto

Agora você pode usar o Inspetor de propriedades rápido para texto na Visualização dinâmica para formatar, recuar e criar hiperlinks de texto rapidamente. O Inspetor de propriedades rápido para texto é exibido quando você clica no ícone de Encaixado para os elementos de texto h1-h6, pre e p.

Inspetor de propriedades rápido de texto
Inspetor de propriedades rápido de texto

  • A opção de formato permite alterar rapidamente a tag do elemento para uma das seguintes tags: h1-h6, p e pre. 
  • A opção de link ajuda a criar hiperlink para o elemento de texto. 
  • Os ícones de Negrito e Itálico ajudam a adicionar as tags <strong> e <em> ao elemento de texto.
  • Os ícones de blockquote ajudam a adicionar ou remover o recuo do texto. A tag é adicionada ou removida do código conforme necessário.

Em documentos do Bootstrap, o Inspetor de propriedades rápido de texto também permite alinhar e transformar os elementos de texto.

Inspetor de propriedades rápido de texto em documentos do Bootstrap
Inspetor de propriedades rápido de texto em documentos do Bootstrap

  • Alinhar: alinha os elementos de texto do Bootstrap para a esquerda, no centro, para a direita ou justifica aplicando as classes correspondentes.
  • Transformar: altera a caixa do texto de um elemento aplicando classes para letras minúsculas, letras maiúsculas ou apenas a primeira letra da frase em maiúscula.

Alterações no Inspetor de propriedades rápido de imagens

O Inspetor de propriedades rápido de imagens agora inclui opções para personalizar imagens em documentos do Bootstrap.

Inspetor de propriedades rápido de texto em documentos do Bootstrap
Inspetor de propriedades rápido de texto em documentos do Bootstrap

  • Cortar para ajustar: clique para tornar os cantos de imagens circulares ou arredondados, ou para transformá-los em miniaturas.
  • Tornar a imagem responsiva: clique para tornar imagens responsivas e adaptá-las a vários tamanhos de tela.

Atualizações no aplicativo

A Adobe fornece atualizações constantes para manter o Dreamweaver atualizado com a evolução da tecnologia. Por exemplo, atualizações às bibliotecas do Bootstrap ou modelos para iniciantes.

É possível baixar e instalar atualizações no aplicativo de forma automática ou manual. Também é possível desativar atualizações no aplicativo ou desinstalá-las e reverter o Dreamweaver ao estado no qual ele foi instalado ou atualizado anteriormente usando o aplicativo de desktop da Adobe Creative Cloud. A caixa de diálogo de preferências do Dreamweaver permite que você especifique o modo como atualizar, desativar ou reverter atualizações no aplicativo.

Para obter mais informações sobre atualizações no aplicativo, consulte Atualizações no aplicativo.

Preferências de atualizações no aplicativo
Preferências de atualizações no aplicativo

Servidor de teste — aprimoramentos no fluxo de trabalho

Na versão anterior (Dreamweaver CC 2015), foi introduzido o envio automático de arquivos para servidores de teste para aperfeiçoar a experiência de edição de documentos dinâmicos na Visualização dinâmica. Como os usuários solicitaram a capacidade de desativar esse recurso, uma nova preferência foi introduzida na caixa de diálogo Configuração de site.

Para obter informações detalhadas, consulte Desativar envio automático de arquivos dinâmicos.

Opção para desativar envio automático de arquivos dinâmicos
Opção para desativar envio automático de arquivos dinâmicos

Recolhimento de código baseado em seleção

O recolhimento de código para um bloco de código selecionado está de volta. Agora você pode:

  • Recolher código no nível de tag como na versão anterior do Dreamweaver e/ou;
  • Recolher uma parte do código selecionando-o.
Quando você seleciona um bloco de código, a opção para recolher o código aparece como mostrado abaixo:
Recolhimento de código baseado em seleção
Clique em “-” para recolher o código

Recolhimento de código baseado em seleção
Clique em “+” para expandir o código


Clique em “-” para recolher o código. Para expandir uma seção do código recolhido, clique em “+”.

Clique em “-” para recolher o código. Para expandir uma seção do código recolhido, clique em “+”. 
Clique em “-” para recolher o código. Para expandir uma seção do código recolhido, clique em “+”. 
Clique em “-” para recolher o código. Para expandir uma seção do código recolhido, clique em “+”. 

Para obter mais informações sobre o recolhimento de código, consulte Recolhimento de código.

Aprimoramentos no CSS Designer

Reorganizar seletores

Agora você pode reorganizar os seletores no painel Seletores arrastando-os para o local desejado no painel.

Reorganizar seletores no CSS Designer
Reorganizar seletores no CSS Designer

Painéis no CSS Designer mantêm tamanhos personalizados

Se você recolhe ou expande os painéis no CSS Designer, os tamanhos dos painéis são lembrados em uma sessão. Os painéis Origem e Mídia continuam com os tamanhos personalizados até que você os altere novamente.

Painel Propriedades desativado para arquivos do Bootstrap

Em arquivos do Bootstrap, onde os estilos são definidos em arquivos CSS do Bootstrap e são somente leitura, o painel Propriedades no CSS Designer está desativado.

Observação:

se quiser modificar o estilo do documento do Bootstrap, crie outro arquivo CSS para substituir os estilos existentes e anexe-o ao documento.

Desfazer/refazer específico para documentos ativos

As ações desfazer e refazer agora podem ser limitadas apenas a documentos ativos.

Por padrão, as ações desfazer e refazer afetam o documento atualmente ativo e todos os arquivos relacionados, como os arquivos CSS associados. Quando você limita as ações desfazer ao documento ativo, desfazer/refazer serão aplicadas somente às alterações feitas no arquivo que está em foco no momento. Por exemplo, se você estiver em um arquivo HTML, as ações desfazer/refazer afetarão somente as alterações feitas no arquivo HTML e não no arquivo CSS relacionado. Para desfazer/refazer as alterações feitas em um arquivo CSS relacionado, você precisará alternar para o arquivo CSS antes de executar desfazer/refazer.

Se o foco estiver na Visualização dinâmica ou de design, as ações desfazer/refazer serão aplicadas somente às alterações que afetaram o código HTML. Por exemplo, considere que você está editando uma página do Bootstrap na Visualização dinâmica. Você edita um texto e redimensiona uma consulta de mídia na barra Consulta de mídia visual. É possível desfazer apenas a edição do texto e não as alterações da consulta de mídia, pois essas alterações estão em um arquivo relacionado, e não no arquivo HTML. Você pode alternar para o arquivo CSS relacionado e desfazer as alterações.

Para limitar as ações desfazer e refazer ao documento atual, execute as seguintes etapas:

  1. Clique em Editar > Preferências (Windows) ou Dreamweaver > Preferências (Mac).

  2. Na categoria Geral, selecione Limitar ações desfazer ao documento atual na seção Opções de edição.

    Limitando as ações desfazer e refazer ao documento ativo
    Limitar as ações desfazer e refazer ao documento ativo

  3. Clique em Aplicar e em Fechar para fechar a caixa de diálogo Preferências.

  4. Reinicie o Dreamweaver para que as alterações entrem em vigor.

Aprimoramentos no painel DOM

Agora você pode copiar uma tag no painel DOM de um documento e colá-la no painel DOM de outro documento usando o menu de contexto do botão direito do mouse.

Observação:

somente as tags copiadas do painel DOM podem ser coladas em outro painel DOM. Se você estiver copiando uma tag de Visualização dinâmica, ela poderá ser colada somente na Visualização dinâmica e não no painel DOM.

Opção Redefinir para guias de novos recursos

Os guias de novos recursos – Flutuadores de recursos e Dicas de recursos contextuais – aparecem automaticamente durante a primeira inicialização após a atualização do Dreamweaver. O Flutuador de recursos ajuda a explorar os novos recursos da nova atualização e as Dicas de recurso contextual ajudam a descobrir novos fluxos de trabalho e aprimoramentos nos recursos.

Durante as inicializações subsequentes do Dreamweaver, esses guias de novos recursos são suprimidos e não aparecem por padrão. Caso deseje exibi-los novamente, use a opção Redefinir nas preferências do Dreamweaver.

 

  1. Vá para Ajuda > Redefinir guias de novos recursos. A caixa de diálogo Preferências é exibida.

  2. Redefina Flutuadores de recursos ou Dicas de recursos contextuais, ou ambos, conforme sua necessidade.

  3. Feche as Preferências e saia do Dreamweaver.

  4. Reinicie o Dreamweaver. Agora é possível exibir as guias de novos recursos outra vez.

Atualização no Validador de W3C

Agora o Dreamweaver foi atualizado para usar o novo serviço de validação para HTML5 de W3C: https://validator.w3.org/nu/. O serviço de validação mais antigo, validator.w3.org, agora é obsoleto.

O novo serviço de validação é compatível somente com os seguintes analisadores:

Valor Descrição
none A escolha do analisador HTML ou XML é baseada em Content-Type.
xml Analisador XML, não carregará entidades externas.
xmldtd Analisador XML, carregará entidades externas.
html Analisador HTML, configuração baseada em doctype.
html5 Analisador HTML no modo HTML5.
html4 Analisador HTML no modo estrito HTML4.
html4tr Analisador HTML no modo transitório HTML4.

Assim como nas versões anteriores do Dreamweaver, ainda é possível especificar o analisador de contingência que o Dreamweaver pode selecionar se ele não for capaz de identificar o analisador com base no tipo de conteúdo do documento ou DTD. Apenas a lista disponível de analisadores foi alterada com o novo validador.

Preferências do Validador de W3C
Preferências do validador de W3C

Para obter mais informações, consulte Validar documentos usando o validador de W3C.

Suporte para arquivos SVG no painel Ativos

O painel Ativos agora lista todos os ativos SVG no site do Dreamweaver associados ao documento ativo no momento. Como qualquer outro ativo no painel Ativos, você pode executar várias ações nos ativos SVG, como editar, atribuir URLs e reutilizar ativos em vários documentos e sites.

Ativos de SVG listados no painel Ativos
Ativos de SVG listados no painel Ativos

Modificações nas opções de zoom

A aplicação de mais ou menos zoom na Visualização dinâmica e na Visualização de design usando as seguintes ações não está mais disponível no Dreamweaver:

Windows:

  • Pressionar Ctrl e usar a roda de rolagem do mouse
  • Pressionar Ctrl e usar a rolagem no trackpad

Mac:

  • Pressionar Cmd e usar a roda de rolagem do mouse
  • Pressionar Cmd e usar a rolagem no trackpad

Não há alterações nas outras formas de aplicação de mais ou menos zoom em um documento: Cmd/Ctrl+ ou Cmd/Ctrl- e zoom no menu Exibir > Ampliação.

Modificações no menu Exibir

A opção Visualização de código e dinâmica/código e design foi renomeada no menu Exibir para “Dividida” e comporta-se da mesma forma que na barra de ferramentas Documento.

Menu Exibir antes do Dreamweaver CC 2015.1
Menu Exibir antes do Dreamweaver CC 2015.1

Menu Exibir no Dreamweaver CC 2015.1
Menu Exibir no Dreamweaver CC 2015.1


Sincronização agilizada das configurações do Dreamweaver com a Creative Cloud

Com as várias melhorias de desempenho no recurso de sincronização de configurações, agora é possível sincronizar, com rapidez inédita, configurações entre instâncias do Dreamweaver e a Creative Cloud.  

Painel Estilos CSS e APIs obsoletos

O painel Estilos CSS mais antigo foi removido do Dreamweaver e, consequentemente, as APIs associadas também foram removidas.

As seguintes APIs básicas ainda estão disponíveis:

  • dreamweaver.cssRuleTracker.newRule()
  • dreamweaver.cssStylePalette.getStyles()
  • dreamweaver.cssStylePalette.editStyleSheet()
  • dreamweaver.cssStylePalette.attachStyleSheet()
  • dreamweaver.cssStylePalette.getMediaType()
  • dreamweaver.cssStylePalette.setMediaType()
  • dreamweaver.cssStylePalette.getDisplayStyles()
  • dreamweaver.cssStylePalette.setDisplayStyles()
  • dreamweaver.cssStylePalette.newStyle()

As seguintes APIs não terão suporte no futuro:

  • dreamweaver.cssRuleTracker.editSelectedRule()
  • dreamweaver.cssRuleTracker.canEditSelectedRule()
  • dreamweaver.cssStylePalette.getSelectedStyle()
  • dreamweaver.cssStylePalette.editSelectedStyle()
  • dreamweaver.cssStylePalette.editSelectedStyleInCodeview()
  • dreamweaver.cssStylePalette.renameSelectedStyle()
  • dreamweaver.cssStylePalette.applySelectedStyle()
  • dreamweaver.cssStylePalette.duplicateSelectedStyle()
  • dreamweaver.cssStylePalette.deleteSelectedStyle()
  • dreamweaver.cssStylePalette.canEditSelectedStyle()
  • dreamweaver.cssStylePalette.canEditSelectedStyleInCodeview()
  • dreamweaver.cssStylePalette.canRenameSelectedStyle()
  • dreamweaver.cssStylePalette.canDuplicateSelectedStyle()
  • dreamweaver.cssStylePalette.canDeleteSelectedStyle()
  • dreamweaver.cssStylePalette.canApplySelectedStyle()
  • dreamweaver.canDisableSelectedStyle()
  • dreamweaver.canEnableAllDisabled()
  • dreamweaver.canDeleteAllDisabled()
  • dreamweaver.getSelectedStyleIsDisabled()
  • dreamweaver.setSelectedStyleIsDisabled()
  • dreamweaver.enableAllDisabled()
  • dreamweaver.deleteAllDisabled()

Esta obra está licenciada sob uma licença não adaptada da Creative Commons Attribution-Noncommercial-Share Alike 3.0  As publicações do Twitter™ e do Facebook não são cobertas pelos termos do Creative Commons.

Avisos legais   |   Política de privacidade online