October 4
È possibile creare e codificare i layout Web PSD di Photoshop. PSD è il formato di file nativo di Photoshop. Per codificare un PSD per il Web, avviare progettando il layout in Photoshop. Definire le sezioni di pagina Web, come ad esempio l'intestazione, piè di pagina, la barra laterale e pulsanti, con lo strumento Slice, e quindi utilizzare la finestra di dialogo Opzioni sezione di Photoshop per codificare le varie sezioni del layout.
1 Aprire il file PSD di Photoshop che si desidera convertire in un layout Web, o iniziare un nuovo documento di Photoshop facendo clic sul menu "File" e scegliere "Nuovo". Questo apre la finestra di dialogo Nuovo. Fai clic sul menu a discesa "Predefinito", e scegliere "Web". Questo visualizza le opzioni per la creazione di un layout di pagina Web. È possibile scegliere uno dei formati di pagina Web predefiniti dal menu a discesa "Dimensione", oppure definire un formato personalizzato con la "larghezza" e campi di "altezza". Fai clic su "OK".
2 Disporre la pagina Web, se lo desideri. Ad esempio, è possibile creare un'immagine di intestazione nella parte superiore della pagina, così come un menu di navigazione, oppure è possibile creare un menu lungo il lato sinistro della pagina. È inoltre possibile creare un piè di pagina nella parte inferiore della pagina. Le opzioni di design sono quasi illimitate.
3 Selezionare l'opzione "Strumento Slice" nel pannello strumenti. Lo strumento sezione si trova nel menu fly-out Crop Tool. Fare clic e tenere premuto il "strumento Ritaglia," e quindi selezionare "Strumento Slice" dalla comparsa.
4 Tenere premuto il pulsante del mouse e trascinare il "strumento sezione" sopra la prima sezione della pagina Web. Lo strumento sezione fette PSD in sezioni e ogni sezione pone in una tabella HTML. Ad esempio, è possibile creare una sezione per l'intestazione, il piè di pagina, la barra laterale e ciascuna voce il pulsante o il menu.
5 Tagliate il PSD, se lo desideri.
6 Fare clic e tenere premuto il "strumento sezione" nel pannello Strumenti per visualizzare il menu a comparsa, quindi selezionare la "fetta strumento di selezione."
7 Fare doppio clic su una sezione che si desidera codificare. Ad esempio, per creare un pulsante un link cliccabile, fare doppio clic fetta del pulsante. Ciò apre la finestra di dialogo Opzioni sezione.
8 Fare clic nel campo "URL" e digitare la destinazione del link.
9 Fare clic nel "messaggio di testo" campo e digitare un messaggio. Questo è il testo che viene visualizzato quando l'utente passa il cursore del mouse sopra la fetta in un browser.
10 Selezionare il campo "Alt Tag" e digitare il testo alternativo per la fetta. Questo è il testo che visualizza se il browser non riesce a visualizzare l'immagine. Invece, un link di testo che contiene i display di testo alt tag.
11 Ripetere questo processo per ogni sezione che si desidera codificare.
12 Fare clic sul menu "File" e scegliere "Salva per Web e dispositivi." Questo apre la finestra di dialogo Salva per Web e dispositivi.
13 Fai clic su "Salva" per aprire il "Salva ottimizzato come" finestra di dialogo.
14 Fai clic sul menu a discesa "Formato" e scegliere "HTML e immagini", quindi fare clic sul menu a discesa "fette" e scegliere "Tutte le fette."
15 Fai clic su "Salva". Photoshop salva il layout Web PSD a fette come un file HTML e crea file immagine separati per ogni sezione, salvandoli in una sottocartella denominata "immagini".