Photoshop è un ottimo strumento per la creazione di prototipi di siti web. Quando è il momento di distribuire il mockup , sarebbe bello semplicemente fare clic su un pulsante e prendere il vostro prototipo vivo . Tuttavia, Photoshop è rigorosamente un programma di grafica , senza capacità di HTML. Fortunatamente, esportando il tuo mockup in un formato grafico Web -friendly come JPEG o GIF , e la costruzione di una pagina Web che utilizza questi elementi è semplice. Tenete a mente che è necessario fare un lavoro supplementare sul lato HTML per creare i componenti interattivi come i collegamenti, i menu e pop-up . Le possibilità di interazione sono infinite , così perfezionare i tuoi HTML e CSS . Cose che ti serviranno
Photoshop ( qualsiasi versione ) per HTML Editor
Browser Web
Mostra più istruzioni
Basics
1
aprire il tuo mockup in Photoshop ed esportarlo in un formato di immagine web-friendly . Scegliere " Salva per Web e dispositivi" dal menu " File " . Nella finestra di dialogo selezionare un formato di file , come JPEG, GIF o PNG e di scegliere una qualità d'immagine .
2
Fare clic su "Salva" e un nome al file (ad esempio , myMockup.jpg ) per
3
Aprite il vostro editor HTML e di creare un nuovo file HTML . Editor HTML come Dreamweaver creerà la pagina Web scheletro per voi .
4
Aggiungi un tag di immagine all'interno dell'elemento
della tua pagina web . Il tag immagine avrà un aspetto simile :
5
Salvare il file HTML , quindi caricare in qualsiasi browser Web
< br . >