Preview HTML Documents on a Cellphone, Tablet, or Laptop in Dreamweaver
How to Remove Unwanted Formatting from Your Website
How to Edit New Pages with Dreamweaver

Editing Images in Dreamweaver MX 2004

New features in Dreamweaver enable you to make minor image editing inside Dreamweaver, without opening Fireworks or any other graphics-editing program. These tools are available from the Properties inspector, when an image is selected.

You also find two buttons that enable you to use Macromedia Fireworks to edit images. The Edit button launches Fireworks and opens the selected image in the main window of the program, which makes using all the Firework editing features easy. Macromedia's careful integration of these programs means that when you save changes to the image, they are reflected in the page in Dreamweaver. A new button, just to the right of the Edit button, is designed to make optimizing an image fast and easy, which makes downloading faster.

Before you get carried away editing your images, remember that Dreamweaver is primarily a Web page creation application and not really designed to edit graphics. Although these tools can be useful, they shouldn't take the place of doing serious work on your graphics in an actual graphics application, such as Fireworks or Photoshop.

When you do use the tools for cropping, adjusting brightness and contrast, and sharpening an image, beware that you are changing the actual image (not just a copy of it). Make sure you're happy with these changes before you save the page you're working on. You can use the undo feature in Dreamweaver to revert back several steps, but after you save the page, you can't undo changes to an image. To protect your original image, considering saving a copy before editing it.

Cropping an image

Essentially, cropping an image is trimming it. To crop a graphic or photo, follow these steps:

1. In the Document window, select the image you'd like to crop by clicking it.

The Properties inspector changes to display the image's properties.

2. From the Edit icons, click the Crop tool.

A dialog box appears warning you that cropping changes the original image.

Don't make the change if you're concerned about needing to keep the entire image available. If you're concerned, the best thing to do may be to make a copy of the image and apply your cropping to the copy.

3. Click OK.

A dotted line with handlebars appears in the image.

4. Outline the area of the image you want to keep with the handlebars.

Any part of the image that is darkened is deleted when the crop completes.

5. Double click inside the box, or press Enter.

The image is cropped.

You can undo cropping by choosing Edit --> Undo, but remember that, after you save the page, changes permanently apply to the image and cannot be undone.

Adjusting brightness and contrast

Adjusting an image's brightness allows you to change the overall amount of light in an image. Contrast controls the difference between the light and dark areas of an image. To adjust brightness and contrast, follow these steps:

1. In the Document window, select the image you want to alter.

The Properties inspector shows the image properties.

2. From the Edit tools, click the Brightness and Contrast icon (a circle with light and dark halves).

A dialog box appears, indicating that changes you make are made to the original file.

3. Click OK.

The Brightness/Contrast dialog box appears.

4. Adjust the brightness and contrast settings of the image with the sliders.

Make sure to select the Preview check box if you want to see the changes affect the image as you move the sliders around.

5. Click OK.

The settings take effect permanently when you save the page.

Sharpening an image

When you apply sharpening to an image, you increase the distinction between areas of color. The effect can be one of increased definition to the shapes and lines in an image. To sharpen an image, follow these steps:

1. In the Document window, select the image you want to sharpen.

The Properties inspector shows the image properties.

2. From the Edit tools, click the Sharpen icon (a blue cone).

A dialog box appears, indicating that your change is made to the original file.

3. Click OK.

The Sharpen dialog box appears.

4. Adjust the sharpness of the image with the slider.

Make sure you select the Preview check box if you want to see the changes affect the image as you move the slider.

5. Click OK.

The image is sharpened and changes are made permanently when you save changes to the page.

blog comments powered by Disqus
How to Upload Your Website with Dreamweaver
How to Apply CSS3 Effects and Transforms in Dreamweaver
Create a New Style Sheet in the CSS Styles Panel
How to Add a DOCTYPE in Dreamweaver
How to Transfer Files to Your Website with Dreamweaver
Advertisement

Inside Dummies.com