Web designer sono utilizzati per progettare i loro siti web mockup su Photoshop . Quando è necessario convertire il mockup di un sito vivo , qualche HTML e CSS competenze saranno utili . Se avete bisogno di esportare il mockup nel vostro software di sviluppo o di una piattaforma come Dreamweaver Joomla , è possibile effettuare la conversione in pochi passaggi . Cose che ti serviranno
Photoshop
Dreamweaver
Mostra più istruzioni
1
doppio clic tuo mockup di Photoshop . Fare clic su "File" e " Salva per Web e dispositivi" per esportarlo in un formato web amichevole . Selezionare un formato di file , come JPEG o PNG . Impostare una qualità di immagine nella finestra di dialogo imminente . Fare clic su " Salva". Immettere un nome per la vostra immagine .
2
Crop e separare il concetto di fondo , ombra e l'effetto bordo trasparente , piè di pagina e concetti barra laterale . Salva in una directory locale . La maggior parte di loro sono layout di rilevante.
3
Vai a Dreamweaver . Fare clic su "File" e "File Nuovo HTML . " Un nuovo file HTML sarà allestito con i telai principali come intestazione e parte del corpo . Immettere un nome per il file .
4
Creare un file CSS per il sito cliccando il " Stili CSS " in alto a destra di Dreamweaver . Pulsante destro del mouse nell'area vuota per creare nuove regole CSS . Scegliere " Tag ( ridefinisce un elemento HTML )" dal selettore del tipo . Scegliere " corpo" e poi "Nuovo file foglio di stile . " Fare clic su " OK " per iniziare a definire file CSS
5
importare la vostra immagine di sfondo e altri elementi concettuali nel codice CSS : background: url ( /images /Background.jpg ) ; piè di pagina : . URL ( /images /footer.jpg ); .