html non è un grossissimo problema.
Ma inserirle nel punto giusto e, soprattutto, fare in modo che esse non interferiscano con il testo è una cosa di primaria importanza.
La sintassi che regola l'immissione di una immagine in un documento è molto semplice ed è regolata, fondamentalmente, da pochi e semplici parametri.
Esempio di img con allineamento predefinito
Esempio di img con allineamento centrato
Esempio di img con allineamento in alto
La sintassi usata per tutte e tre le immagini è sostanzialmente sempre la stessa, ciò che cambia è semplicemente l'allineamento:
HTML
<img src="smile.gif" width=40 height=40 align=xxxx>
Vediamo di capirci qualcosa:
IMG è il nome del tag che indica al browser che abbiamo intenzione di inserire in quel punto una immagine;
SRC è l'unico parametro veramente indispensabile, indica infatti il percorso della pic da visualizzare;
WIDTH ed HEIGHT, sono rispettivamente la larghezza 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 di XXXX va inserito top se la si vuole allineare in alto e middle se la si vuole allineare centrata (ovviamente rispetto al testo). Sostituire le XXXX con bottom per allinearla in basso è superfluo in quanto quello in basso è l'allineamento predefinito pertanto, se sono queste le nostre intenzioni, e possibile omettere il suddetto attributo.
Può capitare che durante la visualizzazione di un'immagine avvenga qualcosa di spiacevole che ne blocchi il caricamento, oppure che le vostre pagine possano essere non viste da qualcuno che, per essere più veloce, ha settato il proprio browser in modo che non carichi le immagini, o, ancora, che le vostre immagini vengano caricate lentamente date le dimensioni "esagerate" (rispettate i visitatori!).
Rendendosi conto di quanto frequenti possano essere i casi sopra elencati è conveniente utilizzare un altro attributo dell'immagine: il comando ALT.
Mediante questo è possibile dare una breve definizione di quello che raffigurerà l'immagine dopo il caricamento. Guardate, ad esempio, cosa accade a questa immagine (volutamente inesistente):
La sintassi per aggiungere un "testo ALTernativo" alle immagini è la seguente:
HTML
<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 è molto importante, specie quando si fa uso di gif trasparenti, aggiungere agli attributi il comando come segue:
HTML
<img src="smile.gif" width=40 height=40 border=0>
Per evitare l'orribile bordino colorato che apparirebbe in caso contrario come in questo esempio:
