HTML

• PAGINA PRINCIPALE [P]

Minicorso per alunni - 7

LE IMMAGINI

Le immagini inserite nelle pagine Internet sono normalmente di due tipi o formati: GIF o JPG.
I due nomi si riferiscono a semplici abbreviazioni di termini inglesi:

Tutte le immagini hanno un nome e un formato. Per esempio, se l'immagine si chiama "girasole.gif", il nome dell'immagine è "girasole", mentre il suo formato ".gif".

Quale utilizzare tra i due formati grafici? È meglio usare il formato JPG per inserire fotografie e in generale immagini con molti colori e sfumature, mentre il formato GIF è più adatto a disegni e immagini con pochi colori e poche sfumature.

Oltre ad avere un nome, le immagini hanno anche una loro grandezza che si misura in Kb, cioè Kilobyte. È come se si trattasse di un "peso" delle immagini, che invece di essere espresso in Kilogrammi è espresso nell'unità di misura dei Kb.
Il peso in Kb delle immagini è molto importante perchè più è alto (quindi più l'immagine "pesa"), più è lenta la navigazione sul tuo sito.
Chi verrà a vedere la tua pagina su Internet dovrà aspettare che il suo browser "legga" le immagini che tu avrai inserito... se tu avrai scelto immagini troppo pesanti il tuo visitatore potrebbe stufarsi di aspettare e andarsene, e sarebbe davvero un peccato!

Inserire un'immagine è molto semplice, basta utilizzare un nuovo tag:

Abbiamo utilizzato il tag img che richiama con src l'immagine "mulino.jpg".
Basta questo per inserire l'immagine dei girasoli nella tua pagina.>
Il file "girasole.jpg" deve essere presente nella stessa cartella del file "index.html". Se così non fosse devi richiamare l'immagine seguendo il suo percorso sul tuo computer. Per esempio, se l'immagine è presente in un'altra cartella di nome "immagini", il tag verrà scritto in questo modo:

Inseriamo il nuovo tag nella nostra pagina e osserviamo il risultato:
tag da inserire - <img src=“mulino.jpg”>

[D]

Se volete inserire altre immagini andate su internet, cercate e salvate nella nostra cartella ricordandovi (scrivendovi) il nome del file

Le immagini possono avere un testo di commento, che apparirà quando la freccetta del mouse starà ferma su di loro.

Per creare un commento alle immagini devi inserire l'attributo “title”:

<title> contiene tra virgolette il commento, che puoi sostituire con quello che preferisci.

Questo è il risultato.

[D]

Altro parametro importante è “alt”, che serve a visualizzare un testo descrittivo dell’immagine in caso la stessa non può, per qualche motivo, essere caricata e quindi visualizzata.

Se aggiungiamo la larghezza e l’altezza dell’immagine all'interno del tag, il caricamento sarà più veloce. Per farlo è sufficiente aggiungere all'interno del tag img src anche gli attributi “width” (larghezza) e “height” (altezza):

I valori della larghezza e dell'altezza non sono espressi in centimetri, ma in pixel, che è l'unità di misura più usata nella grafica fatta col computer.