webdesignere er vant til at designe deres hjemmeside mockups på Photoshop. Når du har brug for at konvertere din mockup til en levende hjemmeside , vil nogle HMTL og CSS færdigheder være nyttige. Hvis du har brug for at eksportere din mockup i din udvikling software eller platform såsom Dreamweaver Joomla , kan du gøre konverteringen i et par trin . Ting du skal
Photoshop
Dreamweaver
Vis Flere Instruktioner
1
Dobbeltklik på Photoshop mockup . Klik på "File " og " Gem til web og enheder " for at eksportere det til en web venlig format. Vælg et filformat som JPEG eller PNG. Indstil en billedkvalitet i den kommende dialog. Klik på " Gem". Indtast et navn til dit billede.
2
Beskær og adskille din baggrund koncept, skygge og gennemsigtigt grænseoverskridende virkning , footer og sidebar begreber. Gemme dem til en lokal mappe. De fleste af dem er layout relevant.
3
Gå til Dreamweaver. Klik på "File " og " New HTML-fil . " En ny HTML-fil vil blive oprettet med de vigtigste rammer såsom header og body-afsnittet . Indtast et navn til filen .
4
Opret en CSS-fil for webstedet ved at klikke på " CSS " i øverste højre hjørne af Dreamweaver. Højreklik på det tomme område til at skabe nye CSS regler. Vælg " Tag ( omdefinerer et HTML -element) " fra Selector Type . Vælg "krop " og derefter " New Style Sheet File ". Klik på "OK " for at begynde at definere CSS-fil
5
Importer dit baggrundsbillede og andre koncept elementer ind i din CSS kode : baggrund : URL ( /images /background.jpg ) footer : . URL ( /billeder /footer.jpg ); .