Home Page Indietro


Pagina 8: Immagini in HTML

E' relativamente facile inserire un immagine all'interno di un documento web. Le immagini sono solitament in formato GIF o JPEG al fine di assicurare la compatibilità con gli altri browser. Il formato GIF è quello maggiormente usato su Internet, seguito dal formato JPEG.

Il comando base per inserire immagini all'interno di una pagina web è:

<IMG SRC="URL">


Questo codice inserisce un'immagine contenuta nel file che può essere trovato all'indirizzo URL specificato.

Ad esempio la linea di codice che inserisce il pallino blu è

<IMG SRC="images/BLUEBALL.GIF">

Un consiglio su come specificare gli URL per l'inserimento delle immagini

Quando si inserisce un'immagine bisogna essere in grado di specificare la locazione del file che la contiene. Ciò significa che da qualsiasi parte il file HTML si trovi bisogna essere in grado di indicare dove si trova l'immagine.

Ad esempio:

I file HTML su cui stiamo lavorando sono nella directory pdcourse. Per inserire un immagine che si trova nella directory images, il tag che abbiamo usato è il seguente

<IMG SRC="images/IMAGENAME.GIF">

dove IMAGENAME.GIF viene sostituito con il nome dell'immagine che si vuole appaia.


Gestire il tag di immagine

In realtà è possibile usare il tag di immagine in modo da forzare le immagini ed il testo a funzionare come vogliamo. Se vi sentite di avere già confidenza leggete pure ora, se invece state ancora imparando tornate più tardi.


Il vostro lavoro

  1. Ritornate all'Editor HTML.

  2. Scegliete Close dal menu File per chiudere INTEREST.HTM

  3. Scegliete Open dal menu File per aprire INDEX.HTM.

  4. Ci sono alcune immagini per voi all'interno della directory images per fare alcune prove. Usatele tranquillamente per inserire immagini all'interno del vostro documento originale. Come punto di partenza provate ad inserire l'immagine SMILEY.GIF nel vostro lavoro.


Visualizzare il vostro documento

  1. Ritornate alla finestra del browser che state usando come spazio di lavoro.

  2. Scegliete Open File dal menu File del browser. Cercate il vostro file ed apritelo.

  3. Ora dovreste vedere il vostro documento all'interno della finestra spazio di lavoro.

Per vedere un esempio di come dovrebbe apparire il vostro documento guardate questo esempio.