2 Replies Latest reply on Feb 13, 2010 3:28 PM by Zabeth69

    What is the best way to import Photoshop CS3 Images into Dreamweaver CS4?


      Stupid noobie me!  Okay I'm made the huge mistake of designing my entire site in Photoshop and then trying to import it into Dreamweaver.  It was okay until I added rollovers, and images, and I quickly noticed that anytime I tried to insert something it would cut my layout to shreads (which would send me into a rage bc I'm a perfectionist).  I've decided to delete as many slices as I can and just keep the ones that contain my thumbnail images and my logo because they are in the far left of my site and kinda out of the way.  Can I actually keep those slices and do the rest in Dreamweaver (like create my staging area for my images and text)?  My next and prob most important question is what is the best way to import images from Photoshop into Dreamweaver?  Do I turn them into Smart Objects or is there another way?  I tried dragging one in Dreamweaver (a JPEG) and there was all this unecessary white space around it that wasnt there before.  I know the answer to all my problems is gonna be "learn code" but I've already wasted a good 2 months working on this thing.  Kill me now.


      Thanx for your replies, please be gentle I'm new with Dreamweaver.

        • 1. Re: What is the best way to import Photoshop CS3 Images into Dreamweaver CS4?
          Ken Binney-GnPIX3 Level 4

          Perhaps you could post a picture of your desired page and we could

          suggest some workable page layout structures to accomodate your content.

          • 2. Re: What is the best way to import Photoshop CS3 Images into Dreamweaver CS4?
            Zabeth69 Level 5

            You have definitely not wasted the past 2 months. You probably know your image inside and out. Turn on the rulers in your image editor and make some measurements that will help when you set up your divs. You can even super-enlarge and get really accurate measures.


            You might want to learn something about the box model at this point: http://help.adobe.com/en_US/Dreamweaver/10.0_Using/WScbb6b82af5544594822510a94ae8d65-7de5a .html


            So, importing images.


            Once you've created jpegs or gifs or pngs...use the slices that you created!...remember that you are not actually 'importing' images, you are creating containers for them (divs) and referring to them, as it were, in your code.


            Insert > Image > Select Image Source dialog box. You can now browse to your image, select it, and in the process save it into the images folder in your site folder. If all your images are going into one images folder, set the images folder up in your site definition, and they will automatically be placed there when you do the Insert > Image thing.


            You don't need Smart Objects (what are those, anyway?), just normal jpegs, gifs, and pngs.


            Now, when you "dragged one in Dreamweaver", did you look at the code when you dropped it in? Maybe not. But get accustomed to checking the code periodically, and you will learn the language more quickly.


            And once you have the basic rules down (how divs operate, how to style them), you will be able to design "on the fly". But it will be with very different skills than you used in Photoshop.


            Have fun! It's not all heartache here...



            1 person found this helpful