Nessun risultato. Prova con un altro termine.
Guide
Notizie
Software
Tutorial
  • Lezione 19 di 81
  • livello principiante
Indice lezioni

La gestione delle immagini 4: la relativa barra degli strumenti

FP2000 mette a disposizione una barra tutta dedicata al trattamento delle immagini
FP2000 mette a disposizione una barra tutta dedicata al trattamento delle immagini
Link copiato negli appunti

Come spiegato nei paragrafi precedenti è possibile modificare un'immagine
che abbiamo inserita in una pagina HTML semplicemente visualizzandone le
Proprietà
e premendo il pulsante Modifica. Questa procedura, infatti, carica
l'immagine nel programma di grafica predefinito di FP2000, ovvero Microsoft
Image Composer 1.5.
Quando salveremo l'immagine modificata con Microsoft Image Composer potremo
quindi tornare a FP2000 nella pagina HTML sarà presente la nuova versione
dell'immagine.

Tuttavia esiste un procedimento ancora più semplice per eseguire delle
semplici operazioni sulle immagini: la barra degli strumenti Immagini.

Secondo le impostazioni predefinite di FP2000 la barra compare ogni volta che
viene selezionata un immagine presente in una pagina HTML.
Possiamo comunque scegliere di visualizzare sempre la barra Immagini aprendo il
menu Visualizza selezionando Barre degli strumenti e cliccando
poi su Immagini.

Andiamo ora ad esaminare tutte le funzionalità di questa barra.

figura

Il
comando Inserisci immagine da file è esattamente lo stesso descritto
nella barra standard e permette di inserire velocemente un immagine nella
pagina HTML corrente.

figura

Questo
pulsante permette di inserire velocemente del testo sull'immagine
selezionata. Possiamo usare questo comando solo su immagini GIF. Se cerchiamo di
applicare del testo ad un immagine di formato differente FP2000 ci chiederà il
permesso di convertirla in GIF.
Una volta impartito il comando si creerà, sull'immagine, un rettangolo
tratteggiato che indica l'area in cui possiamo immettere del testo. Possiamo
modificare a piacimento posizione e dimensioni del rettangolo purché non
fuoriesca dall'immagine.
Possiamo quindi digitare il testo desiderato e formattarlo scegliendo carattere,
dimensioni, stile, allineamento, sottolineatura e colore dell'evidenziatore.

figura

Questo
pulsante sostituisce l'immagine con una miniatura impostandola come un
collegamento ipertestuale all'immagine di origine.
Di risultato quando il futuro visitatore farà clic sulla miniatura verrà caricata
l'immagine di origine (con le dimensioni originali quindi).

figura

Per
comprendere appieno questa funzione (ma soprattutto la tecnica usata) sarebbe
meglio leggere il capitolo dedicato al posizionamento assoluto.
In concreto, comunque, possiamo selezionare l'immagine e premere questo
pulsante. Il risultato immediato sarà che con il mouse potremo trascinare
l'immagine in ogni punto delle schermo esattamente come succede in un programma
di grafica.
Questa funzione va usata con le dovute precauzioni poiché, trattandosi sempre
di pagine HTML, il risultato potrebbe in alcune situazioni essere
imprevisto. Potrebbero, ad esempio verificarsi delle sovrapposizioni con altri
elementi presenti all'interno della pagina HTML:

figura

Questi
due pulsanti sono la diretta conseguenza al posizionamento assoluto.
Analogamente ad un programma di grafica, infatti, questi pulsante permette di
portare l'immagine selezionata rispettivamente sopra o sotto ad
altri eventuali oggetti posizionati sulle stesse coordinate x, y.
Questi due comandi agiscono quindi sull'asse Z.

figura

Questi due
pulsanti permettono di ruotare l'immagine di 90 gradi. Il primo pulsante
effettua una rotazione antioraria mentre il secondo una rotazione oraria.

figura

Questi
comandi invertono (in senso speculare) l'immagine rispettivamente in
verticale ed in orizzontale.

figura

Il
primo pulsante Aumenta il contrasto dell'immagine mentre il secondo lo diminuisce.
Gli altri due pulsanti rispettivamente aumentano e diminuiscono la luminosità.

figura

Può
capitare, lavorando, che l'immagine inserita contenga degli elementi superflui o
comunque da eliminare. Se vogliamo, quindi, ritagliare una porzione
dell'immagine possiamo servirci del comando ritaglia. Cliccando su di
esso comparirà un rettangolo sull'immagine selezionata. Modifichiamo la
posizione e le dimensioni del rettangolo in modo che comprenda la porzione
dell'immagine che ci interessa. Una volta finito premiamo ancora il pulsante ritaglia
e l'immagine verrà sostituita con il "ritaglio".

figura

Come
abbiamo imparato in precedenza le immagini GIF possono essere trasparenti.
Tecnicamente questo significa che un colore dell'immagine, in genere il bianco,
viene definito come trasparente. Cliccando sul pulsante Imposta colore
trasparente
il puntatore del mouse verrà sostituito dall'apposito
selettore. Andiamo a cliccare su un colore dell'immagine e immediatamente quel
colore diventerà trasparente.
Ovviamente questa operazione può essere effettuata solo su immagini GIF e se
viene applicata ad altri formati FP2000 ci chiederà il permesso di convertire
l'immagine in GIF.

figura

I
comandi Bianco e nero e Colori attenuati permettono
rispettivamente di trasformare un immagini in bianco e nero o di attenuarne la
gradazione di colori.

figura

Questo
pulsante crea una cornice dell'immagine sfumandone i bordi.

figura

Quando
le dimensioni dell'immagine vengono alterate all'interno di FP2000 (usando
l'apposito comando nelle proprietà dell'immagine oppure semplicemente
tirando le maniglie che compaiono sul perimetro dell'immagine selezionata) in
effetti il file grafico rimane invariato e viene solo specificato nel listato
HTML come dovrà essere visualizzata l'immagine.
Se l'immagine è stata ridotta questo sistema crea degli inconvenienti a livello
grafico ed a livello di caricamento.
La soluzione è quella di "riscrivere" il file grafico (cioè la vera
e propria immagine) in modo da renderla conforme alle dimensioni attuali. Questa
funzione, appunto, viene svolta dal pulsante Adatta risoluzione.

figura

Se
abbiamo attivato un qualsiasi tasto della barra degli strumenti possiamo
disattivarlo, e quindi evitare di applicare la funzione grafica corrispondente,
premendo il tasto Seleziona.

figura

L'HTML
ci consente di creare una mappa immagine. Data un immagine, cioè,
possiamo scegliere di impostare parti di essa come se fossero dei collegamenti
indipendenti tra loro.
Se ad esempio abbiamo la foto di vari prodotti in vendita possiamo far si che
cliccando su ogni prodotto si venga proiettati nella pagina relativa.
Possiamo creare delle aree sensibili usando i tre pulsanti rettangolo, cerchio e
poligono.
E' sufficiente selezionare l'immagine e poi uno dei tre pulsanti. A quel punto
basterà creare una forma sull'immagine cercando di adattarla il più possibile
alle nostre esigenze. Terminata la creazione della forma si aprirà la classica
finestra Crea collegamento che ci permetterà di impostarne tutte le opzioni.
Nota: usando il terzo pulsante (quello per creare un area poligonale) possiamo
terminare la costruzione del poligono semplicemente facendo doppio clic.

figura

Il
pulsante Evidenzia aree sensibili permette di visualizzare tutte le aree
sensibili che abbiamo impostato nell'immagine selezionata.

figura

Il
pulsante Ripristina, infine, ci permette di ripristinare l'immagine come
era prima che apportassimo le modifiche con FP2000.


Ti consigliamo anche