BETA La rivista ipertestuale tecnica
BETA
BETA La rivista ipertestuale tecnicaBarra BETA
Barra Sito Beta.it

BETA 2199.4 - Prove software: Macromedia Dreamweaver 2.0  -  Indici | Guida

clicca qui!

Macromedia Dreamweaver 2.0

Parte 2: come funziona

Daniela Apollonio
Collaboratrice, 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)

property palette
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 evidenziare, ad esempio "la mia" ed applicare la formattazione che abbiamo scelto, ad esempio, colore rosso, dimensione più grande del resto della frase.

E' anche possibile creare liste ordinate e numerate, inerire 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 si seleziona dalla Object Palette, l'icona corrispondente.
Apparirà 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 relativa all'immagine, 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 da lasciare vuoto intorno all'immagine ("Vspace e Hspace").

Imagemap
Figura 2 - Dreamweaver v.2.0 ImageMap
Anche la creazione di un imagemap diventa un gioco da ragazzi.

Per creare una imagemap, dalle "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 per gli htmlisti, con dreamweaver la gestione delle tabelle risulta essere veloce ed intuitiva.
Per inserire una tabella si seleziona dalla Object Palette, l'icona corrispondente.

Appare un menù nel quale inserire le dimensioni della tabella desiderata

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% del documento), si clicca OK e sullo schermo appare la struttura della tabella con le relative proprietà.

Properties palette della tabella

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)

Volendo ora spostare il margine destro in modo che sia adiacente all'immagine, si può agire in diversi modi:
trascinando con il mouse il bordo della cella al bordo dell'immagine


oppure modificando le dimensioni della cella, utilizzando la "Properties Palette", intervenendo sul parametro Width (W) della cella (TD), facendolo coincidere con la dimensione dell'immagine.


Il risultato finale sarà quello desiderato:

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 merge, o la contrario, dividendo una cella in piu' celle split, ottenendo i seguenti risultati:

Figura 4 - Dreamweaver v.2.0 Nell'immagine è stata aggiunta una cella nella seconda riga, utilizzando il comando "split" Figura 5 - 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ù intrigata (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.

nidificazione della pagina

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"



Collegamento d'articolo
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


Beta.it (http://www.beta.it)email info@beta.it
Barra Sito Beta.it

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

Sommario Internet Id Redazione Liste/Forum Informazioni Indice del Numero Mirror ufficiali Beta Home Page Beta Home Page english Beta News BETA Rivista Articoli BETA Beta Edit, pubblicazioni Beta Logo, premi Beta Lpb, Licenza Pubblica e Articoli Lpb Beta Navigatore Beta Online Beta Library Beta Info Gruppo Beta BETA La rivista ipertestuale tecnica Collegamento al sito Web