Nel documento di Dreamweaver, portate il cursore nel punto in cui desiderate visualizzare l'immagine ed effettuate una delle seguenti operazioni:
Ultimo aggiornamento il
25 apr 2024
Usate Fireworks e Dreamweaver per creare un flusso di lavoro ottimizzato per modificare, ottimizzare e collocare file di grafica per il web nelle pagine HTML.
Nota
La funzione non è supportata nelle versioni di Adobe Dreamweaver.
Inserire un'immagine di Fireworks
Dreamweaver e Fireworks riconoscono e condividono molte procedure di modifica dei file, comprese le modifiche ai collegamenti, alle mappe immagine, alle porzioni di tabella e altro. Le due applicazioni offrono insieme un flusso di lavoro ottimizzato per modificare, ottimizzare e collocare file di grafica per il web nelle pagine HTML.
Potete inserire un'immagine esportata da Fireworks direttamente in un documento di Dreamweaver mediante il comando Inserisci immagine oppure creare una nuova immagine Fireworks da un segnaposto immagine di Dreamweaver.
Selezionate Inserisci > Immagine.
Nella categoria Comune del pannello Inserisci, fate clic sul pulsante Immagine o trascinatelo sul documento.
Scorrere fino al file di Fireworks esportato desiderato e fate clic su OK (Windows) o su Apri (Macintosh).
Nota
Se il file di Fireworks non si trova nel sito corrente di Dreamweaver, viene visualizzato un messaggio che richiede all'utente se desidera copiare il file nella cartella principale. Fate clic su Sì.
Modificare un'immagine o una tabella di Fireworks da Dreamweaver
Quando aprite e modificate un'immagine o una porzione di immagine che fa parte di una tabella di Fireworks, Dreamweaver avvia Fireworks, che a sua volta apre il file PNG da cui era stata esportata l'immagine o la tabella.
Nota
Quanto segue presuppone che Fireworks sia impostato come editor di immagini esterne principale per i file PNG. Spesso Fireworks viene anche configurato come editor predefinito per i file JPEG e GIF, anche se può essere utile impostare Photoshop come editor predefinito per questi tipi di file.
Quando l'immagine fa parte di una tabella Fireworks, puoi aprire l'intera tabella Fireworks per le modifiche, purché il <!--fw table--> Commento esista nel codice HTML.Se il file PNG di origine è stato esportato da Fireworks in un sito Dreamweaver mediante l'impostazione di HTML e immagini stile di Dreamweaver, il commento della tabella di Fireworks viene inserito automaticamente nel codice HTML.
In Dreamweaver, aprite la finestra di ispezione Proprietà (Finestra > Proprietà), se non è già aperta.
Fate clic sull'immagine o sulla porzione d'immagine per selezionarla.
Quando selezionate un'immagine esportata da Fireworks, la finestra di ispezione Proprietà identifica la selezione come un'immagine o una tabella di Fireworks e visualizza il nome del file di origine PNG.
Per avviare Fireworks per apportare le modifiche, effettuate una delle seguenti operazioni:
Nella finestra di ispezione Proprietà, fate clic su Modifica.
Tenendo premuto il tasto Ctrl (Windows) o Comando (Macintosh), fate doppio clic sull'immagine selezionata.
Fate clic con il pulsante destro del mouse (Windows) o fate clic tenendo premuto il tasto Ctrl (Macintosh) sull'immagine selezionata e selezionate Modifica con Fireworks dal menu di scelta rapida.
Nota
se Fireworks non è in grado di trovare il file di origine, viene richiesto di specificare il percorso del file PNG di origine. Se lavorate con il file di origine di Fireworks, le modifiche vengono salvate sia nel file di origine sia in quello esportato; in caso contrario, viene aggiornato soltanto il file esportato.
In Fireworks, modificate il file PNG di origine e fate clic su Fine.
Fireworks salva le modifiche nel file PNG ed esporta l'immagine aggiornata (o l'HTML e le immagini), quindi restituisce lo stato attivo Dreamweaver. In Dreamweaver, viene visualizzata l'immagine o la tabella aggiornata.
Per un'esercitazione sull'integrazione di Dreamweaver e Fireworks, consultate www.adobe.com/go/vid0188_it.
Ottimizzare un'immagine di Fireworks da Dreamweaver
Potete utilizzare Dreamweaver per effettuare modifiche rapide alle immagini e alle animazioni di Fireworks. Da Dreamweaver, potete modificare le impostazioni di ottimizzazione, le impostazioni di animazione e le dimensioni e l'area dell'immagine esportata.
In Dreamweaver, selezionare l’immagine desiderata ed effettuare una delle seguenti operazioni:
Selezionate Comando > Ottimizza immagine.
Fate clic sul pulsante Modifica impostazioni immagine nella finestra di ispezione Proprietà dell'immagine.
Effettuate le modifiche nella finestra di dialogo Anteprima immagine:
Per modificare le impostazioni di ottimizzazione, fate clic sulla scheda Opzioni.
Per modificare le dimensioni e l'area dell'immagine esportata, fate clic sulla scheda File.
Al termine, fate clic su OK.
Usare Fireworks per modificare i segnaposto immagine di Dreamweaver
Potete creare un segnaposto immagine in un documento di Dreamweaver e quindi avviare Fireworks per creare un'immagine o una tabella di Fireworks per sostituirla.
Per creare una nuova immagine da un segnaposto immagine, sul sistema devono essere installati sia Dreamweaver che Fireworks.
Accertatevi di avere già impostato Fireworks come editor di immagini per i file PNG.
Nella finestra del documento, fate clic sul segnaposto immagine per selezionarlo.
Avviate Fireworks nella modalità Modifica da Dreamweaver effettuando una delle seguenti operazioni:
Nella finestra di ispezione Proprietà, fate clic su Crea.
Tenendo premuto il tasto Ctrl (Windows) o Comando (Macintosh), fate doppio clic sul segnaposto immagine.
Fate clic con il pulsante destro del mouse (Windows) o fate clic tenendo premuto il tasto Ctrl (Macintosh) sul segnaposto immagine, quindi selezionate Crea immagine in Fireworks.
Utilizzate le opzioni di Fireworks per progettare l'immagine.
Fireworks riconosce le seguenti impostazioni dei segnaposto immagine che è possibile configurare quando lavorate con il segnaposto immagine in Dreamweaver: dimensione dell'immagine (correlata alle dimensioni dell'area di lavoro di Fireworks), ID immagine (utilizzato da Fireworks come nome predefinito del documento per il file di origine e per il file di esportazione creato), allineamento del testo. Fireworks riconosce anche i collegamenti e determinati comportamenti (ad esempio immagine di scambio, menu a comparsa e imposta testo) che potete associare al segnaposto immagine mentre lavorate in Dreamweaver.
Nota
Anche se non possono essere visualizzati in Fireworks, i collegamenti aggiunti a un segnaposto immagine vengono mantenuti. Se disegnate un punto attivo e aggiungete un collegamento in Fireworks, il programma non elimina il collegamento aggiunto al segnaposto immagine in Dreamweaver. Tuttavia, se ritagliate una porzione nella nuova immagine in Fireworks, il programma elimina il collegamento nel documento di Dreamweaver al momento della sostituzione del segnaposto immagine.
Fireworks non riconosce le seguenti impostazioni dei segnaposto immagine: allineamento immagine, colore, spazio verticale e spazio orizzontale e mappe. Queste impostazioni sono disattivate nella finestra di ispezione Proprietà del segnaposto immagine.
Al termine dell'operazione, fate clic su Fine per visualizzare la richiesta di salvataggio.
Nella casella di testo Salva in, selezionate la cartella definita come cartella locale del sito Dreamweaver.
Se al momento dell'inserimento nel documento di Dreamweaver avete assegnato un nome al segnaposto immagine, Fireworks inserisce tale nome nella casella Nome file. Il nome può essere modificato.
Fate clic su Salva per salvare il file PNG.
Viene visualizzata la finestra di dialogo Esporta. Utilizzate questa finestra di dialogo per esportare l'immagine in un file GIF o JPEG, oppure, nel caso di porzioni di immagine, come HTML e immagini.
In Salva in, selezionate la cartella locale del sito Dreamweaver.
La casella Nome visualizza automaticamente il nome utilizzato per il file PNG. Il nome può essere modificato.
Nel campo Tipo file, selezionate il tipo di file da esportare, ad esempio Solo immagini o HTML e immagini.
Fate clic su Salva per salvare il file esportato.
Il file viene salvato, quindi ritorna attivo Dreamweaver. Nel documento di Dreamweaver, il file o la tabella di Fireworks esportati sostituiscono automaticamente il segnaposto immagine.
I menu a comparsa di Fireworks
Fireworks consente di creare rapidamente e facilmente menu a comparsa basati su CSS.
Oltre a essere estensibili e veloci da scaricare, i menu a comparsa creati con Fireworks forniscono i vantaggi seguenti:
Le voci di menu possono essere indicizzate tramite motori di ricerca.
Le voci di menu possono essere lette da screen reader, rendendo le pagine più accessibili.
Il codice generato da Fireworks è conforme agli standard e può essere convalidato.
Potete modificare i menu a comparsa di Fireworks con Dreamweaver o con Fireworks, ma non con entrambi. Le modifiche apportate in Dreamweaver non vengono mantenute in Fireworks.
Modificare menu a comparsa di Fireworks in Dreamweaver
Potete creare un menu a comparsa in Fireworks 8 o versioni successive e quindi modificarlo in Dreamweaver o in Fireworks (utilizzando la funzione di modifica Roundtrip), ma non in entrambi. Se modificate i menu prima in Dreamweaver e quindi in Fireworks, verranno perdute tutte le modifiche precedenti tranne il contenuto testuale.
Se preferite modificare i menu con Dreamweaver, potete utilizzare Fireworks per creare il menu a comparsa e quindi utilizzare Dreamweaver solo per modificare e personalizzare il menu.
Se preferite modificare i menu in Fireworks, potete utilizzare la funzione di modifica Roundtrip in Dreamweaver, ma è sconsigliabile modificare i menu direttamente in Dreamweaver.
In Dreamweaver, selezionate la tabella Fireworks che include il menu a comparsa, quindi fate clic su Modifica nella finestra di ispezione Proprietà.
Il file PNG di origine viene aperto in Fireworks.
In Fireworks, modificate il menu tramite l'Editor menu a comparsa, quindi fate clic su Fine nella barra degli strumenti di Fireworks.
Fireworks invia nuovamente il menu a comparsa modificato a Dreamweaver.
Se avete creato un menu a comparsa in Fireworks MX 2004 o una versione precedente, potete modificarlo in Dreamweaver mediante la finestra di dialogo Mostra menu popup, disponibile nel pannello Comportamenti.
Modificare un menu a comparsa creato in Fireworks MX 2004 o versioni precedenti
In Dreamweaver, selezionate il punto attivo o l'immagine che attiva il menu a comparsa.
Nel pannello Comportamenti (Maiusc+F3), fate doppio clic su Mostra menu a comparsa nell'elenco Azioni.
Apportare le modifiche desiderate nella finestra di dialogo Menu popup e fate clic su OK.
Impostare le preferenze di avvio e modifica per i file di origine di Fireworks
Quando utilizzate Fireworks per la modifica delle immagini, le immagini inserite nelle pagine Web vengono normalmente esportate da Fireworks da un file di origine PNG. Quando aprite un file di immagine in Dreamweaver per modificarlo, Fireworks apre automaticamente il file di origine PNG. Se il file non viene individuato automaticamente, viene richiesto di specificarne il percorso. Se preferite, potete impostare le preferenze in Fireworks in modo tale che Dreamweaver apra l'immagine inserita, oppure potete fare in modo che Fireworks offra l'opzione di utilizzare il file di immagine inserito o il file di origine Fireworks ogni volta che viene aperta un'immagine in Dreamweaver.
Nota
Dreamweaver è in grado di riconoscere le preferenze di avvio e modifica di Fireworks soltanto in determinati casi. Più specificamente, è necessario avviare e ottimizzare un'immagine che non faccia parte di una tabella di Fireworks e che contenga un percorso di Design Notes corretto relativo a un file di origine PNG.
In Fireworks, selezionate Modifica > Preferenze (Windows) o Fireworks > Preferenze (Macintosh), quindi fate clic sulla scheda Lancia e modifica (Windows) oppure selezionate Lancia e modifica dal menu a comparsa (Macintosh).
Specificate le opzioni delle preferenze da utilizzare per la modifica o l'ottimizzazione di immagini Fireworks collocate in un'applicazione esterna:
Usa sempre PNG sorgente
Apre automaticamente il file PNG di Fireworks definito nella Design Note come origine per l'immagine collocata. Gli aggiornamenti vengono applicati sia al PNG di origine sia all'immagine collocata corrispondente.
Non usare mai PNG sorgente
Apre automaticamente l'immagine collocata di Fireworks, indipendentemente dal fatto che esista un file PNG di origine o meno. Gli aggiornamenti vengono applicati esclusivamente all'immagine inserita.
Richiedi al lancio
Visualizza un messaggio che chiede se deve essere aperto il file PNG di origine e consente inoltre di specificare le preferenze generali di avvio e modifica.
Inserire codice HTML di Fireworks in un documento di Dreamweaver
Il comando Esporta di Fireworks consente di esportare e salvare immagini e file HTML ottimizzati in una cartella del sito Dreamweaver. Il file può quindi essere inserito in Dreamweaver. Dreamweaver consente di inserire in un documento codice HTML generato da Fireworks, completo di immagini associate, porzioni e JavaScript.
Nel documento Dreamweaver, spostate il punto di inserimento nella posizione in cui desiderate inserire il codice HTML di Fireworks.
Effettuate una delle operazioni seguenti:
Selezionate Inserisci > Oggetti immagine > HTML di Fireworks.
Nella categoria Comune del pannello Inserisci, fate clic sul pulsante Immagini e selezionate Inserisci HTML di Fireworks dal menu a comparsa.
Fate clic su Sfoglia per selezionare un file HTML di Fireworks.
Se non prevedete di utilizzare il file per un altro scopo, selezionate Cancella il file dopo l'inserimento. Questa opzione non influisce sul file PNG di origine associato al file HTML.
Nota
Se il file HTML si trova su un'unità di rete, esso viene eliminato in modo permanente, anziché spostato nel Cestino.
Fate clic su OK per inserire nel documento di Dreamweaver il codice HTML assieme alle immagini, alle porzioni e al codice JavaScript associati.
Incollare codice HTML di Fireworks in Dreamweaver
Un modo rapido per posizionare immagini e tabelle generate da Fireworks in Dreamweaver consiste nel copiare e incollare il codice HTML di Fireworks direttamente in un documento di Dreamweaver.
Copiare e incollare codice HTML di Fireworks in Dreamweaver
In Fireworks, selezionate Modifica > Copia codice HTML.
Seguite le istruzioni della procedura guidata relative alle impostazioni per esportare HTML e immagini. Quando viene richiesto, specificate la cartella del sito di Dreamweaver come cartella di destinazione per le immagini esportate.
La procedura guidata consente di esportare le immagini nella destinazione specificata e copiare negli Appunti il codice HTML.
Nel documento Dreamweaver, posizionate il cursore nel punto in cui desiderate incollare il codice HTML, quindi selezionate Modifica > Incolla HTML di Fireworks.
Tutto il codice HTML e JavaScript associato ai file di Fireworks esportati viene copiato nel documento di Dreamweaver e tutti i collegamenti alle immagini vengono aggiornati.
Esportare e incollare codice HTML di Fireworks in Dreamweaver
In Fireworks, selezionate File > Esporta.
Specificate la cartella del sito di Dreamweaver come cartella di destinazione per le immagini esportate.
Nel menu a comparsa Esporta, selezionate HTML e immagini.
Nel menu a comparsa HTML, selezionate Copia negli Appunti, quindi fate clic su Esporta.
Nel documento Dreamweaver, posizionate il cursore nel punto in cui desiderate incollare il codice HTML esportato, quindi selezionate Modifica > Incolla HTML di Fireworks.
Tutto il codice HTML e JavaScript associato ai file di Fireworks esportati viene copiato nel documento di Dreamweaver e tutti i collegamenti alle immagini vengono aggiornati.
Aggiornare il codice HTML di Fireworks inserito in Dreamweaver
In Fireworks, il comando File > Aggiorna HTML rappresenta un'alternativa alla tecnica di avvio e modifica per l'aggiornamento dei file di Fireworks inseriti in Dreamweaver. Il comando Aggiorna HTML consente di modificare in Fireworks un'immagine di origine PNG e quindi di aggiornare automaticamente il codice HTML esportato e i file di immagine inseriti in un documento di Dreamweaver. Questo comando consente di aggiornare i file di Dreamweaver anche quando non è in esecuzione.
In Fireworks, aprite il file PNG di origine ed effettuate le modifiche desiderate.
Selezionate File > Salva.
In Fireworks, selezionate File > Aggiorna HTML.
Individuare il file di Dreamweaver contenente il codice HTML da aggiornare, quindi fare clic su Apri.
Spostatevi nella cartella di destinazione in cui desiderate inserire i file di immagine aggiornati e fate clic su Seleziona (Windows) o su Scegli (Macintosh).
Fireworks aggiorna il codice HTML e JavaScript nel documento di Dreamweaver. Fireworks consente anche di esportare le immagini aggiornate associate al codice HTML e di inserire le immagini nella cartella di destinazione specificata.
Se Fireworks non è in grado di trovare un codice HTML corrispondente da aggiornare, viene offerta la possibilità di inserire un nuovo codice HTML nel documento di Dreamweaver. La sezione JavaScript del nuovo codice viene inserita all'inizio del documento, mentre la tabella HTML o il collegamento all'immagine vengono inseriti alla fine.
Creare un album fotografico Web
La funzione Crea album fotografico Web è stata dichiarata obsoleta a partire da Dreamweaver CS5.
Crea splendidi siti web con Dreamweaver
Progetta, codifica e gestisci siti web dinamici con un potente strumento completo.
