Come fare una mappa immagine Utilizzando Photoshop

January 26

Come fare una mappa immagine Utilizzando Photoshop


Quando si fa clic su una parte dell'immagine un sito web e il browser passa a una pagina Web diversa, una mappa immagine è probabilmente responsabile di tale azione. progettisti di siti in grado di scrivere codice HTML che crea punti caldi cliccabili su tutta l'immagine. Costruire mappe di immagini a mano richiede molto tempo perché è necessario identificare le coordinate esatte di ogni hot spot. Con lo strumento sezione in Photoshop, si disegna i punti caldi su un'immagine per generare il codice HTML necessario automaticamente.

istruzione

Crea immagine Mappa

1 Avviare Photoshop e aprire una immagine che si desidera convertire in una mappa immagine. Fare clic e tenere lo strumento "Crop" per visualizzare un menu contenente altri strumenti. Fare clic sullo strumento "fetta" per selezionarlo.

2 Fare clic su un punto all'interno dell'immagine e trascinare lo strumento Slice per disegnare un rettangolo di selezione intorno alla parte dell'immagine che si desidera rendere cliccabile. Photoshop disegna aggiuntivi "sezioni automatiche" intorno ad altre parti dell'immagine. Queste sezioni automatiche assicurano che tutte le parti di un'immagine sono compresi in una fetta.

3 Pulsante destro del mouse all'interno della porzione creata e selezionare "Modifica Opzioni sezione" per aprire la finestra Opzioni sezione. Digitare l'URL che si desidera associare con la fetta. È inoltre possibile sostituire il nome di default che Photoshop ha dato la fetta digitando uno nuovo nella casella di testo "Nome".

4 Fai clic su "OK" per chiudere la finestra Opzioni sezione e tornare all'immagine. Fai clic su un altro punto all'interno dell'immagine e trascinare lo strumento per creare fetta fette aggiuntivi, se necessario.

Regolare Mappa immagine Fette

5 Selezionare la "selezione sezioni Tool" dalla barra degli strumenti e fare clic all'interno di una fetta che si desidera spostare.

6 Tenere premuto il pulsante sinistro del mouse e trascinare la fetta in una nuova posizione.

7 Tenere il cursore del mouse su uno dei bordi del fetta e una linea con le frecce sulla appare ogni estremità. Fare clic su tale linea, tenere premuto il pulsante sinistro del mouse e trascinare il mouse, se è necessario effettuare la fetta più grande o più piccolo.

Salva Immagine Mappa

8 Fai clic su "File", seguito da "Salva per Web" per aprire la finestra Salva per Web.

9 Fai clic su "Preset" e selezionare una delle opzioni del tipo di file che appaiono. Le scelte includono GIF 128 retinato, JPEG e PNG Alto-24.

10 Fai clic su "Salva" per aprire una finestra che visualizza i file e le cartelle dell'unità disco. Passare alla cartella in cui si desidera salvare i file di mappa immagine e digitare un nome per la mappa immagine nella casella di testo Nome file.

11 Fare clic sul menu a discesa "Formato" e selezionare "HTML e immagini." Fare clic su "Salva" per salvare tutti i file nella cartella specificata.

Consigli e avvertenze

  • Photoshop salva ogni fetta come immagine separata in una cartella di immagini. Il programma consente inoltre di risparmiare un documento HTML che ha lo stesso nome come il nome digitato nella casella di testo "Nome file". Se si trova il file HTML in Esplora file e fare doppio clic sul file, il browser si apre e visualizza la mappa immagine. Fai clic su diverse parti della mappa immagine per navigare gli URL assegnati alle fette. Per esempio, se diviso una mappa degli Stati Uniti in stati con la creazione di una fetta per ogni stato, è possibile fare clic uno stato di andare all'URL assegnato a fetta di quello stato.
  • Dare fette nomi significativi e troverete più facile identificare loro se vi capitasse di voler modificare il codice HTML che Photoshop ha generato. Per esempio, se avete creato una fetta che circondava lo stato di Iowa, si potrebbe chiamare la fetta Iowa.
  • Probabilmente si vorrà salvare la mappa immagine immagini nello stesso formato dell'immagine originale. Per esempio, se si tratta di un file JPEG, scegliere una delle opzioni JPEG dal menu a tendina Preset nella finestra Salva per Web. Scegliere "JPEG Low", per esempio, e Photoshop genera immagini JPEG di bassa qualità. La qualità di un'immagine più basso, più velocemente si carica in un browser Web.
  • Questo articolo è applicabile ad Adobe Photoshop CC 2014 versione. Alcuni dati possono variare in altre versioni del software.