Visualizza articoli per tag: sitostatico

Giovedì, 31 Gennaio 2019 09:23

Come generare online una mappa immagine in HTML

Oggi vi spiego come creare una semplice mappa immagine con un generatore online. Il tutorial è rivolto ai webmaster, ed il livello è elementare.

La mappa immagine di questo tipo può essere utile in un semplice sito statico creato in html.

Per prima cosa salvate la seguente immagine che utilizzerò nel tutorial:



Poi collegatevi al seguente sito e cliccate sul pulsante "Select Image from My PC":
https://www.image-map.net/



Selezionate dal computer l'immagine scaricata in precedenza e cliccate su Apri:



L'interfaccia sarà la seguente:




In basso a sinistra è possibile scegliere la forma della selezione (Rettangolare, Poligonale o Circolare):



Con una selezione di tipo Poly è possibile creare un contorno abbastanza preciso in base alle necessità. Per creare la selezione basta cliccare con il mouse seguendo il contorno dell'immagine da collegare ad una pagina web:



A questo punto scrivete nel campo Link il nome o il percorso della pagina html da collegare alla mappa; scegliete un titolo (che comparirà quando si passa con il mouse sopra l'isola) e il target del link tra i seguenti:
 

Valore

descrizione

_blank

Consente l’apertura della pagina in una nuova finestra

_parent

Consente l'apertura della pagina nel frame principale

_self

Consente l'apertura della pagina nello stesso frame

_top

Consente l'apertura della pagine nell'intera finestra del browser (uscendo da tutti i frame)




Per creare ulteriori collegamenti cliccate sul pulsante Add New Area.

Dopo aver "disegnato" la mappa cliccate sul pulsante Show me the code:



Si aprirà una finestra popup con il codice generato da copiare. Selezionatelo e copiatelo su un blocco note:





Salvate il file con estensione .htm per creare una pagina web.



Quando passerete sull'immagine di Vulcano comparirà il titolo che avete impostato in precedenza:


A questo punto non resta che creare una pagina web su Vulcano con il nome vulcano.htm. Cliccando sull'isola si aprirà la pagina web creata:

Seguimi sui social per non perdere i prossimi aggiornamenti:





Sostieni il mio sito con una donazione libera su Paypal cliccando sul seguente pulsante:
 
 

Pubblicato in Webmaster

Richiedi un tutorial

Sostieni il sito

Computermania.org è un sito amatoriale creato da un appassionato di informatica che ha dedicato centinaia di ore di lavoro (soprattutto notturne!), per offrire a tutti articoli e trucchi di qualità e per risolvere i problemi tecnologici quotidiani. Puoi dimostrare il tuo apprezzamento per il lavoro fatto effettuando una piccola donazione su PayPal cliccando sul seguente pulstante GRAZIE! Roberto