BETA 2199.4 - Prove: Macromedia Dreamweaver v.2.0  -  Indici | Guida

Macromedia Dreamweaver 2.0 Parte 2: come funziona di Daniela Apollonio Collaboratore, BETA Ciò che segue non vuole certo essere un tutorial di Dreamweaver. In questo spazio offerto da Beta cercherò di mostrare quanto sia intuitivo e semplice l'uso di questo programma. Creazione del testo. Iniziamo con lo scrivere del testo. Si', semplice testo, ad esempio: "la mia prima homepage" Ora evidenziamo il testo ed attiviamo la Properties Palette (dal menù Windows >Properties) Figura 1 - Dreamweaver v.2.0 Properties Palette La Properties Palette contiene tutti gli elementi per la formattazione del testo: grassetto o corsivo (la mia prima homepage o la mia prima homepage) la scelta del font, delle dimensioni e del colore dello stesso L'allineamento del testo rispetto alla pagina l'eventuale link ad una url o ad un file. Per personalizzare solo una parte del testo sarà sufficiente evidenziarla, ad esempio "la mia", ed applicarle la formattazione che abbiamo scelto: colore rosso, dimensione più grande del resto della frase. E' anche possibile creare liste ordinate e numerate, inserire del testo preformattato o rientrato semplicemente selezionando il relativo simbolo sulla "Properties Palette". Le immagini Anche la gestione delle immagini è molto intuitiva. Per inserire un immagine basta cliccare sull'icona posta nellla Object Palette, apparirà quindi un menù dal quale selezionare l'immagine che si vuole inserire. seleziono l'immagine 2199da20.gif Anche in questo caso è possibile personalizzare l'immagine utilizzando la Properties Palette che ne mostra gli attributi, procedendo ad un allineamento dell'immagine rispetto al documento (Align); provvedendo a dare una descrizione alternativa all'immagine per i browser che non le visualizzano ("Alt"); definendo un eventuale collegamento ad un'altra pagina ("link"); indicando la dimensione del bordo ("border") e dello spazio orizzontale e verticale intorno all'immagine da lasciare vuoto ("Hspace e Vspace"). Figura 2 - Dreamweaver v.2.0 ImageMap Anche la creazione di un imagemap diventa un gioco da ragazzi. Per creare una imagemap, dal "Properties Palette" dell'immagine si seleziona il tasto imagemap: apparirà il menù della Figura 2: si darà il nome alla imagemap e si selezioneranno, con gli appositi strumenti, le aree sensibili (alle quali verrà dato un nome ed un eventuale Target) Le Tabelle Gioie e dolori degli htmlisti, con Dreamweaver la gestione delle tabelle risulta essere veloce ed intuitiva. Per inserire una tabella si seleziona dall' Object Palette l'icona , apparirà un menù nel quale si potranno inserire le dimensioni della tabella. Figura 3 - Dreamweaver v.2.0 Parametri per creare una tabella Una volta definita la tabella, (nell'esempio composta da 2 righe, due colonne e larga il 25% della pagina), si clicca OK e sullo schermo apparirà la struttura della tabella con le relative proprietà. Sarà facile quindi personalizzare le tabelle, intervenendo direttamente sulle proprietà delle stesse e dei relativi elementi. Inseriamo, ad esempio, l'immagine 2199da20.gif, nella prima cella a sinistra della tabella (trascinando l'immagine nella cella stessa) Se si desidera ora spostare il margine destro, affinchè sia adiacente all'immagine, si potrà agire in due modi diversi: trascinando direttamente con il mouse il bordo della cella al bordo dell'immagine; oppure modificando le dimensioni della cella, utilizzando la "Properties Palette", inserendo nel parametro Width (W) della cella (TD) la larghezza in pixel dell'immagine, facendole così coincidere.   Figura 4 - Dreamweaver v.2.0. Il risultato finale   Intervenendo direttamente sulla "Properties Palette" degli elementi cella (TD) e riga (TR) si potrà facilmente modificare la struttura della tabella originale unendo in una riga più celle , o al contrario, dividendo una cella in piu' celle , ottenendo i seguenti risultati: Figura 5 - Dreamweaver v.2.0 Nell'immagine è stata aggiunta una cella nella seconda riga, utilizzando il comando "split" Figura 6 - Dreamweaver v.2.0 Nell'immagine è stata eliminata una cella nella seconda riga, utilizzando il comando "merge" Più sarà complessa la grafica della pagina, più intricata (nidificata) sarà la struttura della stessa; ma niente paura, sarà sempre possibile individuare l'oggetto dove si vuole intervenire, seguendo la struttura nidificata indicata in basso a sinistra del programma. Con un semplice clic sull'oggetto da modificare, sarà possibile agire direttamente sulle "Properties Palette" dell'oggetto (tag) selezionato. Questa breve panoramica delle funzioni base spero sia servita a mostrare quanto sia facile l'utilizzo di Dreamweaver. Passiamo ora, nella Parte 3, ad analizzare il "Launcher Palette" Parte 1 | Parte 2 | Parte 3 Parte 1 - Introduzione Parte 2 - Come funziona Parte 3 - Non solo HTML Daniela Apollonio è Collaboratore di BETA dal 1998; è raggiungibile su Internet tramite la redazione oppure all'indirizzo daniela@o-range.it. Copyright © 1999 Daniela Apollonio, tutti i diritti sono riservati. Questo Articolo di BETA, insieme alla Rivista, è distribuito secondo i termini e le condizioni della Licenza Pubblica Beta, come specificato nel file LPB.

BETA 2199.4: Sommario | Indice del Numero | Redazione | Liste/Forum | Informazioni | Licenza Pubbl. Beta | Mirror ufficiali | Internet ID | Guida | Cerca | Stampa indice sito | mappa | contattaci | newsletter | pubbl./ad info | abbonamento | informazioni | shopping Copyright © 1994-99 Beta, tutti i diritti sono riservati. BETA sul Web: http://www.beta.it