August 12 2008
Website webpage design
Website webpage design with Dreamweaver
Many webpage designers choose to use Dreamweaver for the actual HTML coding of their web sites and some do all of their coding by hand. Most tend to use a combination of both, because why spend extra time hand coding when you can use some of the excellent features that Dreamweaver has to offer.
Not a clunky coding monster like FrontPage (reborn, but still cumbersome, as ExpressionWeb), Dreamweaver offers a lot of great building shortcuts. The first we’re going to go over is the integration of Dreamweaver and Adobe Photoshop, the preferred design tool of the best website designers.
Let’s say you’re in Dreamweaver and you realize that you want to make changes to the image you placed in the design. Here’s a quick way to do that:
- Click on the image you want to change.
- Now, take a look at your PROPERTIES (WINDOW - PROPERTIES). You should see the Photoshop icon (see red circle below). NOTE: you must have Dreamweaver set up to indicate that Photoshop is your default program to use for editing graphics.
- The image you wanted to edit will open in Photoshop, allowing you to do your editing quickly.
- Save your image using the SAME file name and in the same location. Let’s say we wanted to make the image smaller. Using Photoshop, change the image size to 300×200 and save the image.
- Go back to Dreamweaver and select the image you just edited. The image will look pixelated due to the recent resizing. Take a look at your PROPERTIES and click on the ADJUSTMENT icon by the image dimensions:
- Dreamweaver resized the image to it’s new size. Same your file and upload.
Now, it is possible to make these changes without the shortcuts listed above, but this does assist in speeding up the process and shows just how nicely Dreamweaver and Photoshop can integrate with one another.
