7. Inserimento di immagini
Generalità
Le immagini consentono di dare un impronta personale e molto accattivante del messaggio trasmesso al destinatario. In un documento HTML
possono esserne inserite in quantità in maniera semplice ed agevole.
Comando <IMG>
Il comando che consente di inserire una immagine è
<IMG> che, a differenza della maggior parte dei comandi, non richiede il tag di chiusura. Sarà sufficiente scrivere
<IMG SRC="pippo.gif"> per visualizzare l'immagine di nome "pippo.gif".
Quando si parla di "immagini" si intende un formato di file che rappresenta un disegno, una foto ecc.. I classici file d'immagini
conosciuti sono, ad esempio il .BMP di Windows, il .GIF, il JPG.
E' opportuno sapere che i browser, di norma, leggono senza problemi i file tipo .JPG e i .GIF. Per quanto riguarda gli altri tipi (ne potete vedere un elenco a questo link), servono degli add-on al browser che non tutti hanno e quindi, è conveniente inserire nei documenti HTML solamente immagini di tipo .GIF o .JPG per l'in
Parametri di <IMG>
I parametri del comando IMG sono i seguenti, e vanno inseriti tutti dopo il tag, prima della parentesi > di chiusura:
- SRC="nome_file_grafico"
Indica il nome ed il percorso dell'immagine da visualizzare.
- LOWSRC="nome_file_grafico_a_bassa_risoluzione"
Indica un file grafico di piccole dimensioni, da caricare prima
dell'immagine con SRC. E' utilizzato quando l'immagine da visualizzare è molto grande e si vuol dare un'idea, all'utente, di ciò che vedrà, così da lasciargli la scelta di attendere i tempi di caricamento oppure andare altrove.
- BORDER="x"
Indica la dimensione
in pixel dell'eventuale bordo da visualizzare intorno all'immagine. Se non è specificato "x" l'immagine non avrà bordo.
- ALIGN="where"
Allinea l'immagine
rispetto al testo visualizzato. Con LEFT, sia allineeràa sinistra, con RIGHT a destra e con CENTER al centro. Ci sono comunque altre possibilità di allineamento.
- ISMAP
indica che l'immagine visualizzata è
una mappa di coordinate: clickandoci sopra il computer rileva le coordinate del mouse ed è in grado di inviarle al server che può elaborarle per individuare, ad esempio, una nuova pagina da inviare.
- WIDTH="xxx"
Specifica una larghezza predefinita in pixel dell'immagine.
- HEIGHT="xxx"
Come per il precedente, ma relativamente all'altezza
- VSPACE="xx"
Indica uno spazio da lasciare libero sopra e sotto l'immagine.
- HSPACE="xx"
Indica uno spazio da lasciare libero a destra e a sinistra dell'immagine.
- ALT="nome_alternativo"
Nome
visualizzato nel caso in cui il browser non mostra le immagini o sono state disabilitate.Dovrebbe essere ugualmente esplicativo dell'immagine che sarebbe stata visualizzata.
- USEMAP
per utilizzare, sull'immagine, una mappa locale.
Esempi
Vediamo come un semplice comando
consente di inserire un'immagine allineata con il testo inserito con l'istruzione
<IMG SRC="citta.jpg" ALIGN="RIGHT">
Come secondo esempio si può visualizzare nuovamente la stessa immagine con gli attributi:
<IMG SRC="citta.jpg" BORDER="10" WIDTH="180" HEIGHT="80">
che la formattano a dimensioni obbligate di 180x80 punti mostrando un bordo di 10 punti intorno.
L'utilizzo dei parametri WIDTH ed HEIGHT comporta naturalmente una riscalatura dell'immagine originaria, indipendentemente dalla sua effettiva risoluzione. Se non volete nessun bordo potete inserire
BORDER="0". Se non viene specificato altrimenti tramite il desiderato
allineamento, l'immagine viene inserita nel testo esattamente nel punto in cui appare il comando IMG, disponendo il testo ai suoi lati. Nel caso in
cui il file dell'immagine non sia disponibile o ci sia un errore nel listato HTML, il browser può cercare di avvertire che c'è un'immagine non riconosciuta visualizzando:
 |