In questa maniera l'immagine foto.jpg diventa un collegamento a index.htm, cioè cliccando sopra l'immagine
si aprirà la nuova pagina Web Index.htm. Se avete provato l'esempio avrete notato intorno all'immagine c'è un bordo
colorato che non ha a che fare con l'immagine: questo indica che l'immagine è un collegamento. Esiste la
possibilità comunque di eliminarlo scrivendo:
In questa maniera avete eliminato il bordo. Adesso possiamo parlare della mappatura.
Mappare significa che alcune parti dell'immagine, se non tutte, sono collegamenti ad altri siti o a pagine Web.
Questo significa che potete attivare più collegamenti con un'immagine sola. Ma vediamo come si fà:
Alla nostra immagine aggiungiamo la dicitura USEMAP in cui inseriamo il nome che
vogliamo dare alla nostra mappa preceduto dal simbolo #. A questo punto in un'altra parte del documento, che non deve essere
necessariamente quella subito dopo il TAG dell'immagine, dobbiamo inserire le coordinate della mappatura e quindi scrivere il TAG MAP con l'attributo NAME
per dare il nome alla mappa (nel nostro
caso foto), dopo di che si aggiungono le coordinate dell'area utilizzata come collegamento, che può
essere un rettangolo, un cerchio, o un poligono, nel primo caso bisogna mettere
le due coordinate dell'angolo sinistro alto (prima le X e poi le Y), poi quelle dell'angolo destro basso. Per il cerchio
invece bisogna inserire le coordinate del centro del cerchio e dopo il diametro in pixel. Infine
la poligonale serve per le figure irregolari, e allo stesso modo dei rettangoli e dei cerchi bisogna
inserire tutte le coordinate sempre prima le X e poi le Y. Fatto questo bisogna
inserire l'attributo HREF con il collegamento al documento HTML da raggiungere, nel nostro caso l'area
del rettangolo porta a INDEX.HTM, il cerchio porta a HTML.HTM, e il poligono porta a
HOUSE.HTM.
Ora sapete anche mappare le immagini, ma voglio dare alcuni consigli
utili; prima cosa ridurre le dimensioni in byte delle immagini, cosa molto
utile per farle caricare più velocemente su internet. Se avete un'immagine molto colorata e con una
buona definizione l'unica soluzione è utilizzare il formato JPG, mentre se la risoluzione
è bassa è consigliabile utilizzare GIF; inoltre in molti software di grafica c'è la possibilità
di contare i colori e ridurli al minimo per poi salvarli in formato GIF.
Inoltre un'altra possibilità è quella di aumentare la compressione del formato JPG. Questo
diminuisce la risoluzione ma anche i Byte: è da valutare come risulta poi l'immagine
alla fine. (rapporto QUALITA/COMPRESSIONE dell'immagine)
Altre possibilità che si hanno è di inserire immagini con sfondo trasparente, e immagini
animate che ormai sono frequentissime nei siti di tutto il mondo. Per le prime basta cercare nei programmi di
grafica la dicitura SELECT TRASPARENT PALETTE o altre frasi simili, selezionare questa opzione e ottenere così
l'effetto desiderato. Per le immagini animate invece ci sono particolari software
che le creano; basta avere un'immagine in formato GIF e dopo aggiungere l'animazione
che può essere già pronta sul software o la puoi direttamente gestire tu.
Un mio consiglio è quello di aggiungere immagini ma senza esagerare perchè rende lento il caricamento del sito,
l'utente si stanca di aspettare e il risultato sono ... pochi visitatori. Consiglio inoltre di non eccedere nell'inserimento di
immagini animate altrimenti la concentrazione viene fissata
sulle immagini e non sul contenuto effettivo del vostro sito.