webdesigners worden gebruikt om het ontwerpen van hun website mockups op Photoshop . Als u nodig hebt om uw mockup te converteren naar een live website , zullen sommige HMTL en CSS vaardigheden nuttig zijn . Als u nodig hebt om uw mockup exporteren in uw ontwikkeling software of platform, zoals Dreamweaver Joomla , kunt u de conversie te maken in een paar stappen . Wat je nodig hebt
Photoshop
Dreamweaver
Toon Meer Aanwijzingen
1 Dubbelklik op uw Photoshop- mockup . Klik op " File " en " Opslaan voor web en apparaten " te exporteren naar een web- vriendelijk formaat . Selecteer een bestandsformaat , zoals JPEG of PNG . Stel een beeldkwaliteit in de opkomende dialoog . Klik op 'Opslaan'. Voer een naam in voor uw imago .
Crop 2 en scheiden van uw achtergrond, concept , schaduw en transparante grens effect , footer en sidebar concepten . Sla ze naar een lokale map . De meeste van hen zijn layout relevant .
3 Ga naar Dreamweaver . Klik op " File " en " Nieuwe HTML-bestand . " Een nieuwe HTML-bestand zal worden opgezet met de belangrijkste kaders zoals header en body sectie . Voer een naam voor het bestand .
4 Maak een CSS- bestand voor de site door te klikken op de " CSS STYLES " op de rechterbovenhoek van Dreamweaver . Klik met de rechtermuisknop in het lege gebied nieuwe CSS- regels maken . Kies "Tag ( herdefinieert een HTML-element ) " uit de Selector Type . Kies " body " en vervolgens " New Style Sheet File . " Klik op " OK " om te beginnen met CSS- bestand te definiëren
5 Importeer uw achtergrondafbeelding en andere concept van elementen in je CSS- code : background : URL ( /images /background.jpg ) ; voettekst : . URL ( /images /footer.jpg ) ; .
|
