ADOBE Dreamweaver CS3 User Manual [it]

ADOBE® DREAMWEAVER® CS3

GUIDA UTENTE

Adobe® Dreamweaver® CS3 Guida utente per Windows® e Macintosh

Se la presente guida è distribuita con software che comprende un accordo di licenza per l’utente finale, questa guida e il programma in essa descritto sono forniti in licenza e possono essere usati o copiati solo secondo i termini della licenza stessa. Ad eccezione degli usi consentiti dalla licenza, nessuna parte della presente pubblicazione può essere riprodotta, memorizzata in un sistema di archiviazione o trasmessa in qualsiasi forma o con qualsiasi mezzo elettronico, meccanico, di registrazione o altro, senza previa autorizzazionescritta diAdobe Systems Incorporated. Ilcontenutodi questapubblicazione èprotetto dalla leggesul copyrightanche sela pubblicazionenon èdistribuita assieme a un programma con un contratto di licenza per l’utente finale.

Le informazioni contenutein questa guidasono forniteesclusivamente ascopo informativo, sono soggettea variazionisenza preavviso e non devonoessereintesecomeimpegno da parte di Adobe Systems Incorporated. Adobe Systems Incorporated declina ogni responsabilità per eventuali errori o imprecisioni presenti neicontenuti informatividi questa guida.

Se inserite inun vostro progetto lagrafica e leimmagini che viforniamo, tenete presenteche tali immagini potrebbero essereprotettedalla legge sul copyright. L’inserimento non autorizzato di tale materiale in una pubblicazione può rappresentare una violazione dei diritti d’autore. Assicuratevi di ottenere dall’autore ogni autorizzazione necessaria.

Qualsiasi riferimento a nomi di società nei campioni di file forniti ha scopo puramente dimostrativo ed eventuali riferimenti a società e organizzazioni realmente esistenti è da ritenersi casuale.

Adobe, il logo Adobe, ActionScript, ColdFusion, Creative Suite, Director, Dreamweaver, Fireworks, Flash, FlashPaper, HomeSite, JRun, Photoshop, Shockwave e Version Cue sono marchi o marchi registrati di Adobe Systems Incorporated negli Stati Uniti e/o in altri Paesi.

ActiveX, Microsoft eWindows sono marchi o marchi registrati di Microsoft Corporation negli Stati Uniti e/o in altri Paesi. Apple eMac OS sono marchi diAppleInc.,registrati negli Stati Uniti e in altri Paesi. Java e Solaris sono marchi o marchi registrati di Sun Microsystems, Inc. negli Stati Uniti e in altri Paesi. Linux è un marchio registrato di Linus Torvalds negli Stati Uniti e in altri Paesi. UNIX è un marchio negli Stati Uniti e in altri Paesi, concesso in licenza esclusivamente tramite X/Open Company, Ltd. Tutti gli altri marchi appartengono ai rispettivi proprietari.

Questo prodotto include software sviluppato dalla Apache Software Foundation (

http://www.apache.org/). Il formato Graphics Interchange Format © è proprietà tutelata da copyright diCompuServe Incorporated.GIF(sm) è unmarchio diservizio di proprietàdi CompuServe Incorporated. Tecnologia di compressione audioMPEG Layer-3 concessa in licenza da Fraunhofer IISe ThomsonMultimedia (

http://www.mp3licensing.com). Non è consentito l'uso dell'audiocompresso MP3 con il Software pereseguire trasmissioni in tempo reale o dal vivo. Se l'utente necessita diun decodificatore MP3per trasmissioni intempo reale odal vivo,spetta all'utente stesso ottenerela licenza per questa tecnologia MP3. Tecnologia per la compressione e la decompressione vocale concessa in licenza da Nellymoser, Inc. ( video On2TrueMotion. ©1992-2005 On2Technologies, Inc.Tutti idiritti riservati.

http://www.opensymphony.com/). Tecnologia per la compressione e la decompressione video Sorenson SparkTM concessa in licenza da Sorenson Media, Inc.

(

http://www.on2.com. Questo prodottoinclude software sviluppatoda OpenSymphony Group

www.nellymoser.com). Il video di Flash CS3 è basato sulla tecnologia

Adobe Systems Incorporated, 345 Park Avenue, San Jose, California 95110, USA.

Avviso agli utenti finali di enti governativi degli Stati Uniti d’America. Il software e la documentazione sono “commercial items” (prodotti commerciali), ai sensi del 48 C.F.R.

§2.101, costituiti da "commercial computer software" (software commerciale per computer) e "commercial computer software documentation" (documentazione per software commerciale per computer), aisensi del 48 C.F.R. §12,212 o al 48 C.F.R. §227.7202, nella misura applicabile. Inconformità con l'articolo 48 C.F.R. §12.212 o con gli articolida 48 C.F.R. §§227.7202-1 a 227.7202-4 incluso, secondo i casi, i "Commercial Computer Software" e "Commercial Computer Software Documentation" vengono concessi in licenza agli utenti appartenenti al Governo degli Stati Uniti d'America (a) esclusivamente come "Commercial Items" e (b)con i soli diritti concessi a tutti glialtriutentifinaliaitermini e alle condizioni quicontenuti. Tutti i diritti nonpubblicati riservati, ai sensidella legge sul dirittod'autore vigente negli Stati Uniti d'America. Adobe Systems Incorporated, 345 Park Avenue, San Jose, CA95110-2704, USA. Nei confronti degli utenti finali delGoverno degli StatiUniti, Adobe accetta dirispettare tutte leleggi applicabilisul dirittoalle pari opportunità, comprese,ove applicabili,le direttivedell'Executive Order 11246,secondo revisione, lasezione 402del "Vietnam EraVeterans Readjustment Assistance Act" del1974 (38 USC 4212) ela sezione 503 del"Rehabilitation Act"del 1973, secondo revisione, oltreai regolamentiesposti in 41 CFRda 60-1 a 60-60,60-250 e 60-741. La clausola di azione affermativa e i regolamenti sopra elencati saranno incorporati tramite riferimento.

Sommario

Capitolo 1: Guida introduttiva

Installazione . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 1

Guida di Adobe . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 1

Risorse . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 4

Novità . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .10

Capitolo 2: Area di lavoro

Flusso e area di lavoro di Dreamweaver . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .12

Operazioni con la ﬁnestra Documento . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .23

Uso di barre degli strumenti, ﬁnestre di ispezione, menu di scelta rapida e pannelli . . . . . . . . . 26

Personalizzazione dell'area di lavoro di Dreamweaver CS3 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .32

Capitolo 3: Operazioni con i siti di Dreamweaver

Conﬁgurazione di un sito Dreamweaver . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .37

Operazioni con una mappa visiva del sito . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .48

Gestione dei siti Contribute mediante Dreamweaver . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 52

Operazioni con i ﬁle senza un sito deﬁnito . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .58

Opzioni della scheda Generali . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .59

iii

Capitolo 4: Creazione e gestione dei ﬁle

Creazione e apertura dei documenti . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .64

Gestione di ﬁle e cartelle . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 72

Scaricamento e caricamento dei ﬁle da e verso il server . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 81

Deposito e ritiro dei ﬁle . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .85

Sincronizzazione dei ﬁle . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 88

Comparazione di ﬁle per veriﬁcare le differenze . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 90

Ripristino dei ﬁle (utenti Contribute) . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 92

Applicazione della maschera a cartelle e ﬁle del sito . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 93

Archiviazione delle informazioni sui ﬁle nelle Design Notes . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .95

Veriﬁca del sito . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .98

Capitolo 5: Gestione delle risorse e delle librerie

Informazioni sulle risorse e le librerie . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .102

Operazioni con le risorse . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .103

Creazione e gestione di un elenco di risorse preferite . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .107

Operazioni con le voci di libreria . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .109

Capitolo 6: Creazione di pagine con i CSS

Nozioni sui fogli di stile CSS . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .113

Creazione e gestione dei CSS . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .117

Creazione del layout delle pagine con i CSS . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .136

Operazioni con i tag div . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .152

Animazione di elementi PA . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .156

Capitolo 7: Creazione di layout di pagina in HTML

Uso di riferimenti visivi per il layout . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .163

Presentazione del contenuto mediante le tabelle . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .166

Organizzazione delle pagine in modalità Layout . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .180

Frame . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .190

Capitolo 8: Aggiunta del contenuto alle pagine

Operazioni con le pagine . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .202

Aggiunta e formattazione di testo . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .214

Aggiunta e modiﬁca di immagini . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .229

Inserimento di contenuto Flash . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .241

Aggiunta di contenuto Flash Video . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .250

Aggiunta di audio . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .254

Aggiunta di altri oggetti multimediali . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .255

Capitolo 9: Collegamenti e navigazione

Informazioni sui collegamenti e sulla navigazione . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .263

Collegamenti . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .265

Menu di collegamento . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .273

Barre di navigazione . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .275

Mappe immagine . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .276

Risoluzione dei problemi relativi ai collegamenti . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .278

Capitolo 10: Anteprima delle pagine

Anteprima delle pagine nei browser . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .281

Anteprima delle pagine nei dispositivi mobili . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .282

Capitolo 11: Operazioni con il codice delle pagine

Informazioni sulla scrittura di codice in Dreamweaver . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .284

Impostazione dell’ambiente di codiﬁca . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .290

Personalizzazione dell'ambiente di codiﬁca . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .292

Scrittura e modiﬁca del codice . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .297

Compressione del codice . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .306

Ottimizzazione e debug del codice . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .308

Modiﬁca del codice nella vista Progettazione . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .312

Operazioni con il contenuto head delle pagine . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .318

Operazioni con le server-side include . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .322

Gestione delle librerie di tag . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .324

Importazione di tag personalizzati in Dreamweaver . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .326

Capitolo 12: Aggiunta di comportamenti JavaScript

Uso dei comportamenti JavaScript . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .328

Applicazione di comportamenti incorporati in Dreamweaver . . . . . . . . . . . . . . . . . . . . . . . . . . . . .331

Capitolo 13: Operazioni con altre applicazioni

Integrazione tra applicazioni diverse . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .346

Operazioni con Fireworks . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .347

Operazioni con Photoshop . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .353

Operazioni con Flash . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .361

Operazioni con Bridge . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .362

Operazioni con Device Central . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .364

Capitolo 14: Creazione e gestione dei modelli

Informazioni sui modelli di Dreamweaver . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .366

Come riconoscere i modelli e i documenti basati sui modelli . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .371

Creazione di un modello di Dreamweaver . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .373

Creazione di aree modiﬁcabili . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .376

Creazione di aree ripetute . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .377

Uso delle aree opzionali . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .379

Deﬁnizione di attributi di tag modiﬁcabili . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .381

Creazione di un modello nidiﬁcato . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .382

Modiﬁca, aggiornamento ed eliminazione dei modelli . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .385

Esportazione e importazione del contenuto di un modello . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .388

Applicazione o rimozione di un modello da un documento esistente . . . . . . . . . . . . . . . . . . . . . .389

Modiﬁca del contenuto di un documento basato su un modello . . . . . . . . . . . . . . . . . . . . . . . . . .390

Sintassi del modello . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .393

Impostazione delle preferenze di authoring per i modelli . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .394

Capitolo 15: Visualizzazione di dati XML

Informazioni su XML e XSLT . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .396

Esecuzione di trasformazioni XSL sul server . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .403

Esecuzione di trasformazioni XSL sul client . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .418

Entità carattere mancanti . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .420

Capitolo 16: Creazione visiva di pagine Spry

Informazioni sul framework Spry . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .422

Aggiunta di widget Spry . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .422

Operazioni con il widget Pannello a sofﬁetto . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .424

Operazioni con il widget Barra di menu . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .426

Operazioni con il widget Pannello comprimibile . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .431

Operazioni con il widget Pannelli a schede . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .433

Operazioni con il widget Campo di testo convalida . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .436

Operazioni con il widget Area di testo convalida . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .440

Operazioni con il widget Selezione convalida . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .444

Operazioni con il widget Casella di controllo convalida . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .447

Visualizzazione dei dati con Spry . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .449

Aggiunta di effetti Spry . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .457

Capitolo 17: Preparazione della creazione di siti dinamici

Nozioni sulle applicazioni Web . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .461

Installazione di un server Web locale . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .468

Impostazione di un’applicazione Web . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .470

Connessioni di database per sviluppatori ColdFusion . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .476

Connessioni di database per sviluppatori ASP . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .478

Connessioni di database per sviluppatori PHP . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .484

Connessioni di database per sviluppatori ASP.NET . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .486

Connessioni di database per sviluppatori JSP . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .488

Risoluzione dei problemi relativi alle connessioni di database . . . . . . . . . . . . . . . . . . . . . . . . . . . . .492

Eliminazione di script di connessione . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .497

Capitolo 18: Origini dati per le applicazioni Web

Uso di un database per archiviare contenuto . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .498

Raccolta dei dati inviati dagli utenti . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .499

Accesso a dati archiviati in variabili di sessione . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .501

Capitolo 19: Pagine dinamiche

Ottimizzazione dell'area di lavoro per lo sviluppo visivo . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .505

Elaborazione di pagine dinamiche . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .508

Panoramica sulle origini di contenuto dinamico . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .509

Pannelli di contenuto dinamico . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .512

Deﬁnizione delle origini di contenuto dinamico . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .514

Aggiunta di contenuto dinamico alle pagine . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .529

Modiﬁca del contenuto dinamico . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .532

Visualizzazione dei record di database . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .534

Visualizzazione di Live Data . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .543

Uso dei servizi Web . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .547

Aggiunta di comportamenti server personalizzati . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .552

Creazione di moduli . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .563

Capitolo 20: Sviluppo visivo delle applicazioni

Creazione di pagine principali e di dettaglio (tutti i server) . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .576

Creazione di pagine di ricerca e di risultati (ColdFusion, ASP, JSP, PHP) . . . . . . . . . . . . . . . . . . . . .585

Creazione di una pagina per la ricerca in un database (ASP.NET) . . . . . . . . . . . . . . . . . . . . . . . . . . .590

Creazione di una pagina di inserimento record (tutti i server) . . . . . . . . . . . . . . . . . . . . . . . . . . . . .594

Creazione di pagine di aggiornamento record (tutti i server) . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .598

Creazione di pagine di eliminazione record (tutti i server) . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .603

Creazione di pagine con oggetti di manipolazione dati avanzati (ColdFusion, ASP,

ASP.NET, JSP) . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .610

Creazione di una pagina di registrazione (ColdFusion, ASP, JSP, PHP) . . . . . . . . . . . . . . . . . . . . . .617

Creazione di una pagina di login (ColdFusion, ASP, JSP, PHP) . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .619

Creazione di una pagina accessibile solo agli utenti autorizzati (ColdFusion, ASP, JSP, PHP) .621

Protezione di una cartella dell'applicazione (ColdFusion) . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .623

Uso dei componenti ColdFusion (ColdFusion) . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .624

Uso dei JavaBean (JSP) . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .630

Capitolo 21: Creazione di moduli ASP.NET e ColdFusion

Creazione di moduli ColdFusion MX 7 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .632

Creazione di moduli ASP.NET . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .644

Creazione dei controlli Web ASP.NET DataGrid e DataList . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .648

Capitolo 22: Automatizzare le operazioni

Automatizzare le operazioni . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .655

Capitolo 23: Accessibilità

Dreamweaver e l'accessibilità . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .661

Funzioni di accessibilità di Dreamweaver . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .662

Progettazione di pagine accessibili . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .663

Capitolo 24: Scelte rapide ed estensioni

Scelte rapide da tastiera . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .665

Estensioni . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .667

Indice . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .668

Capitolo 1: Guida introduttiva

Se non è ancora stato installato il nuovo software, cominciare leggendo le informazioni relative all'installazione e ad altre operazioni preliminari. Prima di iniziare a utilizzare il programma, può essere utile esaminare la Guida di Adobe e le altre numerose risorse a disposizione degli utenti. È possibile consultare video didattici, plugin, modelli, comunità di utenti, seminari, esercitazione, feed RSS e molto altro.

Installazione

Requisiti

❖ Per consultare i requisiti di sistema completi consigliati per il software Adobe®, consultate il file Leggimi sul disco di

installazione.

Installare il software

1 Chiudete tutte le applicazioni Adobe aperte sul computer.

2 Inserite il disco di installazione nell’unità appropriata e seguite le istruzioni visualizzate sullo schermo.

Nota: per ulteriori informazioni, consultate il file Leggimi sul disco di installazione.

Attivazione del software

Se disponete di unalicenza per utente singolo per il software Adobe, vi verrà richiesto di attivare il software. L’attivazione è un processo semplice e anonimo che dovete completare entro 30 giorni dall’installazione del software.

Per ulteriori informazioni sull’attivazione del prodotto, consultate il file Leggimi sul disco di installazione o visitate il sito Web Adobe all’indirizzo www.adobe.com/go/activation_it.

1 Se la finestra di dialogo Attivazione non è aperta, scegliete Aiuto > Attiva.

2 Seguite le istruzioni riportate sullo schermo.

Nota: per installare il software su un altro computer, occorre prima disattivarlo dal proprio computer. Scegliete Aiuto > Disattiva.

Registrazione

La registrazionedel prodotto consente diricevere gratuitamenteassistenza perl’installazione, notifiche sugli aggiornamenti e altri servizi.

❖ Per effettuare la registrazione, seguire le istruzioni riportate sullo schermo nella finestra di dialogo Registrazione,

visualizzata dopo avere installato e attivato il software.

Se decidete di rimandare la registrazione, potete effettuarla in qualsiasi momento scegliendo Aiuto > Registrazione.

Guida di Adobe

Risorse della Guida di Adobe

La documentazione per il software Adobe è disponibile in vari formati.

DREAMWEAVER CS3

Guida utente

Guida di prodotto e LiveDocs

La Guida di prodotto consente di accedere a tutta la documentazione e ai contenuti informativi disponibili al momento della pubblicazione del software. Vi si può accedere dal menu Aiuto del software Adobe.

La Guida LiveDocs contiene tutte le informazioni della Guida di prodotto, più aggiornamenti e collegamenti ad altri contenuti informativi disponibili sul Web. Per alcuni prodotti potete anche aggiungere i commenti agli argomenti nella Guida LiveDocs. La Guida LiveDocs per il proprio prodotto si trova nella sezione Adobe Help Resource Center del sito all’indirizzo www.adobe.com/go/documentation_it.

In gran parte delle versioni della Guida di prodotto e LiveDocs potete effettuare ricerche nelle Guide di più prodotti. Gli argomenti dispongono di collegamenti ai relativi contenuti sul Web o ad argomenti nella Guida di un altro prodotto.

La Guida, sia quella di prodotto che quella su Web, è il punto di partenza per accedere ad altri contenuti e alle varie comunità di utenti. Sul Web è sempre disponibile la versione più completa e aggiornata della Guida.

Documentazione Adobe in formato PDF

La Guida di prodotto è disponibile inoltre in formato PDF, ottimizzato per la stampa. È possibile fornire in formato PDF anche altri documenti, ad esempio le guide all’installazione e i white paper.

La documentazione completa in formato PDFè disponibile nellasezione Adobe Help Resource Centerdel sito all’indirizzo

www.adobe.com/go/documentation_it. Per consultare la documentazione in PDF inclusa con il software, cercate nella

cartella Documenti (Documents) del DVD di installazione o del contenuto.

Documentazione stampata

Le versioni cartacee della Guida di prodotto possono essere acquistate nella sezione Adobe Store del sito all’indirizzo

www.adobe.com/go/store_it. In questa sezione sono disponibili inoltre vari testi pubblicati da editori partner di Adobe.

In tutti iprodotti AdobeCreative Suite® 3è inclusa unaguida stampataai flussi di lavoro e i singoli prodotti Adobe possono disporre di una guida introduttiva stampata.

Utilizzo dell’Aiuto integrato nel prodotto

Potete accedere alla Guida di prodotto dal menu Aiuto. Dopo aver avviato il programma di visualizzazione della Guida Adobe, fate clic su Sfoglia per consultare la Guida di altri prodotti Adobe installati sul computer.

Queste funzioni della Guida facilitano l’apprendimento di più prodotti:

•

Gli argomenti possono contenerecollegamenti ad argomenti della Guidadi altriprodotti Adobe o ad altri contenutisul Web.

DREAMWEAVER CS3

Guida utente

• Alcuni argomenti sono condivisi tra due o più prodotti. Se ad esempio consultate un argomento della Guida con l’icona

di Adobe Photoshop® e di Adobe After Effects®, significa che l’argomento descrive una funzionalità simile nei due prodotti o descrive un flusso di lavoro che coinvolge i due prodotti.

• Potete effettuare ricerche nelle Guide di più prodotti.

Se cercate una frase, ad esempio “strumento forma”, dovete inserirla tra virgolette per visualizzare solo gli argomenti che comprendono tutte le parole nella frase.

Guida di Adobe A. Pulsanti Indietro/Avanti (collegamenti visitati in precedenza) B. Argomenti secondari espandibili C. Icone che indicano gli argomenti condivisi D. Pulsanti Precedente/Successivo (argomenti in ordine consecutivo)

Funzioni di accessibilità

I contenuti della Guida di Adobe sono accessibili da parte di utenti disabili, ad esempio utenti non vedenti, ipovedenti o con mobilità ridotta. La Guida di prodotto supporta le seguenti funzioni di accessibilità standard:

• L’utente può modificare la dimensione del testo con i comandi del menu contestuale standard.

• I collegamenti sono sottolineati per agevolarne il riconoscimento.

• Se il testo del collegamento non corrisponde al titolo della destinazione, viene fatto riferimento al titolo nell’attributo

TitolodeltagAncora.Adesempio,icollegamentiPrecedenteeSuccessivoincludonoititolidegliargomentiprecedente e successivo.

• Il contenuto supporta la modalità ad alto contrasto.

• Le immagini prive di didascalie includono un testo alternativo.

• Ciascun riquadro ha un titolo che ne indica la funzione.

• Le tag HTML standard definiscono la struttura del contenuto per la lettura su schermo o per gli strumenti di lettura del

testo.

• I fogli di stile che controllano la formattazione, in modo che non vi siano font incorporati.

Scelte rapide da tastiera per i controlli della barra degli strumenti della Guida (Windows)

Pulsante Indietro Alt+Freccia sinistra

Pulsante Avanti Alt+Freccia destra

Stampa Ctrl+P

DREAMWEAVER CS3

Guida utente

Pulsante Informazioni Ctrl+I

Menu Sfoglia Alt+Freccia giù o Alt+Freccia su per vedere la Guida di un’altra applicazione

Casella di ricerca Ctrl+S per posizionare il punto di inserimento nella casella di ricerca

Scelte rapide da tastiera per la navigazione della Guida (Windows)

• Per spostarsi da un riquadro all’altro, premere Ctrl+Tab (avanti) e Maiusc+Ctrl+Tab (indietro).

• Per spostarsi da un collegamento all’altro in un riquadro e per sottolineare i collegamenti, premere Tab (avanti) e

Maiusc+Tab (indietro).

• Per attivare un collegamento sottolineato, premete Invio.

• Per ingrandire il testo, premete Ctrl+= (uguale).

• Per ridurre il testo, premete Ctrl+trattino.

Scelta dei documenti della Guida desiderati

L'elenco seguente riporta la documentazione disponibile nel menu della Guida. Utilizzare questo elenco per individuare la Guida che risponderà alla domanda.

• Guida di Dreamweaver (definita Uso di Dreamweaver), destinata a tutti gli utenti, fornisce informazioni dettagliate su

tutte le Adobe® Dreamweaver® CS3 funzionalità.

• Estensione di Dreamweaver, che descrive la struttura generale di Dreamweaver e l'API (Application Programming

Interface), è destinata agli utenti avanzati che vogliono costruire estensioni o personalizzare l'Dreamweaverinterfaccia.

• Guida di riferimento alle API di Dreamweaver documenta l'API dell'utilità e l'API JavaScript, utilizzate dagli utenti

avanzati per costruire le estensioni e personalizzare l'interfaccia.

• Guida di Framework Spry documenta la creazione di dataset Ajax, widget ed effetti con il framework Spry e comprende

esempi di codice e avvii rapidi. Questi documenti non sono specifici di Dreamweaver. Per argomenti Spry specifici di Dreamweaver, vedere Uso di Dreamweaver.

• Guida di ColdFusion è una selezione di libri su Macromedia® ColdFusion® nella documentazione Adobe (la serie

completa è disponibile in LiveDocs). Questi documenti della Guida sono destinati a sviluppatori principianti e avanzati interessati a ColdFusion.

• Riferimenti consente di accedere a HTML, modello server e altri manuali di riferimento. Sono destinati a chiunque sia

interessato a informazioni aggiuntive sulla sintassi e sui concetti della programmazione e così via.

Risorse

Adobe Video Workshop

Il Video Workshop per Adobe Creative Suite 3 offre oltre 200 filmati didattici che coprono una vasta gamma di argomenti per i professionisti di stampa, Web e video.

DREAMWEAVER CS3

È possibile utilizzare Adobe Video Workshop per conoscere a fondo qualsiasi prodotto Creative Suite 3. Molti filmati mostrano come utilizzare le applicazioni Adobe in combinazione fra loro.

Guida utente

Quando si avvia Adobe Video Workshop, scegliere i prodottisui quali ottenere informazioni e gli argomentida visualizzare. È possibile analizzare i dettagli di ogni filmato per perfezionare il percorso didattico.

Comunità di presentatori

InquestareleaseAdobeSystemshainvitatolacomunitàdiutentiacondividereleproprieesperienzeedopinioni.Adobee Lynda.com offrono esercitazioni, suggerimenti e consigli utili di importantissimi progettisti e sviluppatori come Joseph Lowery,KatrinEismanneChrisGeorgenes.ÈpossibileguardareeascoltareespertidiAdobecomeLynnGrillo,GregRewis e Russell Brown. In tutto sono presenti oltre 30 esperti per condividere le proprie conoscenze.

DREAMWEAVER CS3

Guida utente

Esercitazioni e file di origine

AdobeVideoWorkshopcomprendeesercitazioniperutentisiaalleprimearmicheesperti.Sonodisponibilianchefilmati su nuovefunzioni e tecniche moltoimportanti. Ciascunfilmato èdedicato adun singoloargomento e dura circa 3-5 minuti. Granpartedeifilmaticontieneun’esercitazioneillustrataeifilediorigineperconsentiredistampareisingolipassaggied eseguire l’esercitazione in modo indipendente.

Uso di Adobe Video Workshop

Adobe Video Workshop si trova sul DVD allegato al prodotto Creative Suite 3. È disponibile anche online all’indirizzo

www.adobe.com/go/learn_videotutorials_it. Adobe aggiunge regolarmente nuovi filmati alla versione on-line di Video

Workshop; è pertanto consigliabile controllare sempre la presenza di eventuali novità.

Filmati di Dreamweaver CS3

Adobe Video Workshop tratta una vasta gamma di argomenti di Adobe Dreamweaver® CS3, tra cui:

• Utilizzare e personalizzare layout basati su CSS

• Utilizzo dei widget di Spry

• Creazione di stili per i moduli con CSS

• Risoluzione di problemi di pubblicazione

• Crearne i rollover

I filmati mostrano, inoltre, come utilizzare Dreamweaver CS3 in combinazione con il software Adobe:

• progettazione di siti Web con Dreamweaver e Photoshop;

• Utilizzo di modelli di Dreamweaver con Contribute®

• Importare, copiare e incollare gli elementi tra le varie applicazioni Web

Per accedere alle esercitazioni video di Adobe Creative Suite 3, visitate l’Adobe Video Workshop all’indirizzo

www.adobe.com/go/learn_videotutorials_it.

Extra

ÈpossibileaccedereadunavastagammadirisorsecheaiutanoadottenereilmassimodalsoftwareAdobe.Alcunediqueste risorse vengono installate sul vostro computer durante il processo di installazione e altri campioni e documenti utili sono inclusi nel disco di installazione o dei contenuti. Contenuti aggiuntivi specifici sono inoltre offerti online dalla comunità Adobe Exchange all’indirizzo www.adobe.com/go/exchange_it.

Risorse installate

Durante l’installazione del software, nella cartella dell’applicazione vengono inserite alcune risorse. Per visualizzare questi file, accedete alla cartella corrispondente sul computer.

• Windows®: [disco di avvio]\Programmi\Adobe\[applicazione Adobe]

• Mac OS®: [disco di avvio]/Applicazioni/[applicazione Adobe]

La cartella dell’applicazione contiene le seguenti risorse:

Plug-in I moduli plug-in sono piccoli programmi software che ampliano o aggiungono altre funzioni al software. Dopo

l’installazione, i plug-in si presentano come opzioni nei menu Importa ed Esporta, come formati di file nelle finestre di dialogo Apri, Salva connome e Esporta originale o come filtri nel menu Filtro.Ad esempio, nella cartella Plug-inall’interno della cartella di Photoshop CS3 vengono installati automaticamente una serie di plug-in per effetti speciali.

Predefiniti I predefiniti comprendono un’ampia gamma di strumenti, preferenze, effetti e immagini. I predefiniti del

prodotto comprendono pennelli, campioni, gruppi di colori, simboli, forme personalizzate, stili grafici e di livelli, pattern, texture, azioni, aree di lavoro e molto altro ancora. I contenuti predefiniti si trovano nell’interfaccia utente. Alcuni predefiniti, come le librerie dei pennelli di Photoshop, diventano disponibili solo quando selezionate lo strumento corrispondente. Se non desideratecreare un effetto o un’immagine completamente nuova,accedete alle librerie predefinite per trarre ispirazione.

DREAMWEAVER CS3

Pelletir

Inc

l illu

ore

giat

lla

fac

ilis

at vero

acc

l il

lore

giat nu

lis

at vero

accu

r In

nt c

ate

;

ent

in i

i fa

ritate

Inve

ation

trave

nt le

ctore

us. C

rit

proce

ent

ritate

;

ent

in iis

ritate

Inve

tig

trave

nt lectore

us.

rit

t e

proce

nul

che

t ad lorpe

m a

iam

t ad atin u

t et

ero dio

l che

agaim

et ad

llam

$25

r p

iam

t ad

eri

ero dio

eum nu

l la

VERO

cicver

o dio

vero d

l c

e su

eum

l la

ero d

eum

e sum

a ga

ad e

u l

lam

e um n

sucicver

o d

e r

o d

l che

$15

ullam

o d

nulch

aimet

ulla

Guida utente

Modelli I filedei modelli sipossono apriree visualizzare inAdobe BridgeCS3, apriredalla schermata dibenvenutoo aprire

direttamente dal menu File. A seconda del prodotto, i file di modello possono comprendere esempi di carta intestata, newsletter e siti Web, menu per DVD e pulsanti video. Ogni file dei modelli è stato creato da esperti e rappresenta un esempio di come utilizzare al meglio le funzioni del prodotto. I modelli sono una risorsa utilissima quando dovete iniziare un progetto “ex novo”.

Travel Earth

Best 100 places to see on the planet in your lifetime

Vel: Ad : Vulputate:

volute ipsummy , commy re eugiarud tem

eraes-

exer n ullutet

Esempi I file degli esempi comprendono creazioni più articolate e sono ideali per vedere in azione le nuove funzionalità.

Tali file dimostrano le innumerevoli possibilità disponibili.

Font Il prodotto Creative Suite comprende vari font e famiglie di font OpenType®. I font vengono copiati sul computer

durante l’installazione.

• Windows: [disco di avvio]\Windows\Fonts

• Mac OS X: [disco di avvio]/Libreria/Fonts

Per ulteriori informazioni sull’installazione dei font, consultate il file Leggimi sul DVD di installazione.

Contenuto del DVD

Il DVD di installazione o dei contenuti accluso al prodotto contiene altre risorse da utilizzare nel software. La cartella Goodies contiene file specifici del prodotto come modelli, immagini, predefiniti, azioni, plug-in ed effetti, oltre a sottocartelle per font e librerie fotografiche. La cartella Documentation contiene una versione in formato PDF dellaGuida, informazioni tecniche e altri documenti come fogli degli esempi, guide di riferimento e informazioni specifiche sulle funzioni.

Adobe Exchange

Per accedere ad altricontenuti gratuiti, visitate il sito all’indirizzowww.adobe.com/go/exchange_it, unacomunità online in cui gli utenti possono scaricare e condividere gratuitamente migliaia di azioni, estensioni, plug-in e altri contenuti da utilizzare nei prodotti Adobe.

Bridge Home

Bridge Home, una nuova sezione di Adobe Bridge CS3, funge da punto centrale dal quale accedere a informazioni aggiornate su tutto il software Adobe Creative Suite 3. Avviate Adobe Bridge e fate clic sull’icona Bridge Home nella parte superiore del pannello Preferiti per accedere ai suggerimenti, alle notizie e alle risorse più recenti per gli strumenti di Creative Suite.

Nota: è possibile che Bridge Home non sia disponibile in tutte le lingue.

DREAMWEAVER CS3

Guida utente

Adobe Design Center

Adobe DesignCenter offre articoli,idee e istruzionidi esperti del settore, progettisti di fama internazionale, nonché editori partner di Adobe. Ogni mese vengono aggiunti nuovi contenuti.

Sono disponibili centinaia di esercitazioni per creare nuovi prodotti, apprendere suggerimenti e tecniche utili con l’ausilio di filmati, esercitazioni HTML e capitoli esemplificativi di testi specializzati.

Think Tank, Dialog Box e Gallery sono una fonte inesauribile di idee.

• Gli articoli di Think Tank trattano argomenti di attualità per i progettisti e le loro esperienze per quel che riguarda

tecnologie, ideazione, strumenti di progettazione e società.

• In Dialog Box gli esperti condividono nuove idee sull’animazione grafica e sulla grafica digitale.

• La sezione Gallery è una sorta di esposizione permanente dedicata agli artisti del digital design.

DREAMWEAVER CS3

Guida utente

Il sito di Adobe Design Center è disponibile all’indirizzo www.adobe.com/designcenter.

Centro per sviluppatori Adobe

Adobe Developer Center propone esempi, esercitazioni, articoli e risorse della comunità online per gli sviluppatori di applicazioni Internet avanzate, siti Web, contenuti per dispositivi mobili e altri progetti che utilizzano i prodotti Adobe. Developer Center contiene, inoltre, risorse per gli sviluppatori di plug-in per i prodotti Adobe.

Oltre al codice di esempio e alle esercitazioni, sono disponibili feed RSS, seminari online, SDK, guide per gli script e altre risorse tecniche.

Visitate l’Adobe Developer Center all’indirizzo www.adobe.com/go/developer_it.

Servizio clienti

Visitate il sito Web di Adobe Support all’indirizzo www.adobe.com/it/support per trovare informazioni sulla risoluzione dei problemi relativi al proprio prodotto e per saperne di più sulle varie possibilità di assistenza tecnica gratuita e a pagamento. Selezionate il collegamento Formazione per accedere alle pubblicazioni di Adobe Press, a varie risorse di formazione online, a programmi di certificazione software Adobe e ad altro ancora.

Download

Visitate il sito all’indirizzo www.adobe.com/go/downloads_it per scaricare gratuitamente aggiornamenti, versioni di prova e altri programmi molto utili. Inoltre, Adobe Store (all’indirizzo www.adobe.com/go/store_it) propone migliaia di plug-in di altri sviluppatori, utili per automatizzare le varie operazioni, personalizzare i flussi di lavoro, creare effetti di livello professionale e altro ancora.

Adobe Labs

Adobe Labs offre l’opportunità di provare e valutare le più recenti tecnologie e i nuovi prodotti di Adobe.

In Adobe Labs è possibile accedere a numerose risorse, tra cui:

• Versioni di release non definitiva di software e tecnologie

• Esempi di codice e processi ideali per velocizzare la fase di apprendimento

• Prime versioni della documentazione tecnica e di prodotto

DREAMWEAVER CS3

Guida utente

• Forum, contenuti basati su wiki e altre risorse collaborative per agevolare l’interazione con sviluppatori con esperienze

e opinioni simili

Adobe Labs promuove un processo collaborativo per lo sviluppo di software. In tale ambiente, i clienti diventano rapidamente produttivi nell’utilizzo dei nuovi prodotti e delle nuove tecnologie. Adobe Labs contiene inoltre un forum per i feedbackimmediati, utilizzati dai teamdi sviluppoAdobe percreare deisoftware chesoddisfino le esigenze ele aspettative della comunità.

Il sito di Adobe Labs si trova all’indirizzo www.adobe.com/go/labs_it.

Comunità di utenti

Le comunità di utenti possono usufruire dei forum, dei blog e di altri canali per condividere tecnologie, strumenti e informazioni.Gli utentipossono porre delle domandee scoprire in che modo gli altriutenti riesconoad ottenere ilmassimo dai propri software. I forum User to User sono disponibili in inglese, francese, tedesco e giapponese; i blog sono pubblicati in numerose lingue.

Per partecipare ai forum o ai blog, visitare il sito all’indirizzo www.adobe.com/it/communities.

Novità

Principali nuove funzioni di Adobe Dreamweaver CS3

Framework Spry per Ajax

Con Adobe® Dreamweaver® CS3 è possibile utilizzare il framework Spry per Ajax per progettare, sviluppare e distribuire visivamente le interfacce dinamiche utente. Il framework Spry per Ajax è una libreria JavaScript per Web designer che consente ai designer di realizzare pagine che garantiscono agli utenti un'esperienza più interessante. Diversamente da altri framework per Ajax, Spry è accessibile sia ai designer sia agli sviluppatori, dal momento che è costituito al 99% da codice HTML. Vedere “Creazione visiva di pagine Spry” a pagina 422.

Widget Spry

I widget Spry sono componenti dell'interfaccia utente predefiniti, che possono essere personalizzati con CSS e quindi aggiunti alle pagine Web. Con Dreamweaver è possibile aggiungere più widget Spry alle pagine, compresi elenchi e tabelle XML, pannelli a soffietto, interfacce a schede ed elementi modulo con funzioni di convalida. Vedere “Aggiunta di widget Spry” a pagina 422.

Effetti Spry

Gli effettiSpry costituiscono unmodo semplice edelegante per migliorare l'aspettogenerale di unsito Web. Possono essere applicati a quasi tutti gli elementi di una pagina HTML. Si possono aggiungere effetti Spry per ingrandire, restringere, dissolvere ed evidenziare elementi; per alterare visivamente gli elementi di una pagina per un periodo di tempo e altro ancora. Vedere “Aggiunta di effetti Spry” a pagina 457.

Integrazione avanzata con Photoshop CS3

Dreamweaver comprende un'integrazione avanzata con Photoshop CS3. Adesso i designer possono semplicemente selezionare parte di un disegno realizzato con Photoshop, anche attraverso più livelli, e incollarla direttamente in una pagina Dreamweaver. Dreamweaver visualizza una finestra di dialogo in cui è possibile specificare opzioni per l'ottimizzazione dell'immagine. Nel caso in cui fosse necessario modificarla, facendo doppio clic su di essa si apre il file originale PSD a livelli in Photoshop. Vedere “Operazioni con Photoshop” a pagina 353.

DREAMWEAVER CS3

Guida utente

Verifica compatibilità browser

La nuova funzione Verifica compatibilità browser in Dreamweaver genera rapporti che identificano problemi di riproduzione connessi a CSS in diversi browser. In vista codice, i problemi sono contrassegnati dalla sottolineatura verde, in modo daessere immediatamenteidentificabili. Unavolta identificato il problema, sipuò procedere rapidamente allasua soluzione oppure, se fossero necessarie ulteriori informazioni, è possibile visitare Adobe CSS Advisor. Vedere “Verifica dei problemi di rendering CSS nei browser” a pagina 133.

Adobe CSS Advisor

Il sito Web di Adobe CSS Advisor contiene informazioni aggiornate sui problemi relativi a CSS, ed è accessibile direttamente dall'interfaccia utente Dreamweaver durante il processo di Verifica compatibilità browser. Meglio di un forum, di una pagina wiki o di un gruppo di discussione, il CSS Advisor consente di commentare facilmente il contenuto esistente con suggerimenti e miglioramenti, o di aggiungere nuovi argomenti a beneficio di tutta la comunità. Vedere “Verifica dei problemi di rendering CSS nei browser” a pagina 133.

Layout CSS

Dreamweaver offre una serie di layout CSS predefiniti che permettono di preparare rapidamente le pagine e di acquisire informazioni sull'uso di CSS per il layout delle pagine, grazie a dettagliati commenti in linea sul codice. Gran parte dei siti Web possono esseresuddivisi in layout a una, dueo tre colonne, con elementi aggiuntivi (come intestazionie piè di pagina). Dreamweaverora offreun elenco esaustivo di design di layout dibase che possono essere personalizzati secondo le esigenze del caso. Vedere “Creazione di una pagina con un layout CSS” a pagina 140.

Gestisci CSS

La funzione Gestisci CSS facilita lo spostamento delle regole CSS da un documento all'altro, dall'intestazione di un documento a un foglio esterno, tra file CSS esterni e così via. È anche possibile convertire CSS in linea in regole CSS, e collocarle dove occorre con un semplice trascinamento. Vedere “Spostamento di regole CSS” a pagina 130 e“Conversione di CSS in linea in una regola CSS” a pagina 131.

Adobe Device Central

Integrato con Dreamweaver e con la famiglia Creative Suite 3, Adobe Device Central semplifica la creazione di contenuto mobile, consentendo di accedere rapidamente alle specifiche tecniche essenziali di ogni dispositivo e riducendo testo e immagini della pagina HTML per riprodurre con precisione ciò che verrebbe visualizzato sul dispositivo. Vedere “Anteprima delle pagine nei dispositivi mobili” a pagina 282.

Adobe Bridge CS3

Utilizzare Dreamweaver con Adobe Bridge CS3 per una gestione semplificata e omogenea di immagini e risorse. Adobe Bridge fornisce un accesso centralizzato a file, applicazioni e impostazioni dei progetti, oltre a funzionalità di contrassegnazione e ricerca dei metadatiXMP. Grazie alle sue caratteristiche di organizzazione e condivisione deifile, oltre all'accesso ad Adobe StockPhotos, Adobe Bridge favorisce l'efficienza del flusso di lavoro creativo epermette di controllare al meglio i progetti di stampa, su Web, su video e per dispositivi mobili. Vedere “Operazioni con Bridge” a pagina 362.

Capitolo 2: Area di lavoro

L'area di lavoro di Adobe® Dreamweaver® CS3 contiene le barre degli strumenti, le finestre di ispezione e i pannelli utilizzabili per la realizzazione delle pagine Web. È possibile personalizzare l'aspetto e il comportamento generale dell'area di lavoro.

Flusso e area di lavoro di Dreamweaver

Panoramica sul flusso di lavoro di Dreamweaver

Durante la creazione di un sito Web, è possibile utilizzare approcci differenti; questo è uno di essi:

Pianificazione e configurazione del sito

Determinare dove dovranno essere memorizzati i file ed esaminare i requisiti e gli scopi del sito e i profili dell'utenza. Inoltre, considerare anche gli aspetti tecnici quali le modalità di accesso degli utenti e le limitazioni legate ai browser, ai plugin o alle operazioni di scaricamento. Una volta organizzate le informazioni e determinata una struttura operativa, è possibile cominciare a creare il sito. (Vedere “Operazioni con i siti di Dreamweaver” a pagina 37.)

Organizzazione e gestione dei file di un sito

Il pannello Fileconsente di aggiungere, eliminare e rinominare facilmentei file e le cartelleper modificare l’organizzazione del sito nel modo desiderato. Il pannello File contiene anche molti strumenti utili per la gestione del sito, il trasferimento di file a/da un server remoto, l'impostazione di procedure di deposito e ritiro per impedire la sovrascrittura dei file e la sincronizzazione dei file presenti sui siti locali e remoti. Il pannello Risorse consente di organizzare facilmente le risorse di un sito e di trascinarle direttamente in un documento di Dreamweaver. Dreamweaver può essere utilizzato per gestire l'aspetto deisiti Adobe®Contribute®.(Vedere “Gestione difile e cartelle” a pagina 72 e “Gestione delle risorse e dellelibrerie” a pagina 102.)

Definizione del layout delle pagine Web

Scegliere la tecnica di definizione del layout chemeglio si adatta alle proprie necessitàoppure utilizzarele opzioni di layout di Dreamweaver insieme alle altre per creare l'aspetto del sito. Per creare un layout possono essere impiegati elementi PA, stili di posizionamento CSS o layout CSS predefiniti di Dreamweaver. Gli strumenti di tabella permettono di progettare rapidamentele pagine,disegnandole e successivamente riorganizzandonela struttura.Per visualizzarepiù elementi insieme in unbrowser,è possibile definire illayout dei documenti utilizzandoi frame. Infine, è possibilecreare nuove pagine inbase a unmodello di Dreamweaver,quindi aggiornare illayout di queste pagineautomaticamente alvariare delmodello. (Vedere “Creazione di pagine con i CSS” a pagina 113 e “Creazione di layout di pagina in HTML” a pagina 163.)

Aggiunta del contenuto alle pagine

Aggiungere risorse ed elementi di progettazione quali testo, immagini, immagini di rollover, mappe immagine, colori, filmati, audio, collegamenti HTML,menu di collegamento e altro ancora. Le funzioni incorporate dicreazione della pagina possono essere impiegate per elementi quali titoli e sfondi, oppure si può digitare direttamente all'interno di una pagina o importare contenuto da altri documenti. Dreamweaver fornisce anche comportamenti per l'esecuzione di operazioni in base a specifici eventi, ad esempio la convalida di un modulo quando un visitatore fa clic sul pulsante Invia, oppure l'apertura di una seconda finestra del browser al termine del caricamento della pagina principale. Infine, Dreamweaver dispone di strumenti per il miglioramento della prestazioni del sito Web e per la verifica delle pagine che permettono di garantirne la compatibilità con browser Web differenti. (Vedere “Aggiunta del contenuto alle pagine” a pagina 202.)

Creazione delle pagine mediante codifica manuale

La codifica manuale delle pagine Web è un altro approccio alla creazione delle pagine. Dreamweaver fornisce strumenti di editing visivo facili da usare, ma dispone anche di un sofisticato ambiente di codifica; l'utente può quindi scegliere quale approccio usare per creare e modificare le proprie pagine. (Vedere “Operazioni con il codice delle pagine” a pagina 284.)

DREAMWEAVER CS3

Guida utente

Configurazione di un'applicazione Web per il contenuto dinamico

Molti siti Web contengono pagine dinamiche che permettono ai visitatori di visualizzare le informazioni memorizzate nei database, e in genere permettono ad alcuni utenti di aggiungere nuove informazioni e di modificare le informazioni dei database. Per creare queste pagine, è necessario per prima cosa configurare un server Web e un server applicazioni, creare o modificare un sito di Dreamweaver e connettersi a un database. (Vedere “Preparazione della creazione di siti dinamici” a pagina 461.)

Creazione di pagine dinamiche

In Dreamweaver, è possibile definire diverse origini di contenuto dinamico, inclusi i recordset estratti da database, i parametri di modulo e i componenti JavaBeans. Per aggiungere il contenuto dinamico alla pagina, basta trascinarlo sulla pagina.

È possibile impostare la pagina per visualizzare un record o più record alla volta, visualizzare più pagine di record, aggiungere collegamenti speciali per passare da una pagina di record alla successiva e alla precedente e creare contatori di record per aiutare gli utenti a individuare i record. È possibile incapsulare applicazioni o logica aziendale mediante tecnologie quali Macromedia® ColdFusion® di Adobe® e servizi Web. Se occorre disporre di una maggiore flessibilità, è possibile creare comportamenti server e moduli interattivi personalizzati. (Vedere “Pagine dinamiche” a pagina 505.)

Test e pubblicazione

Il testdelle pagineè un processo dinamico che si svolge durante ilciclo di sviluppo. Allafine del ciclo, il sito viene pubblicato su un server. Molti sviluppatori pianificano inoltre la manutenzione periodica per garantire che il sito rimanga aggiornato e funzionante. (Vedere “Scaricamento e caricamento dei file da e verso il server” a pagina 81.)

Area di lavoro panoramica sul layout

L'area dilavoro diDreamweaver consente di esaminare leproprietà deidocumenti e deglioggetti. Includeanche la maggior parte delle operazioni comuni nelle barre degli strumenti in modo da poter modificare velocemente i documenti.

In Windows®, Dreamweaver fornisce un layout che integra tutti gli elementi in una sola finestra. Nell’area di lavoro integrata, tutte le finestre e i pannelli sono integrati in una sola finestra di applicazione più grande.

A B C D

E F G

A. Barra Inserisci B. Barra degli strumenti Documento C. Finestra del documento D. Gruppi di pannelli E. selettore di tag F. finestra di ispezione Proprietà G. pannello File

DREAMWEAVER CS3

Guida utente

In ambiente Mac OS®, Dreamweaver è in grado di visualizzazione più documenti in un'unica finestra con schede che identificano ogni documento. Dreamweaver può inoltre visualizzare un'area di lavoro flottante, nel quale ogni documento viene visualizzato in una finestra propria. I gruppi di pannelli sono inizialmente agganciati insieme, ma è possibile sganciarli nelle relative finestre. Le finestre si "agganciano" automaticamente una accanto all’altra, ai lati dello schermo, e alla finestra Documento quando vengono trascinate o ridimensionate.

A B C

A. Barra Inserisci B. Barra degli strumenti Documento C. Finestra del documento D. Gruppi di pannelli E. selettore di tag F. finestra di ispezione Proprietà G. pannello File

Per l'esercitazione sulla configurazione dell'area di lavoro Dreamweaver, vedere www.adobe.com/go/vid0143_it.

Consultare anche

“Uso di barre degli strumenti, finestre di ispezione, menu di scelta rapida e pannelli” a pagina 26

“Scelta del layout dell'area di lavoro (solo per Windows)” a pagina 32

“Scelta del layout dell'area di lavoro (solo per Macintosh)” a pagina 32

“Visualizzazione di documenti a schede (solo per Macintosh)” a pagina 32

Area di lavoro panoramica sugli elementi

L'area di lavoro comprende i seguenti elementi:

Nota: Dreamweaver fornisce molti altri pannelli, finestre di ispezione e finestre di opzioni. Per aprire i pannelli, le finestre di ispezioneelefinestre,utilizzareilmenuFinestra.Senonsiriesceatrovareunpannello,unafinestradiispezioneounafinestra che riporta il segno di spuntaindicante lo stato diapertura, selezionare Finestra >Disponi pannelli per disporre ordinatamente tutti i pannelli aperti.

Schermata di benvenuto Consentedi aprire un documentorecente o di crearne uno nuovo. Dalla schermata di benvenuto

è anche possibile conoscere meglio Dreamweaver, grazie alla panoramica completa del prodotto e alle esercitazioni.

Barra Inserisci Contiene i pulsanti che consentono di inserire vari tipi di oggetti, ad esempio immagini, tabelle ed elementi

PA in un documento. Ogni oggetto consiste in una porzione di codice HTML che consente di impostare i diversi attributi mano a mano che lo si inserisce. Ad esempio, è possibile inserire una tabella facendo clic sul pulsante Tabella della barra Inserisci. Se si preferisce, è possibile inserire gli oggetti utilizzando il menu Inserisci invece della barra Inserisci.

DREAMWEAVER CS3

Guida utente

Barra degli strumenti Documento Contiene i pulsanti che consentono di visualizzare la finestra Documento in diversi

modi (ad esempio in vista Progettazione e in vista Codice), impostare le opzioni di visualizzazione e accedere ad alcune operazioni comuni (ad esempio, l’anteprima in un browser).

Barra degli strumenti Standard (non visualizzata nel layout predefinito dell’area di lavoro) Contiene i pulsanti per le

operazioni comuni da eseguire dai menu File e Modifica: Nuovo, Apri, Salva, Salva tutto, Taglia, Copia, Incolla, Annulla e Ripeti. Per visualizzare la barra degli strumenti Standard, selezionare Vista > Barre degli strumenti > Standard.

Barra degli strumenti Codifica (visualizzata solo nella vista Codice) Include pulsanti che consentono di eseguire varie

operazioni di codifica standard.

Barra degli strumenti Stile di rendering (non visibile per impostazione predefinita) Include pulsanti che consentono di

visualizzare l'aspetto del lavoro in vari tipi di supporti se sono stati utilizzati fogli di stile dipendenti da essi. Include inoltre un pulsante che consente di attivare o disattivare gli stili CSS.

Finestra Documento Visualizza il documento corrente durante le operazioni di creazione e modifica.

Finestra di ispezione Proprietà Consente di visualizzare e modificare una serie di proprietà dell’oggetto o del testo

selezionato. Ogni tipo di oggetto ha proprietà diverse. Per impostazione predefinita, la finestra di ispezione Proprietà non è espansa nel layout dell’area di lavoro Coder.

selettore di tag Situato nella barra di stato nellaparte inferiore dellafinestra del documento.Visualizza la gerarchia dei tag

che contengono la selezione corrente. Fare clic su qualsiasi tag nella gerarchia per selezionare il tag specifico e il relativo contenuto.

Gruppi di pannelli Serie di pannelli correlati raggruppati insieme sotto una sola intestazione. Per espandere un gruppo di

pannelli, fare clic sulla freccia di espansionevisualizzata asinistra delnome delgruppo; per sganciare ungruppo di pannelli, trascinare l’area punteggiata sul margine sinistro della barra del titolo del gruppo.

Pannello File Consentedigestireifileelecartelle,indipendentementedalfattochefaccianopartediunsitoDreamweaver

oppure risiedano su un server remoto. Ilpannello File consente anche di accedere atutti i file chesi trovano suldisco locale in una struttura simile a Esplora risorse di Windows o al Finder di Macintosh.

Consultare anche

“Operazioni con la finestra Documento” a pagina 23

“Uso di barre degli strumenti, finestre di ispezione, menu di scelta rapida e pannelli” a pagina 26

“Informazioni sui gruppi di pannelli” a pagina 29

Panoramica sulla finestra del documento

La finestra Documento mostra il documento corrente. È possibile selezionare una delle viste seguenti:

Progettazione, vista Un ambiente per il layout di pagina visivo, la modifica visiva e lo sviluppo rapido di applicazioni. In

questa vista,Dreamweaver offre unarappresentazione visiva e modificabile deldocumento, simile aquella che siotterrebbe guardando la pagina in un browser. È possibile configurare la vista Progettazione per visualizzare il contenuto dinamico mentre si lavora sul documento.

Codice, vista Un ambiente di codifica manuale per la scrittura e la modifica di codice HTML, JavaScript, linguaggio server

(PHP) o linguaggio CFML (ColdFusion Markup Language) e qualsiasi altro tipo di codice.

Vista Codice e progettazione Consente di visualizzare sia la vista Codice sia la vista Progettazione per un documento nella

stessa finestra.

Quando la finestra Documento ha la barra del titolo, questa visualizza il titolo della pagina e, tra parentesi, il percorso e il nome file. Dopo il nome file, se sono state apportate delle modifiche non ancora salvate, Dreamweaver visualizza un asterisco.

Quando la finestra Documento è ingrandita nel layout dell’area di lavoro integrata (solo Windows) non ha la barra del titolo: in questo caso, il titolo della pagina appare, insieme al percorso e al nome file, nella barra del titolo della finestra principale dell’area di lavoro.

DREAMWEAVER CS3

Guida utente

Quando una finestra Documento è ingrandita, nella parte superiore vengono visualizzate delle linguette che mostrano i nomi file di tutti i documenti aperti. Per visualizzare un documento, fare clic sulla relativa scheda.

Consultare anche

“Operazioni con la finestra Documento” a pagina 23

“Informazioni sulla scrittura di codice in Dreamweaver” a pagina 284

“Visualizzazione di Live Data nella vista Progettazione” a pagina 543

Panoramica sulla barra degli strumenti del documento

La barra degli strumenti Documento contiene i pulsanti che permettono di cambiare rapidamente la vista del documento: vista Codice, vista Progettazione e una vista combinata che mostra le viste Codice e Progettazione in una sola finestra.

Questa barra degli strumenti contiene inoltrealcuni comandi e opzioni comunirelativi alla visualizzazionedel documento e al suo trasferimento tra i siti locale e remoto.

A B C D E F G H I J K

A. Mostra vista Codice B. Mostra viste Codice e Progettazione C. Mostra vista Progettazione D. Titolo del documento E. Gestione file F. Anteprima/debug nel browser G. Aggiorna vista Progettazione H. Opzioni di visualizzazione I. Riferimenti visivi J. Convalida codice K. Verifica compatibilità browser

Nella barra degli strumenti Documento vengono visualizzate le seguenti opzioni:

Mostra vista Codice mostra solo la vista Codice nella finestra Documento.

Mostra viste Codice e Progettazione suddivide la finestra Documento fra le viste Codice e Progettazione. Quando si

seleziona questa vista combinata, l’opzione Vista Progettazione in primo piano diventa disponibile nel menu Opzioni di visualizzazione.

Mostra vista Progettazione mostra solo la vista progettazione nella finestra Documento.

Nota: quando si lavora con XML, JavaScript, CSS o altri tipi di file basati cu codice, non è possibile visualizzare i file in vista Progettazione, e i pulsanti Progettazione e Dividi risultano inattivi.

Titolo del documento consente di inserire il titolo del documento, che verrà visualizzato nella barra del titolo del browser.

Se il documento ha già un titolo, esso compare in questo campo.

Gestione file visualizza il menu a comparsa Gestione file.

Anteprima/debug nel browser consente di visualizzare l'anteprima di un documento ed eseguirne il debug in un browser.

Selezionare un browser dal menu a comparsa.

Aggiorna vista Progettazione aggiorna la vista Progettazione del documento dopo che sono state apportate modifiche in

vista Codice. Le modifiche apportate in vista Codice non vengono visualizzate automaticamente in vista Progettazione finché non si eseguono alcune azioni, come salvare il file o fare clic su questo pulsante.

Nota: l'aggiornamento interviene anche sulle caratteristiche del codice che dipendono dal DOM (Document Object Model), come la capacità di selezionare i tag di apertura o chiusura di un blocco di codice.

Opzioni di visualizzazione consente di impostare le opzioni per la vista Codice e la vista Progettazione, tra cui la vista che

deve essere al di sopra dell’altra. Le opzioni del menu sono validi per la vista corrente: vista Progettazione, vista Codice o entrambe.

Riferimenti visivi consente di utilizzare vari riferimenti visivi per la progettazione delle pagine.

Convalida codice consente di convalidare il documento corrente oppure un tag selezionato.

Verifica compatibilità browser consente di verificare se la codifica CSS utilizzata è compatibile con più browser.

DREAMWEAVER CS3

Guida utente

Consultare anche

“Visualizzazione delle barre degli strumenti” a pagina 26

“Personalizzazione dell'ambiente di codifica” a pagina 292

“Visualizzazione e modifica del contenuto head” a pagina 318

“Uso di riferimenti visivi per il layout” a pagina 163

Panoramica sulla barra degli strumenti standard

La barra degli strumenti Standard contiene i pulsanti per le operazioni comuni da eseguire dai menu File e Modifica: Nuovo, Apri, Salva, Salva tutto,Taglia,Copia, Incolla, Annulla e Ripeti.Utilizzare questi menu come siutilizzano i comandi di menu equivalenti.

Consultare anche

“Visualizzazione delle barre degli strumenti” a pagina 26

“Creazione e apertura dei documenti” a pagina 64

Panoramica sulla barra di stato

La barra di stato presente sul fondo della finestra Documento fornisce informazioni supplementari sul documento in fase di creazione.

A B C D E F G

A. selettore di tag B. Strumento Seleziona C. Strumento Mano D. Strumento Zoom E. Imposta ingrandimento F. Menu a comparsa Dimensioni finestra G. Dimensioni e tempo di scaricamento stimato

selettore di tag Visualizza lagerarchia deitag checontengono la selezione corrente. Fare clic suqualsiasi tagnella gerarchia

per selezionare il tag specifico e il relativo contenuto. Fare clic su selezionare gli attributi

class o id di un tag nel selettore di tag, fare clic con il pulsante destro del mouse (Windows) o fare

<body> per selezionare tutto il corpo del documento. Per

clic tenendo premuto il tasto Control (Macintosh) sul tag e selezionare una classe o un ID dal menu di scelta rapida.

Strumento Seleziona Attiva e disattiva lo strumento Mano.

Strumento Mano Consente di fare clic sul documento e trascinarlo nella finestra Documento.

Strumento Zoom e menu a comparsa Imposta ingrandimento Consentono di impostare il livello di ingrandimento del

documento.

Menu a comparsa Dimensioni finestra (visibile solo nella vista Progettazione) Consente di ripristinare la finestra

Documento a dimensioni predeterminate o personalizzate.

Dimensioni e tempo di scaricamento del documento Mostra la stima della dimensione del documento e del tempo di

scaricamento della pagina, compresi tutti i file dipendenti (ad esempio, le immagini o altri file multimediali).

Consultare anche

“Impostazione delle dimensioni delle finestre e della velocità di connessione” a pagina 25

“Ingrandimento e riduzione” a pagina 211

“Ridimensionamento della finestra Documento” a pagina 24

“Impostazione delle preferenze relative alle dimensioni e al tempo di scaricamento” a pagina 212

DREAMWEAVER CS3

Guida utente

Panoramica sulla barra Inserisci

La barra Inserisci contiene una serie di pulsanti che consentono di creare e inserire oggetti come tabelle, elementi PA e immagini. Quandosi passa ilpuntatore delmouse sopra un pulsante, vienevisualizzata la descrizione comandi conil nome del pulsante.

I pulsanti sono organizzati in diverse categorie, che è possibile passare facendo clic sulle schede lungo la parte superiore della barra Inserisci. Quando il documento corrente contiene codice server, come i documenti ASP o CFML, vengono visualizzate ulteriori categorie. All'avvio di Dreamweaver, viene visualizzata l'ultima categoria su cui si stava lavorando.

Alcune categorie dispongono di pulsanti con menu a comparsa. Quando si seleziona un'opzione da un menu a comparsa, l'opzione diventa l'azione predefinita del pulsante. Ad esempio, se si seleziona Segnaposto immagine dal menu a comparsa del pulsante Immagine, la volta successiva che si fa clic sul pulsante Immagine, Dreamweaver inserisce un segnaposto immagine. Ogni volta che si seleziona una nuova opzione dal menu a comparsa, l'azione predefinita del pulsante cambia.

La barra Inserisci è organizzata nelle categorie seguenti:

La categoria Comune consente di creare e inserire gli oggetti usati più di frequente, come ad esempio immagini e tabelle.

La categoria Layout consente di inserire tabelle, tag div, frame e widget Spry. È anche possibile scegliere due viste per le

tabelle: Standard (predefinita) e Tabelle espanse.

La categoria Moduli contiene pulsanti che consentono dicreare moduli einserire i relativielementi, ad esempioi widget di

convalida di Spry.

La categoria Dati consente di inserire gli oggetti dati Spry e altri elementi dinamici, come recordset, aree ripetute, moduli

inserimento record e aggiornamento record.

La categoria Spry contiene i pulsanti per la creazione delle pagine Spry, con oggetti dati e widget Spry.

La categoria Testo consente di inserire molti tag di formattazione di testo ed elenco, come b, em, p, h1 e ul.

La categoria Preferiti consente di raggruppare e organizzare i pulsanti della barra Inserisci più utilizzatiin un unico punto.

Categorie del codice server disponibili solo per le pagine che utilizzano un particolare linguaggio server (ASP, ASP.NET,

CFML Basic, CFML Flow, CFML Advanced, JSP e PHP). Ognuna di queste categorie fornisce oggetti di codice server inseribili in vista Codice.

Consultare anche

“Uso della barra Inserisci” a pagina 26

“Creazione visiva di pagine Spry” a pagina 422

DREAMWEAVER CS3

Guida utente

Panoramica sulla barra degli strumenti Codifica

La barra degli strumenti Codifica contiene pulsanti per l'esecuzione di operazioni di codifica standard, come comprimere ed espandere le parti di codice selezionate, evidenziare il codice non valido, applicare e rimuovere commenti, applicare un rientro, inserire snippet di codice recenti e altro ancora. La barra degli strumenti Codifica è visibile solo in vista Codice ed è posizionata in verticale sul lato sinistro della finestra del documento.

È possibile nascondere la barra degli strumenti Codifica, ma non sganciarla o spostarla.

È anche possibile modificare la barra degli strumenti Codifica visualizzando più pulsanti (ad esempio A capo automatico, Mostra caratteri nascosti e Rientro automatico) oppure nascondendo quelli che non si intende utilizzare. Per eseguire queste operazioni, tuttavia, è necessario modificare il file XML da cui viene generata la barra degli strumenti. Per ulteriori informazioni, vedere Estensione di Dreamweaver.

Consultare anche

“Visualizzazione delle barre degli strumenti” a pagina 26

“Inserimento del codice mediante la barra degli strumenti Codifica” a pagina 299

Panoramica sulla barra degli strumenti Stile di rendering

La barra degli strumenti Stile di rendering (non visibile per impostazione predefinita) include pulsanti che consentono di visualizzare l'aspetto del lavoro in vari tipi di supporti se si utilizzano fogli di stile dipendenti da essi. Include inoltre un pulsante che consente di attivare o disattivare glistili CSS. Per visualizzare la barra degli strumenti, selezionare Visualizza > Barre degli strumenti > Stile di rendering.

Questa barra degli strumenti è attiva solo i documenti utilizzano fogli di stile dipendenti dai supporti. Ad esempio, nel foglio di stile potrebbe essere specificata una regola body per il supporto di stampa e un'altra per i palmari. Per ulteriori informazioni sulla creazione di fogli di stile dipendenti dai supporti, vedere il sito Web del World Wide Web Consortium all'indirizzo www.w3.org/TR/CSS21/media.html.

Per impostazione predefinita, Dreamweaver visualizza la pagina per il tipo di supporto "Schermo", ovvero la mostra così come verrebbe riprodotta sullo schermo di un computer. I pulsanti della barra degli strumenti Stile di rendering consentono di visualizzare i seguenti tipi di rendering:

Esegui rendering per schermo mostra la pagina come apparirebbe sullo schermo di un computer.

DREAMWEAVER CS3

Guida utente

Esegui rendering per stampa mostra la pagina come apparirebbe stampata.

Esegui rendering per portatile mostra la pagina come apparirebbe su un dispositivo portatile, ad esempio un telefono

cellulare o un BlackBerry.

Esegui rendering per proiezione mostra la pagina come apparirebbe su un dispositivo di proiezione.

Esegui rendering per TTY mostra la pagina come apparirebbe su una telescrivente.

Esegui rendering per TV mostra la pagina come apparirebbe sullo schermo di un televisore.

Attiva/disattiva visualizzazione stili CSS consente di attivare o disattivare gli stili CSS. Il pulsante funziona in modo

indipendente dagli altri pulsanti.

Per l'esercitazione sulla progettazione di fogli di stile per la stampa e per i palmari, vedere www.adobe.com/go/vid0156_it.

Consultare anche

“Visualizzazione delle barre degli strumenti” a pagina 26

Panoramica sulla finestra di ispezione Proprietà

La finestra di ispezione Proprietà consente di verificare e modificare le proprietà più comuni dell'elemento di pagina (oggetto o testo) attualmente selezionato. Il contenuto della finestra di ispezione Proprietà varia a seconda dell'elemento selezionato. Ad esempio, se si seleziona un'immagine nella pagina, la finestra di ispezione Proprietà si modifica per visualizzare le proprietà dell'immagine (ad esempio il percorso del file relativo, la larghezza e l'altezza dell'immagine, il bordo intorno all'immagine, se disponibile, e così via).

La finestra di ispezione Proprietà, per impostazione predefinita, si trova nella parte inferiore dell'area di lavoro, ma è possibile agganciarla alla parte superiore o definirla come pannello mobile nell'area di lavoro.

Consultare anche

“Aggancio e sgancio di pannelli e gruppi di pannelli” a pagina 30

“Uso della finestra di ispezione Proprietà” a pagina 28

Panoramica sul pannello File

Utilizzare il pannello File per visualizzare e gestire i file nel proprio sito Dreamweaver.

DREAMWEAVER CS3

Guida utente

Quando si visualizzano siti, file o cartelle nel pannelloFile, è possibile modificare ladimensione dell'area di visualizzazione ed espandereo comprimere ilpannello File. Quando ilpannello File è compresso, visualizza il contenuto del sito locale, del sito remoto o del server di prova come elenco di file. Quando è espanso, visualizza il sito locale e il sito remoto o il server di prova. Il pannello File può visualizzare inoltre una mappa visiva del sito locale.

Per i siti Dreamweaverè possibile personalizzare il pannello File modificando la vista, sia del sito locale che del sito remoto, che viene visualizzata per impostazione predefinita nel pannello compresso.

Consultare anche

“Operazioni con i file nel pannello File” a pagina 75

DREAMWEAVER CS3

Guida utente

Panoramica sul pannello Stili CSS

Il pannello Stili CSS consente di gestire le regole e le proprietà CSS che incidono su un elemento di pagina selezionato (modalità Corrente), oppure quelle che hanno effetto sull'intero documento (modalità Tutto). Un pulsante di attivazione nella parte superiore del pannello consente di scegliere la modalità desiderata. Il pannello Stili CSS consente inoltre di modificare le proprietà CSS in entrambe le modalità.

È possibile ridimensionare uno o più riquadri trascinandone i bordi.

In modalità Corrente il pannello Stili CSS è suddiviso in tre riquadri: il riquadro Riepilogo per selezione, che visualizza le proprietà CSS della selezione corrente, il riquadro Regole, che mostrala posizione delleproprietà selezionate(o di unaserie di regole a cascata per il tag selezionato, a seconda della selezione effettuata), e il riquadro Proprietà che permette di modificare le proprietà CSS della regola che definisce la selezione.

In modalitàTutte il pannello Stili CSS è suddiviso in due riquadri: Tuttele regole (in alto) e Proprietà (in basso). Il riquadro Tutte le regole visualizzaun elenco delle regoledefinite neldocumento correntee diquelle definitenei foglidi stileassociati; il riquadro Proprietà consente di modificare le proprietà CSS di qualunque regola selezionata nel riquadro Tutte le regole.

Qualsiasi modifica effettuata nel riquadro Proprietà viene applicata immediatamente, consentendo di visualizzare un'anteprima in tempo reale mentre si lavora.

Consultare anche

“Creazione e gestione dei CSS” a pagina 117

Panoramica sui riferimenti visivi

Dreamweaver fornisce diversi tipi di riferimenti visivi utili per la progettazione dei documenti e per la previsione approssimativa del loro aspetto nei browser. È possibile:

• Bloccare istantaneamente la finestra Documento su una dimensione desiderata per verificare la collocazione dei vari

elementi rispetto alla pagina.

• Utilizzare un’immagine diricalco come sfondo dellapagina per riprodurre una strutturacreata inun’applicazione grafica

come Adobe® Photoshop® o Adobe® Fireworks®.

• Utilizzare i righelli e le guide come riferimento visivo per posizionare e ridimensionare con precisione gli elementi di

pagina.

DREAMWEAVER CS3

Guida utente

• Utilizzare la griglia per posizionare e ridimensionare con precisione gli elementi con posizione assoluta (elementi PA).

Le linee checompongono lagriglia facilitano l’allineamento degli elementiPA; inoltre, se la funzionedi aggancio è attivata, gli elementi PA vengono automaticamente agganciati al punto più vicino della griglia quando vengono spostati o ridimensionati. Gli altri oggetti (adesempio, leimmagini e i paragrafi) non vengono agganciati allagriglia, I livelli vengono agganciati alla griglia indipendentemente dal fatto che questa sia visualizzata o nascosta.

Consultare anche

“Uso di riferimenti visivi per il layout” a pagina 163

Utenti GoLive

Gli utenti che hanno già utilizzato GoLive e che desiderano passare a Dreamweaver possono consultare l'introduzione in linea ad area e flusso di lavorodi Dreamweaver, oltre a una discussione sui metodi per migrare i propri siti a Dreamweaver. Per ulteriori informazioni, vedere www.adobe.com/go/learn_dw_golive_it.

Operazioni con la finestra Documento

Passaggio da una vista all'altra nella finestra Documento

È possibile visualizzare un documento nella finestra Documento in tre viste differenti: Progettazione, Codice oppure Codice e Progettazione.

Consultare anche

“Panoramica sulla finestra del documento” a pagina 15

Passaggio alla vista Codice

❖

Effettuare una delle operazioni seguenti:

• Selezionare Visualizza > Codice.

• Nella barra degli strumenti del documento, fare clic sul pulsante Mostra vista Codice

Passaggio alla vista Progettazione

❖

Effettuare una delle operazioni seguenti:

• Selezionare Visualizza > Progettazione.

• Nella barra degli strumenti del documento, fare clic sul pulsante Mostra vista Progettazione

Mostra viste Codice e Progettazione

❖

Effettuare una delle operazioni seguenti:

• Selezionare Visualizza > Codice e progettazione.

• Nella barra degli strumenti del documento, fare clic sul pulsante Mostra viste Codice e Progettazione

Passaggio dalla vista Codice alla vista Progettazione:

❖

Premere Ctrl+barra rovesciata (\).

IfbothviewsareshowingintheDocumentwindow,thiskeyboardshortcutchangeskeyboardfocusfromoneviewtothe other.

Sovrapposizione o affiancamento delle finestre dei documenti

In presenza di molti documenti aperti contemporaneamente, è possibile disporli affiancati o sovrapposti.

DREAMWEAVER CS3

Guida utente

Consultare anche

“Scelta del layout dell'area di lavoro (solo per Windows)” a pagina 32

“Visualizzazione di documenti a schede (solo per Macintosh)” a pagina 32

“Salvataggio di layout personalizzati dell'area di lavoro” a pagina 33

Sovrapposizione delle finestre dei documenti

❖

Selezionare Finestra > Sovrapponi.

Affiancamento delle finestre dei documenti

• In ambiente Windows, selezionare Finestra > Affianca orizzontalmente o Finestra > Affianca verticalmente.

• In ambiente Macintosh, selezionare Finestra > Affianca.

Ridimensionamento della finestra Documento

La barra di stato visualizza le dimensioni correnti della finestra Documento (in pixel). Per progettare una pagina che dia risultati ottimali a dimensioni specifiche, è possibile adattare la finestra del documento a una delle dimensioni predeterminate, modificare tali dimensioni oppure crearne di nuove.

Ripristino delle dimensioni predefinite della finestra Documento

❖

Selezionare una delle opzioni visualizzate nel menu a comparsa Dimensioni finestra situato nella parte inferiore della

finestra Documento.

Nota: inWindows,èpossibileingrandirelafinestraDocumentoinmodocheoccupil'interaareadeldocumentodellafinestra integrata. Non è possibile ridimensionare una finestra Documento quando è già ingrandita.

Le dimensioni della finestra si riferiscono alle dimensioni interne della finestra del browser (senza i bordi). I valori tra parentesi indicano le dimensioni del monitor. Ad esempio, se si prevede che i visitatori del sito utilizzeranno la configurazione predefinita di Internet Explorer o Netscape Navigator su un monitor da 640 x 480, l'opzione da utilizzare è "536 x 196 (640 x 480, predefinita)".

Per un ridimensionamento meno preciso, utilizzare i metodi consueti del sistema operativo in uso, ad esempio il trascinamento dell'angolo inferiore destro di una finestra.

Modifica dei valori elencati nel menu a comparsa Dimensioni finestra

1 Selezionare Modifica dimensioni dal menu a comparsa Dimensioni finestra.

2 Fare clic su uno dei valori di larghezza o altezza dell'elenco Dimensioni finestra e digitare un nuovo valore.

Per modificare solo la larghezza della finestra Documento (lasciando invariata l'altezza), selezionare un valore di altezza e cancellarlo.

3 Fare clic nella casella di testo Descrizione se si desidera inserire un testo descrittivo per una dimensione specifica.

Aggiunta di una nuova opzione al menu a comparsa Dimensioni finestra

1 Selezionare Modifica dimensioni dal menu a comparsa Dimensioni finestra.

2 Fare clic nello spazio vuoto situato sotto l'ultimo valore della colonna Larghezza.

3 Inserire una larghezza e un'altezza.

+ 664 hidden pages

ADOBE Dreamweaver CS3 User Manual [it]

Specifications and Main Features

Frequently Asked Questions

User Manual

Sommario

Capitolo 1: Guida introduttiva

Installazione

Requisiti

Installare il software

Attivazione del software

Registrazione

Guida di Adobe

Risorse della Guida di Adobe

Utilizzo dell’Aiuto integrato nel prodotto

Scelta dei documenti della Guida desiderati

Risorse

Adobe Video Workshop

Filmati di Dreamweaver CS3

Extra

Bridge Home

Adobe Design Center

Centro per sviluppatori Adobe

Servizio clienti

Download

Adobe Labs

Comunità di utenti

Novità

Principali nuove funzioni di Adobe Dreamweaver CS3

Capitolo 2: Area di lavoro

Flusso e area di lavoro di Dreamweaver

Panoramica sul flusso di lavoro di Dreamweaver

Area di lavoro panoramica sul layout

Area di lavoro panoramica sugli elementi

Panoramica sulla finestra del documento

Panoramica sulla barra degli strumenti del documento

Panoramica sulla barra degli strumenti standard

Panoramica sulla barra di stato

Panoramica sulla barra Inserisci

Panoramica sulla barra degli strumenti Codifica

Panoramica sulla barra degli strumenti Stile di rendering

Panoramica sulla finestra di ispezione Proprietà

Panoramica sul pannello File

Panoramica sul pannello Stili CSS

Panoramica sui riferimenti visivi

Utenti GoLive

Operazioni con la finestra Documento

Passaggio da una vista all'altra nella finestra Documento

Sovrapposizione o affiancamento delle finestre dei documenti

Ridimensionamento della finestra Documento