Definizione di un sito
Nella scorsa puntata di questo speciale, per prova, abbiamo proposto di creare pagine HTML. Si trattava di pagine isolate (che, peraltro, abbiamo anche lasciato vuote) che non si trovano all’interno di un sito.
Dreamweaver, però, è pensato per fare molto di più che semplici pagine: infatti, permette di gestire interi siti.
Prima di cominciare a lavorare e a creare le pagine occorrerà, dunque, definire il sito, cioè fornire a Dreamweaver CS4 tutte le informazioni necessarie a gestire l’insieme di file che costituiranno un sito web che sarà poi pubblicato su Internet (o anche su una Intranet).
In questo modo Adobe Dreamweaver CS4 potrà gestire in maniera unitaria tutti i file del sito. Per esempio, sarà possibile cambiare nome a un file, mantenendo aggiornati i collegamenti che puntano a quel file, si potrà poi eseguire l’upload dei file sul server definitivo in modo semplice, selezionando solo i file modificati e così via.
Dreamweaver è capace di gestire diversi siti web alla volta: ogni sito ha un suo nome e caratteristiche specifiche. Di volta in volta scegliete su quale sito volete lavorare. È possibile creare un nuovo sito sia a partire dalla schermata iniziale del programma, semplicemente scegliendo la voce Sito web Dreamweaver, sia dall’interno di Dreamweaver, aprendo il menu del pulsante Sito e scegliendo la voce Nuovo sito, visibile in figura 1.

Figura 1: avviare la creazione di un nuovo sito
Nota
Potete avviare la creazione di un nuovo sito anche scegliendo Sito > Nuovo sito. In questo caso, però, non avvierete la creazione guidata, ma passerete subito alle finestre avanzate che descriveremo più avanti in questo articolo.
Comunque sia stata avviata la creazione del nuovo sito, la procedura da seguire è identica. Dreamweaver CS4 vi mostrerà la prima finestra della creazione guidata di un nuovo sito, visibile in figura 2.
Come prima opzione, dovete indicare il nome del sito. Questo nome servirà esclusivamente a voi per identificare il sito all’interno di Dreamweaver.
In questa schermata potete anche indicare l’indirizzo web che avrà il sito una volta pubblicato. Se non avete ancora il nome di dominio che vi occorre, non preoccupatevi: sarà possibile modificare le informazioni fornite per un sito in ogni momento. Potrete quindi tornare all’interno di questa finestra e inserire il nome di dominio che avete registrato.

Figura 2: la prima finestra della creazione guidata del nuovo sito
Una volta definito il nome ed, eventualmente, inserito l’indirizzo web, passate alla schermata successiva, visibile in figura 3. Ora dobbiamo decidere se il nostro sito web farà uso di tecnologia server, e quindi se conterrà elementi dinamici. Per queste prime prove non avrete bisogno di una tecnologia server, che però sarà indispensabile nel momento in cui affronteremo la parte interattiva del nostro sito. Per ora, dunque, non è importante scegliere la tecnologia server. Potrete fornire questa informazione più avanti.
Nota
Delle tecnologie server per siti web dinamici abbiamo parlato nell'articolo del nostro speciale su Dreamweaver CS4, intitolato "Creare applicazioni Web con Dreamweaver CS4".

Figura 3: la seconda finestra della creazione guidata del nuovo sito
Comunque, se scegliete di utilizzare una tecnologia server, dovrete poi specificare quale dall’apposito elenco a discesa. Le opzioni supportate da Adobe Dreamweaver CS4 sono:
- ASP Javascript;
- ASP VBScript;
- ASP.NET C#;
- ASP.NET VB;
- ColdFusion;
- JSP;
- PHP MySQL.
La scelta naturalmente sarà condizionata dal web server con il quale lavorerete. Per le prove potrebbe anche essere necessario installare un web server locale, in modo da non essere costretti a connettervi a Internet ogni volta che dovete lavorare al vostro sito.
Nota
Gli utenti di Windows XP Professional e Windows Vista Home Premium, Business o Ultimate dispongono del server IIS integrato nel sistema. Per poterlo utilizzare dovranno installarlo dal pannello di controllo, come modifica della propria installazione di Windows.
Gli utenti Mac invece trovano preinstallato Apache, ma per avere un ambiente server autonomo con anche php e MySQL preconfigurati, una buona soluzione gratuita è MAMP che potete scaricare gratuitamente.
Una volta che avete definito la tecnologia server da usare, o che avete deciso di rimandare la scelta a un secondo momento, premete il pulsante Avanti per passare alla schermata successiva, visibile in figura 4.

Figura 4: la terza finestra della creazione guidata del nuovo sito
Qui Dreamweaver CS4 vi chiederà come volete lavorare, ossia dove si trovano i file del sito in fase di lavoro (non riguardano tanto la posizione finale del sito). Le possibilità sono tre:
- Eseguendo modifiche e prove localmente (il server di prova è su questo computer): scegliete questa opzione se sul PC sul quale state attualmente lavorando è disponibile un web server di prova da usare in fase di sviluppo;
- Eseguendo le modifiche localmente e caricando poi i file sul server di prova remoto: scegliete questa opzione se non disponete di un web server locale; la pubblicazione del sito avverrà poi su un server di prova remoto su Internet;
- Modificando i file direttamente sul server di prova remoto attraverso la rete locale: scegliete questa opzione se il web server di prova si trova nella vostra rete locale.
A seconda della scelta, Dreamweaver chiederà di specificare nella casella sottostante a queste opzioni la posizione reale dei file. Nel primo caso vi chiederà di specificare la cartella del web server locale in cui si trovano i file; nel secondo la cartella locale che ospita i file; nel terzo l’indirizzo di rete in cui si trovano i file.
Nota
Ogni web server memorizza i suoi file in una specifica cartella del disco (per esempio i server Microsoft utilizzano la cartella c:\\Inetpub\wwwroot\). Consultate la documentazione del web server in merito. In genere, comunque, Dreamweaver CS4, se rileva la presenza di un web server locale, vi propone la sua cartella come posizione per i file.
Una volta definite queste opzioni, scegliete Avanti e passate alla schermata successiva, visibile in figura 5.

Figura 5: la quarta finestra della creazione guidata del nuovo sito
La nuova finestra vi chiederà in quale modo volete connettervi al server di prova (che può anche essere il server definitivo). Di fatto, si tratta di definire il modo in cui viene pubblicato il vostro sito web.
Le opzioni più comuni sono Locale/rete e FTP. Nel primo caso bisognerà specificare il computer della rete locale che ospita il web server definitivo e la cartella in cui dovrete salvare i vostri file. Se scegliete il trasferimento FTP, dovrete completare la schermata visibile nella figura 6 con i dati forniti dal vostro fornitore di servizi Internet (nome server FTP, nome cartella, nome utente e password). Anche in questo caso, potete verificare le indicazioni fornite premendo il pulsante Prova connessione.
Se la connessione funziona correttamente, riceverete un messaggio di conferma da parte di Dreamweaver CS4.

Figura 6: impostazioni di trasferimento FTP
Ci sono altri metodi di trasferimento possibili. In ogni caso dovrete fornire i dati di accesso al web server. La scelta del tipo di trasferimento dipende dalle possibilità offerte dal server remoto.
Per esempio, se sul server remoto è in esecuzione Adobe ColdFusion si può ricorrere alla tecnologia di trasferimento RDS (Remote Development Services).
Un’altra possibilità è WebDAV (Web-based Distributed Authoring and Versioning). Utilizzate questa impostazione se la connessione al server web avviene tramite il protocollo WebDAV.
Infine, se sul vostro PC locale è installato Microsoft Visual SourceSafe Client versione 6 e il web server lo permette, potete caricare i file via Microsoft Visual SourceSafe.
Se non avete ancora scelto il web server e/o non siete sicuri di come trasferirete i file o vi mancano i dati di accesso, potete “saltare” momentaneamente questo passaggio scegliendo la voce Voglio impostarlo più avanti. Naturalmente non sarà possibile pubblicare il vostro sito web fino a quando non fornirete queste indicazioni. Nella schermata successiva, a seconda del protocollo di trasferimento prescelto, vi potrebbe essere chiesto di verificare la correttezza dell’indirizzo della cartella del server remoto su cui verrà pubblicato il sito.
Verificate queste informazioni e procedete. A questo punto Dreamweaver chiede se volete abilitare l’opzione di deposito e ritiro dei file. Questa opzione è molto utile, per non dire fondamentale, se prevedete che al sito lavoreranno più persone in contemporanea. Infatti, quando un utente apre un file questo può essere ritirato, ossia bloccato in modo che nessun altro utente possa cercare di aprirlo in contemporanea.
Se specificate in questa finestra il vostro indirizzo e-mail, sarete avvisati con una e-mail qualora un file che avete richiesto sia stato sbloccato da un altro utente e reso disponibile. Andate ancora Avanti.
L’ultima schermata mostrerà un riassunto delle opzioni che avete impostato. Ora avete due possibilità: concludere la creazione del sito o passare a fornire altre impostazioni avanzate per il sito stesso.
Nel primo caso premete Fine e aspettate che Dreamweaver crei la struttura necessaria per il sito. Nel secondo dovete portarvi nella scheda Avanzate della finestra di creazione del sito. Noi proveremo questa seconda possibilità e anche chi ha scelto di non fornire subito le impostazioni avanzate potrà tornare a fornirle più avanti. Visualizzerà una finestra identica a quella che descriveremo. Più sotto spiegheremo anche come riattivarla se si è scelto di non visualizzarla subito.
Comunque, portatevi nella scheda Avanzate della finestra Definizione del sito, visibile in figura 7.
Come si può notare, le possibili impostazioni sono suddivise per categorie; ne vedremo un paio.

Figura 7: la scheda Avanzate della finestra Definizione del sito
Innanzitutto, nella categoria Informazioni locali troviamo la definizione della Cartella immagini. Si tratta di specificare una cartella, interna alla cartella principale del sito, in cui memorizzare tutte le immagini del sito stesso. Questo permetterà di tenere ordine nei file del sito e di garantire la presenza di tutti i file necessari al funzionamento del sito in un’unica posizione, rendendo più semplice il trasferimento dei file sul server finale. Quando si inserirà nel sito un’immagine memorizzata in posizione esterna al sito, Dreamweaver ne creerà automaticamente una copia nella cartella delle immagini. Per creare la cartella delle immagini occorre premere il pulsante giallo a forma di cartella posto accanto alla casella di testo Cartella immagini. Apparirà la finestra Scegliere la cartella Images locale per il sito [nome sito]. Portatevi nella cartella del sito e create una nuova cartella. Quindi assegnate un nome alla nuova cartella (l’ideale è un nome come Immagini o images).
Aprite la nuova cartella e premete il pulsante Seleziona. Sarete riportati alla schermata di definizione delle proprietà del sito e il nome della cartella verrà inserito nella casella relativa alla cartella predefinita per le immagini.
In questa schermata potete anche fornire l’URL finale del sito nella casella Indirizzo HTTP, a meno che non lo abbiate già inserito nella prima schermata della creazione guidata del sito che abbiamo visto nella figura 2.
Se usate un server non Microsoft, è molto importante attivare l’opzione Usa collegamenti con distinzione fra maiuscole e minuscole. Se questa opzione è attiva, Dreamweaver controlla che le maiuscole e le minuscole utilizzate nei collegamenti corrispondano esattamente a quelle dei nomi dei file quando esegue la verifica dei collegamenti.
Questo è molto importante perché, mentre Windows non distingue tra lettere minuscole e maiuscole nei nomi dei file, i sistemi basati su UNIX come Linux e Mac OS X lo fanno. Di conseguenza, i collegamenti correttamente funzionanti su un PC Windows potrebbero non funzionare quando vengono richiamati da un web server Linux o Unix o Mac OS X.
Nelle schede Informazioni su remoto e Server di prova potete fornire le informazioni sul server di prova e sul sistema di trasferimento dei file. Si tratta delle stesse informazioni fornite nella quarta finestra della creazione guidata del nuovo sito che abbiamo visto in figura 5.
In alcuni casi, il server di prova e il server remoto sono lo stesso server, in altri non lo sono. Il server remoto è quello che ospiterà il sito definitivo, mentre il server di prova è quello usato per lo sviluppo del sito.
Facciamo solo un rapido cenno alla scheda Controllo Versione. Dreamweaver, infatti, consente di connettersi a un server che utilizza Subversion (SVN), un sistema di controllo delle versioni che permette agli utenti di modificare e gestire i file sui web server remoti in modo collaborativo. Per maggiori informazioni su Subversion vi rimandiamo al suo sito ufficiale.
Dreamweaver non è un client SVN completo, tuttavia consente agli utenti di scaricare le versioni più recenti dei file, apportare le modifiche e applicare i file.
Se disponete di un server Subversion, in questa finestra potete specificare le impostazioni di accesso al server e cominciare a utilizzare questo servizio.
Maggiori dettagli in proposito sono disponibili nella guida in linea di Dreamweaver. Passiamo ora alla scheda Maschera file, visibile in figura 8.
Qui potete attivare l’opzione Abilita maschera dei file. Questa opzione permette di escludere dal trasferimento sul server remoto i file che terminano con le estensioni specificate nella casella sottostante all’opzione Applica maschera ai file che terminano con. Per impostazione predefinita, Dreamweaver CS4 propone di mascherare i file con estensione .psd e i file .fla, rispettivamente i file immagine nel formato nativo di Photoshop e i file di authoring di Flash, in modo da poterli tenere nella cartella locale del sito, ma non pubblicarli sul server finale. Si tratta, infatti, di file di lavoro, non necessari sul server Internet, ma fondamentali se si vogliono modificare i file finiti da pubblicare sul sito.

Figura 8: la scheda Maschera file
Potete comunque aggiungere altre estensioni semplicemente digitandole nell’apposita casella. Per esempio, se utilizzate Fireworks potrete mascherare i file .png, mentre se usate Word per scrivere i testi originali delle vostre pagine potete mascherare i file .doc o .docx.
Anticipiamo che Dreamweaver mostrerà nell’elenco dei file del sito anche i file mascherati, ma la loro icona sarà coperta da una barra rossa.
Dopo aver impostato tutte le opzioni desiderate, premete il pulsante OK. Dreamweaver avviserà che sta per creare la cache del sito, ossia il file che gli permette di gestire le preferenze specificate per il sito stesso. Confermate per proseguire.
Nota
Dreamweaver CS4 permette di integrarsi con diversi tipi di file provenienti da altri programmi, per maggiori informazioni, consultate l'articolo intitolato "Dreamweaver CS4: integrazione con altri programmi".
|