WMPortal
a- a+

Le Immagini

In linee generali includere immagini in un file html nonè un grossissimo problema.

Ma inserirle nel punto giusto e, soprattutto, fare in modoche esse non interferiscano con il testo è una cosa diprimaria importanza.

La sintassi che regola l'immissione di una immagine in undocumento è molto semplice ed è regolata,fondamentalmente, da pochi e semplici parametri.


Esempio di img con allineamento predefinito

Esempio diimg con allineamento centrato

Esempio diimg con allineamento in alto

 


La sintassi usata per tutte e tre le immagini èsostanzialmente sempre la stessa, ciò che cambiaè semplicemente l'allineamento:

<img src="smile.gif" width=40 height=40 align=xxxx> 

Vediamo di capirci qualcosa:

IMG è il nome del tag che indica al browserche abbiamo intenzione di inserire in quel punto unaimmagine;

SRC è l'unico parametro veramenteindispensabile, indica infatti il percorso della pic davisualizzare;

WIDTH ed HEIGHT, sono rispettivamente lalarghezza e l'altezza in pixel dell'immagine,facilmente deducibili da qualsiasi programma di grafica,nonchè da qualunque browser;

ALIGN definisce l'allineamento, ed al posto diXXXX va inserito top se la si vuole allineare in altoe middle se la si vuole allineare centrata (ovviamenterispetto al testo). Sostituire le XXXX con bottom perallinearla in basso è superfluo in quanto quello inbasso è l'allineamento predefinito pertanto, sesono queste le nostre intenzioni, e possibile omettere ilsuddetto attributo.

Può capitare che durante la visualizzazione diun'immagine avvenga qualcosa di spiacevole che ne blocchiil caricamento, oppure che le vostre pagine possano esserenon viste da qualcuno che, per essere più veloce, hasettato il proprio browser in modo che non carichi leimmagini, o, ancora, che le vostre immagini vengano caricatelentamente date le dimensioni "esagerate"(rispettate i visitatori!).

Rendendosi conto di quanto frequenti possano essere i casisopra elencati è conveniente utilizzare un altroattributo dell'immagine: il comando ALT.

Mediante questo è possibile dare una brevedefinizione di quello che raffigurerà l'immaginedopo il caricamento. Guardate, ad esempio, cosa accade aquesta immagine (volutamente inesistente):
 

img inesistente!


La sintassi per aggiungere un "testo ALTernativo"alle immagini è la seguente:

<img src="pr.gif" alt="img inesistente!"> 

Le immagini possono essere usate anche come"collegamenti" in luogo del semplice testo,già visto nel paragrafo links.

Nell'uso delle immagini come collegamenti è moltoimportante, specie quando si fa uso di giftrasparenti, aggiungere agli attributi il comandoborder=0 come segue:

 

    <img src="smile.gif" width=40 height=40 border=0>

 


Per evitare l'orribile bordino colorato cheapparirebbe in caso contrario come in questo esempio: