Home Page Indietro


Pagina 8 (extra) : Gestire il tag di immagine

Siete sicuri di voler leggere questa pagina ora?? Se state ancora imparando ritornate più tardi. Se invece sentite di avere già confidenza leggete pure ora!


Ci sono altri attributi di seguito descritti che possono essere usati con il tag di immagine.


L'attributo ALT

L'attributo testo ALTernativo permette di definire un testo alternativo all'immagine. Questo serve per coloro che hanno a disposizione dei browser solo testuali oppure hanno disattivato la visualizzazione delle immagini, in questo modo il testo viene inserito al posto dell'immagine. L'attributo ALT viene ignorato da un normale browser grafico con visualizzazione delle immagini attivata.

Si dovrebbe sempre usare l'attributo ALT con il tag di immagine in quanto molte persone navigano nel WWW con la visualizzazione delle immagini disattivata.

Alcuni esempi sono:

<IMG SRC="URL" ALT="Tavola1">
<IMG SRC="URL" ALT="*">
<IMG SRC="URL" ALT=" ">


L'ultimo esempio lascia semplicemente uno spazio al posto dell'immagine. Se l'attributo ALT non viene usato il testo [IMAGE] viene sostituito all'immagine.


Gli attributi WIDTH e HEIGHT

Usando gli attributi WIDTH e HEIGHT con il tag immagine è possibile modificare le dimensioni dell'immagine. E' necessario prestare attenzione a questi attributi in quanto l'immagine potrebbe risultare indesideratamente distorta. Se si desidera modificare le dimensioni dell'immagine è meglio usare un programma per l'elaborazione delle immagini per ridimensionarla.

Il codice è il seguente:

<IMG SRC="URL dell'immagine" WIDTH=165 HEIGHT=134>


I valori inseriti per WIDTH e HEIGHT dovrebbero essere in pixel o percentuali.


L'attributo ALIGN

Quando si inserisce un'immagine, il testo viene automaticamente allineato alla fine dell'immagine. Per allinearlo in centro, in alto, a sinistra o a destra si usi il comando: ALIGN=MIDDLE, ALIGN=TOP, ALIGN=LEFT o ALIGN=RIGHT.

Ad esempio:

<IMG SRC="URL" ALIGN=TOP>


Gli attributi VSPACE e HSPACE

Quando si inseriscono immagini con del testo intorno (usando l'attributo ALIGN), talvolta sia avrà la necessità di inserire dello spazio ulteriore tra l'immagine ed il testo. E' possibile farlo usando l'attributo VSPACE=n (per lo spazio verticale) e l'attributo HSPACE=n (per lo spazio orizzontale).

Ad esempio,

<IMG SRC="URL" VSPACE=n HSPACE=n>


dove n rappresenta un valore in pixel.


L'attributo BORDER

Quando si usano le immagini come link appare un bordo colorato attorno all'immagine per indicare che è un link. Per eliminare il bordo si può usare l'attributo BORDER=0. Allo stesso modo se si desidera aumentare la dimensione del bordo è possibile usare ad esempio BORDER=10.


Riassunto dei tag:

<IMG SRC="URL" ALT="testo alternativo" WIDTH=n HEIGHT=n ALIGN=TOP|MIDDLE|LEFT|RIGHT HSPACE=n VSPACE=n BORDER=n>

ATTRIBUTo Descrizione Commenti
SRC="URL" Indirizzo del file di immagine. Il tipo di formato dei file immagine più diffuso è GIF.
ALT="testo alternativo" Testo da visualizzare in sostituzione dell'immagine. Non tutti i browser supportano le immagini (es. Lynx su Unix) quindi è buona norma inserire testo alternativo alle immagini.
WIDTH=n HEIGHT=n Indica la larghezza e l'altezza dell'immagine. Assicura che il testo venga caricato prima dell'immagine.
ALIGN=TOP|MIDDLE|LEFT|RIGHT Posizione del testo rispetto all'immagine. E' talvolta utile posizionare il testo e l'immagine esattamente come si desidera.
VSPACE=n HSPACE=n Spazio Verticale e Orizzontale intorno all'immagine. Si usi questo attributo insieme ad ALIGN quando si desidera creare uno spazio ulteriore tra l'immagine ed il testo.
BORDER=n Determina la dimensione del bordo attorno all'immagine. Usando BORDER=0 il bordo attorno all'immagine viene rimosso.


A questo punto potreste ritornare a modificare il vostro file INDEX.HTM per utilizzare alcuni di questi attributi.