Dreamweaver CC 2017 (versione novembre 2016)

Dreamweaver è ora stato riprogettato per i progettisti Web che scrivono codice. Ora è più focalizzato, efficiente e veloce che mai, con un editor di codice completamente rinnovato, un'interfaccia utente più intuitiva con un tema scuro selezionabile e diverse migliorie compreso il supporto per i nuovi flussi di lavoro come i preprocessori CSS.

Continuate a leggere per una breve introduzione a queste nuove funzioni e altri miglioramenti.

Per un riepilogo delle funzioni introdotte nelle versioni precedenti di Dreamweaver CC, consultate Riepilogo delle funzioni | Dreamweaver CC 2015.


Nuovissimo editor di codice

All'editor di codice in Dreamweaver sono state apportate diverse migliorie per la produttività che consentono di concentrarsi sull'attività di codifica, con rapidità ed efficienza.

I suggerimenti sul codice consentono ai nuovi utenti di imparare a usare il linguaggio HTML, CSS e altri standard del Web, mentre i riferimenti visivi come il rientro automatico, la colorazione del codice e i font ridimensionabili contribuiscono a ridurre gli errori e a rendere il codice più facile da leggere. 

Suggerimenti sul codice

La funzionalità di suggerimenti sul codice in Dreamweaver è ottimizzata per fornire informazioni di maggior utilità per il codice selezionato.

Nelle versioni precedenti di Dreamweaver, quando digitate una parentesi angolare di apertura, viene visualizzato un elenco a discesa del codice pertinente.

In questa versione, non solo è visualizzato il codice pertinente, ma anche informazioni aggiuntive che consentono di velocizzare l'apprendimento di HTML, CSS e altre tecnologie Web direttamente in Dreamweaver. 

Suggerimenti ottimizzati sul codice
Suggerimenti ottimizzati sul codice

Per ulteriori informazioni, consultate Suggerimenti sul codice e completamento del codice.

Miglioramenti alla visualizzazione del codice

L'aspetto generale del codice è ora ottimizzato per migliorarne la leggibilità. Potrete notare miglioramenti nella formattazione e nella colorazione del codice e nel ridimensionamento dei font. 

Formattazione del codice

Durante la scrittura del codice, Dreamweaver inserisce automaticamente i rientri del codice per evitare rientri manuali erronei e migliorare la leggibilità.

Colorazione codice

Dreamweaver supporta ora la colorazione del codice per un numero maggiore di tipi di file.

Il supporto per la colorazione del codice è ora disponibile per HTML, JS, CSS, PHP, XML, LESS, Sass, SCSS, SVG, Bash, C, C#, C++, clojure, CoffeeScript, Dart, Diff, EJS, Embedded Ruby, Groovy, Handlebars, Haskell, Haxe, Java, JSON, Lua, Markdown, Markdown (GitHub), Perl, Properties, Python, RDF Turtle, Ruby, Scala, SQL, Stylus, Text, VB, VBScript, XML e YAML. 

È possibile modificare l'evidenziazione della sintassi per tipi di file diversi direttamente dalla barra di stato nella vista Codice.

Ridimensionamento dei font

Per ridimensionare il font, utilizzate le seguenti scelte rapide da tastiera senza uscire dalla vista Codice:

  • Per aumentare la dimensione del font, Ctrl++ (Win) o Comando++ (Mac)
  • Per ridurre la dimensione del font, Ctrl+- (Win) o Comando+- (Mac)
  • Per reimpostare la dimensione del font predefinito, Ctrl+0 (Win) or Comando+0 (Mac)

Per ulteriori informazioni relative a queste modifiche, vedete Ambiente di codifica in Dreamweaver.

Supporto per preprocessori CSS

Dreamweaver ora supporta i preprocessori CSS più comuni, come Sass, Less e SCSS, con funzionalità complete di compilazione, colorazione del codice e suggerimenti sul codice, così potrete risparmiare tempo e produrre codice più chiaro.

Supporto per preprocessori CSS
Supporto per preprocessori CSS

Per ulteriori informazioni sul supporto per i preprocessori CSS in Dreamweaver, vedete Preprocessori CSS.

Anteprima in tempo reale nel browser

Visualizzate rapidamente in anteprima le modifiche al codice in tempo reale senza dover aggiornare manualmente il browser. Dreamweaver ora si connette al browser in modo che le modifiche siano visualizzate istantaneamente senza ricaricare la pagina. 

Anteprima delle modifiche in tempo reale nel browser
Anteprima delle modifiche in tempo reale nel browser

Per ulteriori informazioni, vedete Anteprima in tempo reale.

Modifica rapida dei file di codice correlato

Per modificare rapidamente il codice, posizionate il cursore su snippet di codice specifici e utilizzate il menu di scelta rapida o premete Ctrl-E (Windows) o Comando-E (Mac) per accedere a Modifica rapida.

Dreamweaver offre opzioni del codice specifiche al contesto e strumenti in linea.

Per ulteriori informazioni, vedete Modifica rapida.

Modificate rapidamente il codice correlato senza aprire più file o schede
Modificate rapidamente il codice correlato senza aprire più file o schede

Documentazione CSS nel contesto

Dreamweaver fornisce la documentazione nel contesto delle proprietà CSS direttamente nella vista Codice.

Ora per apprendere o fare riferimento alle proprietà CSS non è più necessario passare da Dreamweaver a una pagina web. Premete Ctrl+K (Windows) o Comando+K (Mac) per visualizzare la guida di CSS.

Aiuto Doc rapidi per CSS nell'interfaccia della vista Codice di Dreamweaver
Aiuto Doc rapidi per CSS nell'interfaccia della vista Codice di Dreamweaver

Per ulteriori informazioni, vedete Documentazione CSS nel contesto.

Più cursori per scrivere e modificare il codice

Per scrivere più righe di codice contemporaneamente, utilizzate più cursori.

Questa funzione aumenta notevolmente la produttività, dato che non è necessario scrivere la stessa riga di codice più volte.

Per richiamare più cursori, potete:

  • Per aggiungere i cursori a più righe contigue, tenete premuto il tasto Alt, quindi trascinate in verticale.
  • Per aggiungere cursori su più righe di testo non contigue, premete il tasto Ctrl e fate clic sulle diverse righe in cui posizionare il cursore.
  • Per selezionare il testo su più righe contigue, premete il tasto Alt e trascinate in diagonale
  • Per selezionare testo su più righe non contigue, selezionate del testo, quindi premete il tasto Ctrl (Windows) o Comando (Mac) e continuate a selezionare. 

Interfaccia utente moderna

Dreamweaver è riprogettato con un'interfaccia più intuitiva e personalizzabile, con menu e pannelli più accessibili e una barra degli strumenti contestuale e configurabile che visualizza solo gli strumenti necessari.

La nuova interfaccia offre anche quattro livelli di contrasto, da chiaro a scuro, così è più facile leggere e modificare le righe di codice.

Di seguito sono riportati alcune istantanee del prima e dopo della nuova interfaccia utente.

Interfaccia utente - Dreamweaver versione 2015

Nuova interfaccia utente - Dreamweaver CC versione 2017


Modifiche ai menu, alle aree di lavoro e alle barre degli strumenti

In questa versione sono stati riprogettati anche i menu, le barre degli strumenti e le aree di lavoro di Dreamweaver. Continuate a leggere per ulteriori informazioni su tali modifiche.

Modifiche alle aree di lavoro

L'interfaccia di Dreamweaver è ottimizzata per includere le seguenti aree di lavoro predefinite:

  • Area di lavoro Sviluppatore

Questa area di lavoro è minimale e, per impostazione predefinita, include solo i pannelli più importanti per gli sviluppatori che scrivono codice per i siti Web, ad esempio i pannelli File e Snippet.

  • Area di lavoro Standard 

Questa area di lavoro comprende tutto il necessario per lavorare sul codice e alla progettazione, ad esempio i pannelli File, CC Libraries, CSS Designer, Inserisci, DOM, Risorse e Snippet.

Nota:

dopo aver selezionato un'area di lavoro, è possibile personalizzarla per aggiungere o rimuovere pannelli. Per ulteriori informazioni sulla personalizzazione delle aree di lavoro, vedeteCreare aree di lavoro personalizzate.

Di seguito è riportato un riepilogo delle differenze nelle aree di lavoro disponibili in Dreamweaver CC 2015 e Dreamweaver CC 2017.

Dreamweaver CC 2015

  • Principiante
  • Codice
  • Predefinito
  • Progettazione
  • Extract

Dreamweaver CC 2017

  • Sviluppatore
  • Standard

Per ulteriori informazioni sui cambiamenti alle aree di lavoro, vedete Area di lavoro di Dreamweaver.

Modifiche ai menu

Il menu dell'applicazione è stato rinnovato per rimuovere le voci di menu poco utilizzate e per spostarne altre in posizioni più intuitive.

Per una descrizione dettagliata delle modifiche nel menu dell'applicazione Dreamweaver, consultate Menu riprogettati.

Modifiche alla barra degli strumenti

La barra degli strumenti è condivisa tra tutte le visualizzazioni. La barra degli strumenti visualizza solo gli strumenti necessari per la visualizzazione in cui si sta lavorando.

Tuttavia, è possibile personalizzare la barra degli strumenti per visualizzare il set di strumenti necessari.

Per ulteriori informazioni, vedete Panoramica sulla barra degli strumenti.

Modifiche alla barra di stato

La barra di stato visualizza ora informazioni utili quando utilizzate la vista Codice. 

Ora potete:

  • Alternare tra le modalità INS (Inserisci) e OVR (Sovrascrivi)
  • Vedere il numero di riga e colonna nella parte inferiore della schermata. Questi valori indicano la riga e la colonna in cui il mouse è posizionato.
  • Selezionate la colorazione del codice desiderata per tipi diversi di file di codice.

Per ulteriori informazioni, consultate Panoramica sulla barra di stato.

Modifiche al pannello Snippet

Il pannello Snippet è stato riprogettato con un aspetto essenziale per semplificare il processo di inserimento degli snippet.

L'immagine seguente evidenzia le modifiche principali nel pannello Snippet:

Modifiche dell'interfaccia utente nel pannello Snippet
Modifiche dell'interfaccia utente nel pannello Snippet

Nelle versioni precedenti di Dreamweaver, era necessario inserire gli snippet tramite le scelte rapide da tastiera.

L'inserimento di snippet tramite le scelte rapide da tastiera non è un processo efficiente per i seguenti motivi:

  • La necessità di ricordare scelte rapide non intuitive
  • Possibili conflitti con le scelte rapide delle parole chiave del prodotto

Per inserire gli snippet di codice in questa versione di Dreamweaver, potete utilizzare i tasti di attivazione.

I tasti di attivazione sono stringhe di testo intuitive assegnate agli snippet di codice. Ad esempio, per uno snippet di codice che crea un collegamento mailto, potete digitare "mailto" e renderlo il tasto di attivazione.

Dopo aver assegnato un tasto di attivazione, posizionate il cursore nel documento, digitate "mailto" e premete il tasto Tab. Dreamweaver inserisce così lo snippet di codice correlato nel documento.

Per ulteriori informazioni sul pannello Snippet, consultate Riutilizzo del codice con gli snippet.

Modifiche al pannello File

Il pannello File è stato riprogettato per renderlo più semplice e intuitivo da utilizzare.

Nella sua funzione più semplice, il pannello File visualizza solo un elenco di file locali nel computer. Utilizzando progressivamente il pannello File con altre funzioni, configurando un sito, le connessioni ai server remoti, attivando le funzioni di deposito e ritiro, saranno visualizzate più opzioni.

Per ulteriori informazioni sulle modifiche apportate al pannello File, consultate Riprogettazione del pannello File.

Modifiche nella Schermata di benvenuto e nella procedura guidata

Quando avviate Dreamweaver o quando chiudete tutti i documenti di Dreamweaver, viene visualizzata una nuova area di lavoro Inizio. Mediante l'area di lavoro Inizio avete accesso rapido ai file, alle librerie e ai modelli campione utilizzati di recente.

Se preferite le vecchie finestre di dialogo, potete comunque digitare Ctrl/Comando + O per aprire la finestra di dialogo Apri o Ctrl/Comando + N per aprire la finestra di dialogo Nuovo documento.  

Per comprendere rapidamente le modifiche all'area di lavoro di Dreamweaver CC 2017, è disponibile una procedura guidata. Consente di fare una rapida esperienza della personalizzazione e saranno visualizzate l'area di lavoro e le opzioni dei temi più adatte a voi.

Per ulteriori informazioni, vedete Area di lavoro di Dreamweaver.

Evidenziazione dal vivo in ricerca e sostituzione

La nuova e discreta barra degli strumenti Cerca e sostituisci è posizionata nella parte superiore della finestra, senza bloccare nessuna porzione della schermata.

Rispetto alle versioni precedenti di Dreamweaver, Cerca e sostituisci è generalmente più veloce ed efficiente. Dreamweaver ora rileva le stringhe di ricerca durante la digitazione nel pannello Cerca ed evidenzia tutte le istanze della stringa nel documento corrente. 

Per ulteriori informazioni, consultate Trovare e sostituire il testo.

Miglioramenti in Creative Cloud Assets

Archiviate, ripristinate, aggiungete commenti e visualizzate la cronologia delle versioni di tutte le risorse archiviate in Creative Cloud, inclusi i file di Creative Cloud Libraries, le risorse create con i prodotti desktop CC e i progetti per dispositivi mobili.

Recupero automatico dei file dopo un arresto anomalo

Se Dreamweaver si chiude inaspettatamente a causa di errori di sistema, interruzioni elettriche o altri problemi, potete recuperare tutte le modifiche non salvate apportate ai file che stavate modificando.

Per ulteriori informazioni, consultate Recupero automatico dei file.

Questo prodotto è concesso in licenza in base alla licenza di Attribuzione-Non commerciale-Condividi allo stesso modo 3.0 Unported di Creative Commons.  I post su Twitter™ e Facebook non sono coperti dai termini di Creative Commons.

Note legali   |   Informativa sulla privacy online