Quando crei grafica bitmap in Adobe Photoshop per l’uso in linea, puoi impostare le tue immagini in modo che siano correlate agli URL che si collegano all’interno o all’esterno di un sito web. Sebbene Photoshop non sostituirà un’applicazione di sviluppo di siti Web a tutti gli effetti, è pienamente in grado di fornirti le immagini e il codice HTML necessari per un punto attivo cliccabile all’interno di un design generale del sito. Dopo aver creato la grafica con collegamento ipertestuale in Photoshop, incorporala in un sito Web di un cliente o di un’azienda.
1
Premere “C” per selezionare lo strumento Slice. Scegli uno stile di sezione nella barra delle opzioni. Nella modalità Normale predefinita, fai clic e trascina sull’area dell’immagine del documento per creare sezioni. Immettere le proporzioni numeriche per creare un rapporto altezza-larghezza per lo stile Proporzioni fisse. Tieni presente che questi valori non rappresentano le dimensioni effettive. Per inserire misure di fetta specifiche, scegli lo stile “Dimensione fissa”.
2
Fare clic e trascinare sul documento per creare sezioni. Se hai aggiunto regole guida alla tua immagine, fai clic sulla casella di controllo “Sezioni da guide” nella barra delle opzioni in modo che Photoshop crei automaticamente sezioni seguendo le tue guide.
3
Premere “Shift-C” per passare allo strumento Slice Select. Poiché è nidificato con lo strumento Sezione e condivide la stessa scorciatoia da tastiera, è necessario utilizzare un tasto modificatore per passare da uno strumento all’altro.
4
Fare doppio clic sulla sezione a cui si desidera assegnare l’URL, aprendo la finestra di dialogo Opzioni sezione. Digita o incolla l’URL nel campo di immissione dati dell’URL, utilizzando il formato URL relativo o completo. Un URL relativo carica una posizione all’interno del sito che contiene il collegamento. Un URL assoluto inizia con “http: //” e include il collegamento completo a una pagina, che di solito viene caricata da un altro sito web.
5
Specificare una posizione di caricamento della pagina nel campo di immissione Target. Per aprire una nuova finestra del browser per la pagina che stai caricando, inserisci “_blank” senza virgolette. Per sostituire il contenuto della pagina corrente con la nuova pagina, immettere “_self” senza virgolette.
6
Genera il codice HTML che sta alla base del link che hai aggiunto. Apri il menu “File” e scegli “Salva per Web e dispositivi” per accedere alle funzionalità di ottimizzazione ed esportazione di Photoshop. Dopo aver scelto le impostazioni di output dell’immagine e aver fatto clic sul pulsante “Salva”, si accede alla finestra di dialogo Salva ottimizzato con nome. Imposta il formato per includere HTML nell’esportazione di file e seleziona le opzioni HTML.