Come progettare siti web utilizzando Adobe Photoshop

December 25

Come progettare siti web utilizzando Adobe Photoshop


Anche se i progettisti di solito uso di Photoshop per creare opere d'arte e immagini del prodotto, il programma può anche essere usato per progettare pagine web. Non supporta la creazione effettiva di HTML o CSS, ma fornisce gli strumenti per rendere gli elementi grafici della vostra pagina e pianificare l'aspetto della pagina. Esso fornisce anche uno strumento di salvataggio che ottimizza specificamente le immagini per Internet.

istruzione

1 Creare un nuovo progetto in Photoshop. Le dimensioni del nuovo progetto dovrebbe essere quello della tua pagina web. Scegliere una dimensione pagina web che è conforme a una risoluzione dello schermo di uso comune. Bare in mente che la tua pagina web sarà accessibile ai computer con una varietà di risoluzioni dello schermo, però, in modo da assicurarsi che si progetta la tua pagina in modo che sia almeno accessibile per piccole risoluzioni.

2 Fare clic sullo strumento Selettore colore sulla barra degli strumenti e selezionare un colore di sfondo per la vostra pagina web. Quindi selezionare lo strumento riempimento e cliccare sul progetto. Il progetto sarà ora riempire con il colore di sfondo.

3 Vai al menu Livelli e selezionare Nuovo livello. Creare eventuali caselle di testo, tabelle e altri campi di colore su questo livello.

4 Selezionare lo strumento Testo dalla barra degli strumenti e fare clic su uno dei campi di colore. Aggiungere qualsiasi testo, si desidera essere nella tua pagina web. È possibile regolare lo stile e la dimensione del testo attraverso un menu in alto a sinistra di Photoshop. Assicurarsi di aggiungere un titolo nella parte superiore della pagina in un grande carattere.

5 Vai al menu Livelli e selezionare nuovamente nuovo livello. Utilizzare questo nuovo livello per aggiungere le immagini e gli elementi grafici di altri alla tua pagina web. Un bel logo per il titolo principale contribuirà a abete rosso in su. Per aggiungere immagini alla tua pagina web, importarli in Photoshop tramite il menu File. Selezionare ciascuna immagine con lo strumento di selezione rettangolare e fate clic destro sull'immagine. Selezionare Copia dal menu a discesa. Vai al tuo file di pagina web e selezionare Incolla dal menu Modifica. È possibile fare clic e trascinare l'immagine in qualsiasi parte del vostro progetto.

6 Selezionare lo strumento Slice dalla barra degli strumenti. I cordoni strumento sezione off blocchi della vostra immagine e lo taglia in una serie di immagini più piccole. Questo è utile se si desidera avere un disegno unitario nella tua pagina web, ma con alcune parti che servono come pulsanti per i collegamenti.

7 Vai al menu File e selezionare Salva con nome. Salvare il progetto come file .psd. Questo è nel caso in cui si desidera tornare indietro e fare le regolazioni dopo aver effettuato la vostra pagina web.

8 Vai al menu Livelli e selezionate Unisci visibili. Tutti i livelli saranno fusi in un unico.

9 Vai al menu File e selezionare Salva per Web. Selezionare il tipo di immagine che si desidera utilizzare nella tua pagina web, preferibilmente sia .jpeg o .gif. Fare clic su Save. Photoshop ora tagliare la vostra immagine di salvare ogni sezione come immagine unica in una cartella dedicata al progetto. È quindi possibile caricare ogni immagine in un editor di pagine web, di rimontare le fette in un tutto unitario. È quindi possibile programmare le singole sezioni di agire come pulsanti di collegamento.