Come fare una pagina web con dreamweaver 8 partendo da zero.

0 votes, average: 0,00 out of 50 votes, average: 0,00 out of 50 votes, average: 0,00 out of 50 votes, average: 0,00 out of 50 votes, average: 0,00 out of 50 voti
Foto Come fare una pagina web con dreamweaver 8 partendo da zero.
Condividi

Una spiegazione dettagliata dei comandi di Dreamweaver 8

Istruzioni

  • 1
    Ci sono strumenti per creare le pagine web che si chiamano editor html: possono essere di tipo visuale o di tipo testuale. Gli editor visuali si basano sul concetto che ciò che vedi è quello che otterrai direttamente visibile come pagina web, quindi ‘what you see is what you get’, cioè, quello che vedi è quello che ottieni.
  • 2
    Con gli editor visuali è come se si stesse lavorando all’interno di un browser virtuale: nello spazio sottostante, al variare degli aspetti grafici da noi impostati, varierà il codice html generato dall’editor. Un editor di testo, non modifica in modo visuale la pagina, ma opera direttamente sul codice. In questo caso occorre conoscere il linguaggio html molto bene e possedere un manuale.
  • 3
    Attualmente c’è poca differenza tra un editor testuale ed un editor visuale: un editor visuale permette di intervenire sul codice, mentre un editor testuale consente una rapida visualizzazione in anteprima degli elementi della pagina. Spesso è dotato di comandi che ci consentono di avere in automatico la scrittura di un blocco di codice.
  • 4
    Per sviluppare gli insegnamenti di questa guida occorre possedere la versione 8 di Dreamweaver: potete scaricare un demo che durerà 30 giorni, e vi permetterà di decidere se comprare in seguito il prodotto originale.
    Potete scaricare la demo dal sito di Adobe, effettuando una registrazione personale.
  • 5
    Potete avere diverse versioni di Dreamweaver installate sul vostro computer, nei limiti di spazio disco e allocazione memoria consentiti dalla vostra macchina. Nessun problema se avendo ancora il demo, installate la versione 8, o se possedendo questa, installate la versione superiore MX. In questo caso non ci saranno problemi di incompatibilità sul vostro computer, ma le versioni saranno autonome ed indipendenti fra loro, e tutte funzionanti.
  • 6
    L’area di lavoro può essere impostata secondo tre diversi layout; per cambiare layout andare su Finestra>Layout area di lavoro, e scegliere la le tre diverse modalità che sono code, designer e dual screen, cioè doppio schermo, da usare solo se possedete due diversi schermi collegati allo stesso computer. Su uno schermo avremmo l’area principale e sull’altro i vari pannelli.
  • 7
    Il layour coder vede i pannelli sulla parte sinistra dello schermo con il pannello ‘proprietà’ aperto. Questo ambiente ricorda l’editor di un linguaggio di programmazione dove l’area di lavoro sia dedicata al codice e dove un pannello sul lato sinistro ci permetta di scegliere su quale file vogliamo andare a lavorare
  • 8
    Il layout Designer ha i pannelli sulla destra dello schermo e il pannello ‘proprietà’ aperto. Se invece scegliete schermo doppio l’interfaccia di lavoro sarà posizionata sullo schermo principale mentre sul vostro schermo secondario e potrete visualizzare tutto il resto, cioè i pannelli con cui potete gestire Dreamweaver 8 e impartire i diversi comandi.
  • 9
    Usando solo uno schermo, invece, sarà vantaggioso utilizzare l’interfaccia designer, magari apportando alcune modifiche. Ricordate che queste tre diverse visualizzazioni possono essere in parte modificate dall’utente, secondo le proprie preferenze. Un pannello si potrà trovare in condizioni visibili e aperto, oppure visibile e chiuso, o non visibile. Dal menu Finestra potrete scegliere
    i pannelli che vogliamo siano visibili.
  • 10
    Appena lanciato Dreamweaver ci troviamo di fronte a tre colonne: a sinistra troveremo i file aperti di recente e da qui possiamo proseguire il lavoro; nella colonna centrale possiamo creare un file vuoto, e qui abbiamo la proposta di diversi tipi di file. Nella terza colonna possiamo creare un file partendo da una libreria di esempi e modelli preimpostati.
  • 11
    Nella barra dei menu troviamo la voce File, che ci offre i principali comandi per la gestione del file; Troviamo la voce Modifica, che comprende le opzioni per la modifica della pagina presente. La voce Visualizza comprende invece le opzioni per la visualizzazione dell’area di lavoro. Troviamo quindi la voce Elabora che modifica le proprietà della pagina sulla quale stiamo lavorando.
  • 12
    Con il menu Testo è possibile accedere al controllo degli elementi testuali presenti sulla pagina; Nella voce Comandi le operazioni che ogni utente ritiene opportuno, posono essere registrate e salvate come voci del menu. Funziona come il comando Macro dei programmi Microsoft Office. Di qui si accede anche alle estensioni per Dreamweaver.
  • 13
    Attraverso la voce Sito possiamo accedere ai principali controlli sul sito in fase di sviluppo: possiamo anche accedere alla sua rappresentazione virtuale.
    Nella voce Finestra, invece, possiamo aprire i vari pannelli di Dreamweaver, ed eseguire controlli completi e rapidi sugli elementi della pagina, elementi che possono anche essere modificati tramite questo menù.
  • 14
    Infine troviamo il punto interrogativo ?, per avere accesso diretto alla guida in linea, o per accedere al pannello della gestione delle estensioni. Questo pannello è un programma separato dal contesto di Dreamweaver pur facendone parte. Questo programma si installa in modo automatico nel momento che installate il software di Dreamweaver sul vostro computer.
  • 15
    Dreamweaver gestisce più file nello stesso momento e nella stessa finestra: abbiamo i pulsanti di Riduci ad icona, quello di Ripristino in basso e quello di chiusura. Troviamo questi comandi nell’angolo in alto a destra della applicazione corrente, oppure nell’angolo destro superiore della finestra della pagina web corrente, cioè quella su cui stiamo lavorando.
  • 16
    Dreamweaver presenta quattro barre degli strumenti che sono Inserisci, Rendering stile, Documenti e Standard. Ce ne sarebbe una ulteriore, introdotta nelle versioni più recenti di Dreamweaver, che è la barra Codice.
    Di solito si utilizza principalmente Inserisci e Documenti, e per visualizzare o nascondere accediamo al menù Visualizza>Barre degli strumenti: qui spunterete le voci relative alle barre che vogliamo visualizzare.
  • 17
    Troviamo la barra degli strumenti Documento sotto la barra degli strumenti Inserisci: la barra degli strumenti Documento offre una serie di pulsanti. Possiamo scegliere se visualizzare il codice html della pagina, agendo sul pulsante Codice, a sinistra dello schermo e in alto. Oppure possiamo attivare la modalità Progettazione: in entrambi i casi si visualizzano gli oggetti come apparirebbero in un browser, oltre ad un aserie di simboli.
  • 18
    Una terza modalità ibrida che divide mostra la finestra Codice e la pagina Progettazione: questa modalità si può attivare premendo il pulsante Dividi.
    Nella casella Titolo, si può inserire il titolo che vogliamo dare alla nostra pagina web. E’ presente anche un menù che si chiama Convalida codice e fornisce funzioni relative alla convalida delle pagine web, in accordo con gli standard più conosciuti.
  • 19
    Il menù Gestione file vi permette di gestire un gruppo di persone che lavorano allo stesso progetto nello stesso momento, usando una sola versione dei file in remoto. Cliccando sul pulsante Anteprima/Debugger nel browser invece, appare un menù contenente una lista di browser. Selezionare un browser per lanciare l’anteprima. Possiamo modificare questo elenco di browser scegliendo Modifica elenco browser.
  • 20
    In questo modo accediamo al pannello Preview in Browser: qui potremmo aggiungere un nuovo browser al nostro elenco di browser. Sarà necessario premere il pulsante + e riempire la finestra di dialogo scegliendo un nome che associeremo al nuovo browser. Ne individueremo anche la posizione all’interno del disco rigido del nostro computer.
  • 21
    Esiste anche il comando Salva tutto: salverete in un solo comando tutti i documenti aperti. Con Print code, invece, stamperete il codice della pagina corrente. Per tagliare un elemento dalla pagina userete il comando Taglia.
    Copia vi permetterà di copiare un elemento della pagina e Incolla di incollarlo in una posizione della pagina web che state costrruendo.

Tags


Commenti alla guida

 
Chiudi

You need to log in to vote

The blog owner requires users to be logged in to be able to vote for this post.

Alternatively, if you do not have an account yet you can create one here.

Powered by Vote It Up