Guida utente Annulla

Creare e aprire file

Cerca
Dreamweaver

Dreamweaver

Apri app
  1. Guida utente di Dreamweaver
  2. Introduzione
    1. Nozioni di base sul design responsive
    2. Novità di Dreamweaver
    3. Sviluppo Web con Dreamweaver - Panoramica
    4. Dreamweaver / Domande frequenti
    5. Scelte rapide da tastiera
    6. Requisiti di sistema di Dreamweaver
    7. Riepilogo delle funzioni
  3. Dreamweaver e Creative Cloud
    1. Sincronizzare le impostazioni di Dreamweaver con Creative Cloud
    2. Creative Cloud Libraries in Dreamweaver
    3. Utilizzare i file Photoshop in Dreamweaver
    4. Operazioni con Adobe Animate e Dreamweaver
    5. Estrarre file SVG ottimizzati per il Web da Libraries
  4. Aree di lavoro e viste di Dreamweaver
    1. Area di lavoro di Dreamweaver
    2. Ottimizzare l'area di lavoro di Dreamweaver per lo sviluppo visivo
    3. Eseguire ricerche nei file in base al nome file o al contenuto | Mac OS
  5. Configurare i siti
    1. Siti di Dreamweaver
    2. Configurare una versione locale del sito
    3. Collegamento a un server di pubblicazione
    4. Configurare un server di prova
    5. Importare ed esportare le impostazioni di un sito Dreamweaver
    6. Passaggio di siti Web esistenti da un server remoto alla cartella principale del sito locale
    7. Funzioni di accessibilità in Dreamweaver
    8. Impostazioni avanzate
    9. Impostazione delle preferenze del sito per il trasferimento dei file
    10. Specificare le Impostazioni del server proxy in Dreamweaver
    11. Sincronizzare le impostazioni di Dreamweaver con Creative Cloud
    12. Utilizzo di Git in Dreamweaver
  6. Gestire i file
    1. Creare e aprire file
    2. Gestire file e cartelle
    3. Scaricamento e caricamento dei file da e verso il server
    4. Depositare e ritirare i file
    5. Sincronizzare i file
    6. Confrontare file per verificare le differenze
    7. Applicare la maschera file a file e cartelle del sito Dreamweaver
    8. Attivare le Design Notes per i siti di Dreamweaver
    9. Impedire un potenziale attacco exploit del Gatekeeper
  7. Layout e progettazione
    1. Usare i riferimenti visivi per il layout
    2. Informazioni sull'utilizzo di CSS per creare il layout della pagina
    3. Progettazione di siti Web reattivi con Bootstrap
    4. Creazione e utilizzo di media query in Dreamweaver
    5. Presentare il contenuto mediante le tabelle
    6. Colori
    7. Responsive design con i layout a griglia fluida
    8. Extract in Dreamweaver
  8. CSS
    1. Nozioni sui fogli di stile CSS
    2. Creazione del layout delle pagine con CSS Designer
    3. Utilizzare i preprocessori CSS in Dreamweaver
    4. Impostare le preferenze di stile CSS in Dreamweaver
    5. Spostare le regole CSS in Dreamweaver
    6. Convertire CSS in linea in una regola CSS in Dreamweaver
    7. Utilizzare i tag div
    8. Applicare sfumature allo sfondo
    9. Creare e modificare effetti di transizione CSS3 in Dreamweaver
    10. Formattazione del codice
  9. Contenuto e risorse delle pagine
    1. Impostare le proprietà di pagina
    2. Impostare le proprietà dei collegamenti CSS e le proprietà dei collegamenti CSS
    3. Lavorare con il testo
    4. Ricercare e sostituire testo, tag e attributi
    5. Pannello DOM
    6. Modifica nella vista Dal vivo
    7. Codifica dei documenti in Dreamweaver
    8. Selezionare e visualizzare gli elementi nella finestra del documento
    9. Definire le proprietà del testo nella finestra di ispezione Proprietà
    10. Eseguire il controllo ortografico di una pagina Web
    11. Utilizzo dei filetti orizzontali in Dreamweaver
    12. Aggiungere e modificare le combinazioni di caratteri in Dreamweaver
    13. Operazioni con le risorse
    14. Inserire e aggiornare le date in Dreamweaver
    15. Creare e gestire le risorse preferite in Dreamweaver
    16. Inserire e modificare le immagini in Dreamweaver
    17. Aggiungere oggetti multimediali
    18. Aggiunta di video in Dreamweaver
    19. Inserire video HTML5
    20. Inserire file SWF
    21. Aggiungere effetti audio
    22. Inserire l'audio HTML5 in Dreamweaver
    23. Operazioni con le voci di libreria
    24. Utilizzare testo in arabo e in ebraico in Dreamweaver
  10. Collegamenti e navigazione
    1. Informazioni sui collegamenti e sulla navigazione
    2. Collegamenti
    3. Mappe immagine
    4. Risoluzione dei problemi di collegamenti
  11. Widget ed effetti jQuery
    1. Utilizzare i widget jQuery UI e Mobile in Dreamweaver
    2. Usare effetti jQuery in Dreamweaver
  12. Programmazione dei siti Web
    1. Programmazione in Dreamweaver
    2. Ambiente di codifica in Dreamweaver
    3. Impostare le preferenze di codifica
    4. Personalizzare la colorazione del codice
    5. Scrivere e modificare codice
    6. Suggerimenti sul codice e completamento del codice
    7. Comprimere ed espandere codice
    8. Riutilizzo del codice con gli snippet
    9. Comando Lint
    10. Ottimizzare il codice
    11. Modificare il codice nella vista Progettazione.
    12. Utilizzo del contenuto dell'intestazione delle pagine
    13. Inserimento di server-side include in Dreamweaver
    14. Uso delle librerie di tag in Dreamweaver
    15. Importazione di tag personalizzati in Dreamweaver
    16. Utilizzare i comportamenti JavaScript (istruzioni generali)
    17. Applicare comportamenti JavaScript incorporati
    18. Informazioni su XML e XSLT
    19. Eseguire trasformazioni XSL server-side in Dreamweaver
    20. Esecuzione di trasformazioni XSL client-side in Dreamweaver
    21. Aggiungere entità di carattere per XSLT in Dreamweaver
    22. Formattazione del codice
  13. Flussi di lavoro di interazione con altri prodotti
    1. Installazione e uso delle estensioni in Dreamweaver
    2. Aggiornamenti in app in Dreamweaver
    3. Inserire documenti Microsoft Office in Dreamweaver (solo Windows)
    4. Operazioni con Fireworks e Dreamweaver
    5. Modificare il contenuto nei siti Dreamweaver mediante Contribute
    6. Integrazione tra Dreamweaver e Business Catalyst
    7. Creare campagne e-mail personalizzate
  14. Modelli
    1. Informazioni sui modelli di Dreamweaver
    2. Riconoscere i modelli e i documenti basati sui modelli
    3. Creare un modello di Dreamweaver
    4. Creare aree modificabili nei modelli
    5. Creare aree e tabelle ripetute nei modelli in Dreamweaver
    6. Usare le aree opzionali nei modelli
    7. Definire attributi di tag modificabili in Dreamweaver
    8. Creare modelli nidificati in Dreamweaver
    9. Modificare, aggiornare ed eliminare modelli
    10. Esportare e importare contenuti xml in Dreamweaver
    11. Applicare o rimuovere un modello da un documento esistente
    12. Modificare il contenuto nei modelli di Dreamweaver
    13. Regole di sintassi per i tag di modello in Dreamweaver
    14. Impostare le preferenze di evidenziazione per le aree dei modelli
    15. Vantaggi dell'uso dei modelli in Dreamweaver
  15. Dispositivi mobili e multischermo
    1. Creare media query
    2. Cambiamento dell'orientamento della pagina per i dispositivi mobili
    3. Creare web app per dispositivi mobili utilizzando Dreamweaver
  16. Siti, pagine e moduli Web dinamici
    1. Applicazioni Web
    2. Configurare il computer per lo sviluppo di applicazioni
    3. Risoluzione dei problemi relativi alle connessioni di database
    4. Rimozione di script di connessione in Dreamweaver
    5. Progettare pagine dinamiche
    6. Panoramica sulle origini di contenuto dinamico
    7. Definire le origini di contenuto dinamico
    8. Aggiungere contenuto dinamico alle pagine
    9. Modifica del contenuto dinamico in Dreamweaver
    10. Visualizzare i record di database
    11. Fornire dati dal vivo e risoluzione dei problemi in Dreamweaver
    12. Aggiungere comportamenti server personalizzati in Dreamweaver
    13. Creazione di moduli con Dreamweaver
    14. Usare moduli per raccogliere informazioni dagli utenti
    15. Creare e attivare i moduli ColdFusion in Dreamweaver
    16. Creare moduli Web
    17. Supporto HTML5 avanzato per gli elementi modulo
    18. Sviluppare un modulo con Dreamweaver
  17. Sviluppo visivo delle applicazioni
    1. Creare pagine principali e di dettaglio in Dreamweaver
    2. Creare pagine di ricerca e di risultati
    3. Creare una pagina di inserimento record
    4. Costruire una pagine di aggiornamento record in Dreamweaver
    5. Costruzione di pagine di eliminazione record in Dreamweaver
    6. Utilizzare comandi ASP per modificare un database in Dreamweaver
    7. Creare una pagina di registrazione
    8. Creare una pagina di login
    9. Creare una pagina accessibile solo agli utenti autorizzati
    10. Protezione delle cartelle in ColdFusion utilizzando Dreamweaver
    11. Utilizzo di componenti ColdFusion in Dreamweaver
  18. Verifica, anteprima e pubblicazione dei siti Web
    1. Anteprima delle pagine
    2. Visualizzare in anteprima pagine web di Dreamweaver su più dispositivi
    3. Verificare il sito Dreamweaver
  19. Risoluzione dei problemi
    1. Problemi risolti
    2. Problemi noti

 

 

Creare, aprire, modificare, salvare e ripristinare file in Dreamweaver. Creare modelli e aprire i file correlati.

Dreamweaver offre un ambiente flessibile in cui lavorare a più tipi di documenti Web. Oltre ai documenti HTML, potete creare e aprire un'ampia gamma di documenti basati su testo, ad esempio JavaScript, PHP e CSS (Cascading Style Sheets).

Dreamweaver fornisce diverse opzioni per creare un nuovo documento. Potete scegliere una delle opzioni seguenti:

  • Un nuovo documento o modello vuoto

  • Un documento basato su uno dei layout di pagina predefiniti forniti con Dreamweaver, tra cui oltre 30 layout di pagina basati su CSS

  • Un documento partendo da uno dei modelli esistenti

    Potete anche impostare le preferenze dei documenti. Ad esempio, se normalmente lavorate con un solo tipo di documento, potete impostarlo come tipo di documento predefinito per la creazione di nuove pagine.

    Nella vista Progettazione o Codice, potete definire con facilità le proprietà dei documenti, come i tag meta, il titolo del documento, i colori di sfondo e molte altre proprietà della pagina.

Tipi di file di Dreamweaver

In Dreamweaver è possibile lavorare con vari tipi di file. Il tipo di file fondamentale utilizzato è il file HTML. I file HTML, o Hypertext Markup Language, includono il linguaggio basato sui tag responsabile della visualizzazione di una pagina Web in un browser. Potete salvare i file HTML con estensione .html o .htm. Per impostazione predefinita, Dreamweaver salva i file utilizzando l'estensione .html.

Dreamweaver permette di creare e modificare pagine Web basate sul linguaggio HTML5. Sono anche disponibili dei layout di esempio per realizzare pagine HTML5 da zero.

Alcuni dei tipi di file più comuni che potete utilizzare in Dreamweaver sono indicati di seguito:

CSS

I file CSS (Cascading Style Sheet) hanno l'estensione .css. Sono utilizzati per formattare i contenuti HTML e controllare il posizionamento dei vari elementi di una pagina.

GIF

I file GIF (Graphics Interchange Format) hanno l'estensione .gif. Il formato GIF è un formato per la grafica Web molto diffuso per sequenze animate, immagini con aree trasparenti e animazioni. I file GIF contengono un massimo di 256 colori.

JPEG

I file JPEG (Joint Photographic Experts Group, dal nome dell'organizzazione che ha creato questo formato) hanno l'estensione .jpg e generalmente rappresentano immagini fotografiche o a elevati contenuti cromatici. Il formato JPEG è la scelta ottimale per le fotografie digitali o scansionate, le immagini che utilizzano texture, le immagini con transizioni di colori sfumati o qualsiasi immagine che richieda più di 256 colori.

XML

I file XML (Extensible Markup Language) hanno l'estensione .xml. Includono dati in forma non elaborata che possono essere formattati tramite il linguaggio XSL (Extensible Stylesheet Language).

Finestra di dialogo Nuovo documento

La finestra di dialogo Nuovo documento visualizza tutti i tipi di file supportati, compresi PHP, XML e SVG.

Da questa finestra di dialogo potete inoltre accedere a layout, modelli e framework predefiniti.

Nota:

Tutti i layout campione presentati sono creati per supportare i siti Web reattivi e sono conformi allo standard HTML 5.

Creare un layout HTML utilizzando una pagina vuota

Potete creare pagine contenenti un layout CSS predefinito, oppure creare pagine completamente vuote in cui utilizzare un layout personalizzato.

  1. Selezionate File > Nuovo.

  2. Nella categoria Nuovo documento, selezionate il tipo di pagina che desiderate creare dalla colonna Tipo di documento. Ad esempio, selezionate HTML per creare una pagina HTML semplice.

  3. Selezionate un tipo di documento dal menu a comparsa DocType. Nella maggior parte dei casi, potete utilizzare la selezione predefinita, HTML5..

  4. Selezionate altre opzioni in base al tipo di pagina che desiderate creare.

    • Nessuna: selezionate questa opzione per creare una pagina Web semplice senza utilizzare alcun framework.
    • Bootstrap: i modelli Bootstrap sono layout predefiniti che utilizzando il framework Bootstrap. Selezionate questa opzione per creare pagine Web reattive utilizzando il framework Bootstrap. Per impostazione predefinita, viene creato un documento Bootstrap 4.0.0.
    Nota:

    Se prevedete di creare pagine Web reattive, selezionate il framework Bootstrap.

  5. Se non utilizzate un framework, allora:

    • Titolo del documento: immettete in questo campo il titolo del documento; Dreamweaver lo aggiungerà automaticamente alla sezione <head> del documento.
    • Tipo di documento: selezionate un tipo di documento dal menu a comparsa DocType. Nella maggior parte dei casi, potete utilizzare la selezione predefinita, HTML5.

    Selezionate una delle definizioni di tipo di documento XHTML dal menu Tipo di documento per fare in modo che le pagine siano conformi alle specifiche XHTML. Ad esempio, potete rendere un documento HTML compatibile con la specifica XHTML selezionando XHTML 1.0 Transitional o XHTML 1.0 Strict dal menu. Il linguaggio XHTML (Extensible Hypertext Markup Language) è una riformulazione del linguaggio HTML come applicazione XML. In generale, il linguaggio XHTML offre i vantaggi del linguaggio XML, garantendo una compatibilità dei documenti Web sia con versioni successive che precedenti.

    Nota:

    Per ulteriori informazioni su XHTML, consultate il sito Web del World Wide Web Consortium (W3C), che contiene le specifiche di XHTML - Module-Based XHTML (www.w3.org/TR/xhtml11/) e XHTML 1.0 (www.w3c.org/TR/xhtml1/), oltre ai siti di convalida XHTML per i file basati su Web (http://validator.w3.org/) e i file locali (http://validator.w3.org/file-upload.html).

    • Associa CSS: associate un layout CSS esistente alla pagina. A questo scopo, fate clic sull'icona Associa foglio di stile  accanto al riquadro Associa file CSS e selezionate un foglio di stile CSS.
    Creare una nuova pagina HTML senza utilizzare a un framework
    Creare una nuova pagina HTML senza utilizzare a un framework

    Per creare una nuova pagina basata sulla composizione Photoshop, selezionate Usa Extract per creare la pagina dalle composizioni in Photoshop. 

    La selezione di questa opzione consente di aprire il pannello Extract in cui potete caricare un file PSD e iniziare a creare la pagina HTML.

  6. Per creare una pagina Web reattiva utilizzando il framework Bootstrap:

    • CSS Bootstrap: scegliete di creare un nuovo CSS Bootstrap, oppure utilizzate un file CSS esistente. Se utilizzate un file CSS esistente, inserite il percorso del file. Verificate che il file CSS sia all'interno della cartella principale del sito.
    • Associa CSS: associate un layout CSS esistente alla pagina. A questo scopo, fate clic sull'icona Associa foglio di stile  accanto al riquadro Associa file CSS e selezionate un foglio di stile CSS.
    • Includi un layout predefinito: selezionate questa opzione se disponete già di un layout. Fate clic su Personalizza per modificare i valori della griglia e dei punti di interruzione.
    Creare una nuova pagina HTML con il framework Bootstrap
    Creare una nuova pagina HTML con il framework Bootstrap

    Per creare una nuova pagina basata sulla composizione Photoshop, selezionate Usa Extract per creare la pagina dalle composizioni in Photoshop. 

    La selezione di questa opzione consente di aprire il pannello Extract in cui potete caricare un file PSD e iniziare a creare la pagina HTML.

  7. Fate clic su Preferenze per impostare le preferenze predefinite per i documenti, quali tipo di documento, codifica ed estensione dei file.

  8. Fate clic sul pulsante Crea.

  9. Salvate il nuovo documento (File > Salva).

  10. Nella finestra di dialogo visualizzata, scorrete fino alla cartella nella quale desiderate salvare il file.
    Nota:

    È opportuno salvare il file in un sito Dreamweaver.

  11. Nella casella Nome file, digitate il nome del file.

    Evitate di inserire spazi e caratteri speciali nel nome dei file e delle cartelle e di iniziare un nome file con un numerale. In particolare, non utilizzate caratteri speciali (ad esempio é, ç o ¥) o segni di interpunzione (come punto e virgola, barre o punti) nei nomi dei file che prevedete di caricare sul server remoto, poiché molti server cambiano questi caratteri al momento del caricamento, causando l'interruzione dei collegamenti ai file.

Creare un modello vuoto

La finestra di dialogo Nuovo documento può essere utilizzata per creare modelli di Dreamweaver. Per impostazione predefinita, i modelli vengono salvati nella cartella Templates del sito.

Nota:

Se non create prima un sito, non sarà possibile creare un modello. Per informazioni sui siti e su come creare un sito, consultate Siti di Dreamweaver.

  1. Selezionate File > Nuovo.

  2. Nella finestra di dialogo Nuovo documento, selezionate la categoria Modelli sito.

  3. Selezionate un tipo di documento dal menu a comparsa DocType. Nella maggior parte dei casi, può essere necessario lasciare selezionata l'impostazione predefinita, XHTML 1.0 Transitional.

    Selezionate una delle definizioni di tipo di documento XHTML dal menu DocType (DTD) per fare in modo che le pagine siano conformi alle specifiche XHTML. Ad esempio, potete rendere un documento HTML compatibile con la specifica XHTML selezionando XHTML 1.0 Transitional o XHTML 1.0 Strict dal menu. Il linguaggio XHTML (Extensible Hypertext Markup Language) è una riformulazione del linguaggio HTML come applicazione XML. In generale, il linguaggio XHTML offre i vantaggi del linguaggio XML, garantendo una compatibilità dei documenti Web sia con versioni successive che precedenti.

    Nota:

    Per ulteriori informazioni su XHTML, consultate il sito Web del World Wide Web Consortium (WC), che contiene le specifiche di XHTML - Module-Based XHTML (www.w3.org/TR/xhtml11/) e XHTML 1.0 (www.w3c.org/TR/xhtml1/), oltre ai siti di convalida XHTML per i file basati su Web (http://validator.w3.org/) e i file locali (http://validator.w3.org/file-upload.html).

  4. Selezionate Aggiorna la pagina quando il modello cambia per aggiornare automaticamente la pagina quando modificate il modello.

  5. Fate clic sul pulsante Crea.

  6. Salvate il nuovo documento (File > Salva). Qualora al modello non siano ancora state aggiunte aree modificabili, verrà visualizzata una finestra di dialogo che indica che all'interno del documento non sono presenti aree modificabili. Per chiudere la finestra di dialogo, fate clic su OK.

  7. Nella finestra di dialogo Salva con nome, selezionate un sito in cui salvare il modello.

  8. Nella casella Nome file, digitate il nome del nuovo modello. Non è necessario aggiungere l'estensione del file al nome del modello. Quando fate clic su Salva, l'estensione .dwt viene aggiunta automaticamente al nome del nuovo modello, il quale viene salvato nella cartella Templates del sito.

    Evitate di inserire spazi e caratteri speciali nel nome dei file e delle cartelle e di iniziare un nome file con un numerale. In particolare, non utilizzate caratteri speciali (ad esempio é, ç o ¥) o segni di interpunzione (come punto e virgola, barre o punti) nei nomi dei file che prevedete di caricare sul server remoto, poiché molti server cambiano questi caratteri al momento del caricamento, causando l'interruzione dei collegamenti ai file.

Creare una pagina basata su un modello

Potete selezionare, visualizzare in anteprima e creare un nuovo documento utilizzando uno dei modelli esistenti o i modelli per iniziare di Dreamweaver. Potete utilizzare la finestra di dialogo Nuovo documento per selezionare un modello da uno qualsiasi dei siti definiti in Dreamweaver, oppure utilizzare il pannello Risorse per creare un nuovo documento da un modello esistente.

Creare un documento in base a un modello

  1. Selezionate File > Nuovo.

  2. Nella finestra di dialogo Nuovo documento, selezionate la categoria Pagina da modello.

  3. Nella colonna Sito, selezionate il sito Dreamweaver contenente il modello che desiderate utilizzare, quindi selezionate un modello dall'elenco a destra.

  4. Deselezionate l'opzione Aggiorna la pagina quando il modello cambia se non desiderate aggiornare la pagina corrente ogni volta che vengono effettuate modifiche nel modello su cui essa è basata.

  5. Fate clic su Preferenze per impostare le preferenze predefinite per i documenti, quali il tipo di documento, la codifica e l'estensione dei file.

  6. Fate clic su Scarica altro contenuto per aprire Dreamweaver Exchange, dove potete scaricare altro contenuto relativo alle strutture di pagina.

  7. Fate clic su Crea e salvate il documento (File > Salva).

Creare un documento in base a un modello nel pannello Risorse

  1. Se non è già aperto, aprite il pannello Risorse (Finestra > Risorse).

  2. Nel pannello Risorse, fate clic sull'icona Modelli a sinistra per visualizzare l'elenco dei modelli del sito corrente.

    Nota:

    Se il modello che desiderate applicare è appena stato creato, potrebbe essere necessario fare clic sul pulsante Aggiorna per visualizzarlo.

  3. Fate clic con il pulsante destro del mouse (Windows) o fate clic tenendo premuto il tasto Ctrl (Macintosh) sul modello che desiderate applicare, quindi selezionate Nuovo da modello.

    Il documento viene aperto nella finestra del documento.

  4. Salvate il documento.

Creare una pagina basata su un modello per iniziare di Dreamweaver

Dreamweaver viene fornito con vari file per iniziare professionali per applicazioni per dispositivi mobili. Questi file di esempio possono essere impiegati come punto di partenza per la creazione di pagine da inserire nei propri siti.

Quando create un documento basato su un modello per iniziare, Dreamweaver crea una copia del file per non sovrascriverlo.

Potete visualizzare in anteprima un file di esempio e leggere una breve descrizione di un elemento di struttura del documento nella finestra di dialogo Nuovo documento.

  1. Selezionate File > Nuovo.

  2. Nella finestra di dialogo Nuovo documento, selezionate la categoria Modelli per iniziare.

    Modelli per iniziare in Dreamweaver
    Modelli per iniziare in Dreamweaver

    Potete visualizzare i dettagli della pagina di esempio e la visualizzazione a destra del pannello durante la selezione delle diverse opzioni.

  3. Fate clic sul pulsante Crea.

    Il nuovo documento e i file correlati si aprono nella finestra Documento.

  4. Salvate il documento (File > Salva).

Creare nuovi file di codice per linguaggi di codifica diversi

In Dreamweaver potete creare file di codice per diversi linguaggi di codifica.

Per ulteriori informazioni sul supporto per la codifica in Dreamweaver, consultate Codice in Dreamweaver.

Per creare un nuovo file di codice in Dreamweaver, attenetevi alle seguenti istruzioni:

  1. Selezionate File > Nuovo documento.

  2. Da Tipo di documento, selezionate il file di codice da creare.

  3. Selezionate il tipo di documento da creare nella colonna Tipo di documento (ad esempio, un file PHP).

    Creazione di una nuova pagina PHP
    Creazione di una nuova pagina PHP

  4. A seconda del tipo di file selezionato, saranno disponibili altre opzioni durante la creazione del documento. 

    Ad esempio, se state creando un file PHP, potete selezionare le opzioni DocType e alcune opzioni CSS.

  5. Fate clic sul pulsante Crea. Salvate quindi il documento (File > Salva).

Salvare e ripristinare i documenti

Potete salvare un documento utilizzando la sua posizione e il suo nome corrente oppure salvare una copia di un documento utilizzando una posizione e un nome diversi.

Nota:

Quando assegnate un nome a un file, evitate l'uso di spazi e caratteri speciali nei nomi di file e di cartella. In particolare, non utilizzate caratteri speciali (ad esempio é, ç o ¥) o segni di interpunzione (come punto e virgola, barre o punti) nei nomi dei file che prevedete di caricare sul server remoto, poiché molti server cambiano questi caratteri al momento del caricamento, causando l'interruzione dei collegamenti ai file. Inoltre, evitate di iniziare un nome di file con un carattere numerico.

Salvare un documento

  1. Effettuate una delle operazioni seguenti:
    • Per sovrascrivere la versione corrente sul disco e salvare le modifiche apportate, selezionate File > Salva.
    • Per salvare il file in una cartella diversa o utilizzare un nome diverso, selezionate File > Salva con nome.
  2. Nella finestra di dialogo Salva con nome visualizzata, scorrete fino alla cartella nella quale desiderate salvare il file.

  3. Nella casella di testo Nome file, digitate un nome per il file.

  4. Fate clic su Salva per salvare il file.

Salvare tutti i documenti aperti

  1. Selezionate File > Salva tutto.

  2. In presenza di documenti aperti non salvati, per ognuno viene visualizzata la finestra di dialogo Salva con nome.

    Nella finestra di dialogo visualizzata, scorrete fino alla cartella nella quale desiderate salvare il file.

  3. Nella casella Nome file, digitate un nome per il file e fate clic su Salva.

Ripristinare l'ultima versione salvata di un documento

  1. Selezionate File > Ripristina.

    Una finestra di dialogo chiede se desiderate annullare le modifiche apportate e ripristinare la versione salvata precedentemente.

  2. Fate clic su Sì per ripristinare la versione precedente oppure su No per conservare le modifiche.

    Nota:

    Se salvate un documento e successivamente chiudete Dreamweaver, non potete ripristinare la versione precedente del documento quando riavviate Dreamweaver.

Impostare il tipo di documento e le preferenze di codifica

Se la maggior parte delle pagine del sito appartiene a un determinato tipo di file, ad esempio HTML, PHP o JavaScript, potete impostare le preferenze del documento in modo che vengano creati nuovi documenti di quello specifico tipo di file.

  1. Selezionate Modifica > Preferenze (Windows) o Dreamweaver > Preferenze (Macintosh).

    Nota:

    Potete inoltre fare clic sul pulsante Preferenze nella finestra di dialogo Nuovo documento per impostare le preferenze di un nuovo documento quando create un nuovo documento.

  2. Fate clic su Nuovo documento dall'elenco Categoria a sinistra.

  3. Impostate o modificate le preferenze in base alle vostre necessità e fate clic su OK per salvarle.

    Documento predefinito

    Selezionate un tipo di documento che verrà utilizzato per le nuove pagine create.

    Estensione predefinita

    Specificate l'estensione di file preferita (.htm o .html) per le nuove pagine HTML che create.

    Nota: questa opzione è disabilitata per gli altri tipi di file.

    Tipo di documento predefinito (DTD)

    Selezionate uno dei DTD (Document Type Definition) XHTML per fare in modo che le pagine siano conformi alle specifiche XHTML. Ad esempio, potete rendere un documento HTML compatibile con la specifica XHTML selezionando XHTML 1.0 Transitional o XHTML 1.0 Strict dal menu.

    Codifica predefinita

    Indica il tipo di codifica da utilizzare quando si crea una nuova pagina o quando si apre un documento che non specifica alcun tipo di codifica.

    Se selezionate Unicode (UTF-8) come codifica dei documenti, la codifica delle entità non è necessaria in quanto UTF-8 può rappresentare tutti i caratteri senza problemi. Se selezionate un'altra codifica per i documenti, la codifica delle entità può essere necessaria per rappresentare determinati caratteri. Per ulteriori informazioni sulle entità di carattere, vedete www.w3.org/TR/REC-html40/sgml/entities.html.

    Se selezionate Unicode (UTF-8) come codifica predefinita, potete includere un BOM (Byte Order Mark) nel documento selezionando l'opzione Includi firma Unicode (BOM).

    Una firma BOM contiene da 2 a 4 byte inseriti all'inizio di un file di testo e identifica il file come Unicode, definendo anche l'ordine dei byte successivi. Poiché il formato UTF-8 non prevede un ordine byte, l'aggiunta di una firma BOM UTF-8 è opzionale, mentre è obbligatoria per UTF-16 e UTF-32.

    Modulo di normalizzazione Unicode

    Selezionate una di queste opzioni se avete selezionato anche l'opzione Unicode (UTF-8) come codifica predefinita.

    Esistono quattro moduli di normalizzazione Unicode, il più importante dei quali è il modulo C perché è il più utilizzato nel Modello caratteri del World Wide Web. Adobe mette a disposizione anche gli altri tre moduli di normalizzazione Unicode, per completezza.

    Mostra finestra di dialogo Nuovo documento se viene premuto Ctrl+N

    Deselezionate questa opzione (che in Macintosh si chiama Mostra finestra di dialogo Nuovo documento se viene premuto Comando+N) per creare automaticamente, ogni volta che utilizzate questa combinazione di tasti, un nuovo documento del tipo predefinito.

    In Unicode, alcuni caratteri sono visivamente simili ma possono essere memorizzati nel documento in modi diversi. Ad esempio, la “ë” (e con umlaut) può essere rappresentata come carattere singolo (“e-umlaut”) o come carattere doppio (“e Latin standard” + “umlaut combinato”). Un carattere combinato Unicode è un carattere che viene utilizzato in coppia con il carattere precedente, in modo che, ad esempio, l'umlaut appaia sopra la “e Latin”. Entrambi i formati producono la stessa composizione tipografica visiva, ma i dati salvati nel file sono diversi.

    Il processo di normalizzazione assicura che tutti i caratteri che possono essere memorizzati in formati diversi vengano salvati nello stesso formato, ad esempio, che tutti i caratteri “ë” di un documento vengano salvati come “e-umlaut” oppure come “e” + “umlaut combinato”, ma non in entrambi i formati.

    Per ulteriori informazioni sulla normalizzazione Unicode e sui formati specifici che possono essere utilizzati, consultate il sito web Unicode all'indirizzo www.unicode.org/reports/tr15.

Aprire e modificare documenti esistenti

Potete aprire una pagina Web esistente o un documento di testo, anche se non è stato creato in Dreamweaver, e modificarlo in vista Progettazione o in vista Codice.

Se il documento che si apre è un file di Microsoft Word che è stato salvato come documento HTML, occorre utilizzare il comando Strumenti > Ottimizza HTML di Word per eliminare i tag estranei inseriti nei file HTML da Word.

Per ottimizzare i file HTML o XHTML che non sono stati creati con Microsoft Word, utilizzate il comando Strumenti > Ottimizza HTML. Per ulteriori informazioni, consultate Ottimizzare il codice HTML di Microsoft Word.

Inoltre, potete aprire i file di testo non HTML, come i file JavaScript, i file XML, i fogli di stile CSS o i file di testo salvati con programmi di elaborazione o editor di testi.

  1. Selezionate File > Apri.

    Nota:

    Potete anche utilizzare il pannello File per aprire i file.

  2. Scorrete fino al file da aprire e selezionatelo.
    Nota:

    se l'operazione non è già stata eseguita, è opportuno organizzare i file da aprire e modificare in un sito Dreamweaver, invece di aprirli da un'altra posizione. Per ulteriori informazioni sui siti Dreamweaver, consultate Siti di Dreamweaver.

  3. Fate clic su Apri.

    Il documento viene aperto nella finestra del documento. Per impostazione predefinita, i file JavaScript, di testo e i fogli di stile CSS vengono visualizzati nella vista Codice. Potete aggiornare il documento mentre lavorate con Dreamweaver e salvare le modifiche apportate ai file.

Dreamweaver consente di visualizzare file correlati al documento principale, senza perdere lo stato attivo del documento principale. Se, ad esempio, al documento principale sono collegati file CSS e JavaScript, Dreamweaver consente di visualizzare e modificare questi file correlati nella finestra del documento mantenendo visibile il documento principale.

Per informazioni sui file correlati dinamici, consultate Aprire i file correlati dinamicamente.

Nota:

Quando lavorate con file HTML e desiderate apportare modifiche rapide ai file CSS, JavaScript o PHP correlati senza dover accedere a tale file, potete utilizzare Modifica rapida. Per ulteriori informazioni, consultate Modifica rapida.

Per impostazione predefinita, Dreamweaver visualizza i nomi di tutti i file correlati a un documento principale in una barra degli strumenti File correlati posta sotto il titolo del documento principale. L'ordine dei pulsanti nella barra degli strumenti corrisponde all'ordine dei collegamenti dei file correlati presenti nel documento principale.

Nota:

se un file correlato è assente, Dreamweaver visualizzerà comunque il pulsante corrispondente nella barra degli strumenti File correlati. Se tuttavia fate clic su quel pulsante, non verrà visualizzato alcun file.

Dreamweaver supporta i seguenti tipi di file correlati:

  • File di script client-side
  • SSI (Server Side Include)
  • Fogli di stile CSS esterni (inclusi i fogli di stile nidificati)

Effettuate una delle operazioni seguenti:

  • Nella barra degli strumenti File correlati presente nella parte superiore del documento, fate clic sul nome del file correlato che desiderate aprire.

  • Nella barra degli strumenti File correlati, fate clic con il pulsante destro del mouse sul nome del file correlato che desiderate aprire e selezionate Apri come file separato dal menu di scelta rapida. Quando aprite un file correlato con questo metodo, il documento principale non rimane visibile contemporaneamente.

  1. Posizionate il punto di inserimento su una riga o in un'area interessata da un file correlato.

  2. Attendete la visualizzazione dell'indicatore di Navigazione codice, quindi fate clic sull'indicatore per aprire Navigazione codice.

  3. Posizionate il cursore sugli elementi presenti in Navigazione codice per visualizzare ulteriori informazioni. Se, ad esempio, desiderate modificare una particolare proprietà di colore CSS, ma non conoscete la regola che contiene tale proprietà, potete individuarla passando il cursore sopra le regole disponibili in Navigazione codice.

  4. Fate clic sull'elemento a cui siete interessati per aprire il file correlato corrispondente.

Ritornare al codice di origine del documento principale

  1. Fate clic sul pulsante Codice di origine nella barra degli strumenti File correlati.

Quando aprite un file correlato dalla vista Progettazione o dalle viste Codice e Progettazione (vista combinata), il file correlato viene visualizzato nella vista Dividi.

Potete selezionare Visualizza > Dividi e scegliere tra le diverse opzioni della vista Dividi per personalizzarla.

Se desiderate visualizzare i file correlati solo nella vista codice, nella parte superiore della barra degli strumenti selezionate Codice.

Nota:

La vista Codice standard non consente di visualizzare i documenti correlati contemporaneamente al codice di origine del documento principale.

Nota:

il termine “Vista Codice” nell'opzione di visualizzazione si riferisce al codice di origine del documento principale. Se, ad esempio, selezionate Visualizza > Vista Codice in alto, il codice di origine del documento principale viene visualizzato nella metà superiore della finestra del documento. Se selezionate Visualizza > Vista Codice a sinistra, il codice di origine del documento principale viene visualizzato nel lato sinistro della finestra del documento.

Per impostazione predefinita, quando aprite un file HTML, Dreamweaver visualizza i file correlati in schede separate. Questa funzionalità può essere disabilitata nel pannello Preferenze.

  1. Selezionate Modifica > Preferenze (Windows) o Dreamweaver > Preferenze (Macintosh).

  2. Nella categoria Generale, deselezionate Attiva file correlati.

La funzione File correlati dinamicamente estende la funzionalità della funzione File correlati consentendovi di vedere i file correlati delle pagine dinamiche nella barra degli strumenti File correlati. Specificamente, la funzione File correlati dinamicamente permette di visualizzare le numerose include dinamiche che sono necessarie per generare il codice runtime per i più diffusi framework CMS (Content Management System) PHP open source, quali WordPress, Drupal e Joomla!

Per utilizzare la funzione File correlati dinamicamente dovete avere accesso a un server applicazioni PHM locale o remoto sul quale sia in esecuzione WordPress, Drupal o Joomla! Uno dei metodi più comuni per eseguire il testing delle pagine prevede la configurazione di un server applicazioni PHP localhost e il test locale delle pagine.

Prima di testare le pagine, dovete effettuare le operazioni seguenti:

  • Configurate un sito Dreamweaver, compilando la casella di testo URL Web della finestra di dialogo Configurazione sito.

  • Configurate un server applicazioni PHP.

    Nota: il server deve essere già in esecuzione affinché possiate lavorare con i file correlati dinamicamente in Dreamweaver.

  • Installate WordPress, Drupal o Joomla! sul server applicazioni. Per ulteriori informazioni, consultate:

  • In Dreamweaver, definite una cartella locale per il download e la modifica dei file CMS.

  • Definite la posizione dei file WordPress, Drupal o Joomla installati come cartella remota e di prova.

  • Scaricate (get) i file CMS dalla cartella remota.

Quando aprite una pagina associata a file correlati dinamicamente, Dreamweaver è in grado di individuare automaticamente i file, oppure potete individuarli manualmente (facendo clic su un collegamento nella barra Informazioni sopra la pagina). L'impostazione predefinita prevede l'individuazione manuale.

  1. Scegliete Modifica > Preferenze (Windows) o Dreamweaver > Preferenze (Mac OS).

  2. Nella categoria Generali, verificate che l'opzione Attiva file correlati sia selezionata.

  3. Selezionate Manualmente o Automaticamente dal menu a comparsa File correlati dinamicamente. Potete anche scegliere di selezionare Disabilitato per disattivare completamente l'individuazione dei file correlati dinamicamente.

  1. Aprite una pagina alla quale sono associati dei file correlati dinamicamente, ad esempio la pagina index.php nella cartella principale di un sito WordPress, Drupal o Joomla!.

  2. Se l'individuazione dei file correlati dinamicamente è impostata su Manualmente (impostazione predefinita), fate clic sul collegamento Individua nella barra Informazioni visualizzata sopra la pagina nella finestra del documento.

    Se invece l'individuazione è impostata su Automaticamente, nella barra degli strumenti File correlati viene visualizzato l'elenco dei file correlati dinamicamente.

L'ordine dei file correlati e correlati dinamicamente all'interno nella barra degli strumenti File correlati è il seguente:

  • File correlati statici (file che non richiedono alcun tipo di elaborazione dinamica)
  • File correlati esterni (file .css e .js) associati a file di include server con percorso dinamico
  • File di include server con percorso dinamico (file .php, .inc e .module)

Poiché spesso i file correlati e i file correlati dinamicamente sono presenti in numero elevato, Dreamweaver permette di filtrarli in modo da individuare con precisione quelli sui quali volete lavorare.

  1. Aprite una pagina alla quale sono associati dei file correlati.

  2. Individuate i file correlati dinamicamente, se necessario.

  3. Fate clic su sull'icona Filtra file correlati sul lato destro della barra degli strumenti File correlati.

  4. Selezionate i tipi di file che volete visualizzare nella barra degli strumenti File correlati. Per impostazione predefinita, Dreamweaver seleziona tutti i file correlati.

  5. Per creare un filtro personalizzato, fate clic sull'icona Filtra file correlati e scegliete Filtro personalizzato.

    La finestra di dialogo Filtro personalizzato permette di filtrare solo nomi di file esatti (style.css), estensioni di file (.php) o espressioni con caratteri jolly contenenti asterischi (*menu*). Potete filtrare più espressioni con caratteri jolly separandole con il carattere di punto e virgola (ad esempio: style.css;*.js;*tpl.php).

Nota:

una volta chiuso il file, le impostazioni del filtro non vengono salvate.

Ottimizzare il codice HTML di Microsoft Word

Potete aprire documenti salvati in Microsoft Word (Microsoft Word 97 e versioni successive) come file HTML e utilizzare il comando Ottimizza HTML di Word per eliminare il codice HTML estraneo generato da Word.

Il codice eliminato da Dreamweaver è costituito principalmente da elementi per la formattazione e la visualizzazione dei documenti in Word e non è attualmente necessario per la visualizzazione dei file HTML.

Conservate una copia del documento Word (.doc) originale, poiché dopo aver ottimizzato il file HTML l'apertura del documento HTML in Word potrebbe non essere più possibile.

Nota:

Per ottimizzare i file HTML o XHTML che non sono stati creati con Microsoft Word, utilizzate il comando Strumenti > Ottimizza HTML.

  1. Salvate il documento Microsoft Word come file HTML.
    Nota:

    in Windows, chiudete il file in Word per evitare una violazione di condivisione.

  2. Aprite il file HTML in Dreamweaver.

    Per visualizzare il codice HTML generato da Word, passate alla vista Codice (Visualizza > Codice).

  3. Selezionate Strumenti > Ottimizza HTML di Word.

    Nota:

    se Dreamweaver non è in grado di determinare quale versione di Word è stata utilizzata per salvare il file, selezionate la versione corretta nell'apposito menu a comparsa.

  4. Selezionate (o deselezionate) le opzioni di ottimizzazione. Le preferenze specificate vengono salvate come impostazioni di ottimizzazione predefinite.

    Dreamweaver applica al documento HTML le impostazioni di ottimizzazione e viene visualizzato un registro con le modifiche, a meno non abbiate deselezionato l'opzione corrispondente nella finestra di dialogo.

    Opzioni di ottimizzazione del codice HTML di Microsoft Word
    Opzioni di ottimizzazione del codice HTML di Microsoft Word

    Elimina tag specifici di Word

    Consente di eliminare tutti i tag specifici di Microsoft Word, compreso il codice XML dei tag HTML, i tag meta e link personalizzati dell'intestazione del documento, i tag XML di Word, i tag condizionali e il loro contenuto, nonché i paragrafi vuoti e i margini dagli stili. Ognuno dei tipi di tag citati può essere selezionato individualmente utilizzando la scheda Avanzate.

    Ottimizza CSS

    Elimina tutti gli stili CSS specifici di Word, compresi gli stili CSS in linea se possibile (quando lo stile principale è contraddistinto dalle stesse proprietà), gli attributi di stile che iniziano per “mso”, le dichiarazioni di stile non CSS, gli attributi di stile CSS contenuti nelle tabelle e tutte le definizioni di stile non utilizzate nell'intestazione. Questa opzione può essere ulteriormente personalizzata utilizzando la scheda Avanzate.

    Ottimizza tag <font>

    Rimuove i tag HTML, convertendo il testo predefinito della sezione body alla dimensione HTML 2.

    Correggi tag nidificati in modo errato

    Rimuove i tag dei caratteri inseriti da Word all'esterno dei tag di paragrafo e di intestazione (a livello di blocco).

    Applica formattazione di origine

    Applica al documento le opzioni di formattazione dell'origine specificate nelle preferenze Formato codice e nel file SourceFormat.txt.

    Mostra registro al termine

    Visualizza una finestra di avvertimento che segnala le modifiche apportate al documento al termine del processo di ottimizzazione.

  5. Fate clic su OK oppure selezionate la scheda Avanzate per personalizzare ulteriormente le opzioni Elimina tag specifici di Word e Ottimizza CSS, quindi fate clic su OK.

Altri contenuti simili

 Adobe

Ottieni supporto in modo più facile e veloce

Nuovo utente?

Collegamenti rapidi

Visualizza tutti i tuoi piani Gestione dei piani
Visualizza collegamenti rapidi
Nascondi collegamenti rapidi

Note legali    |    Informativa sulla privacy online