Photoshop Smart Objects in Adobe CS5 Dreamweaver - dummies

By Jennifer Smith, Christopher Smith, Fred Gerantabee

If you’ve created artwork or prepared images in Photoshop, you can place original PSD files directly in your Adobe Creative Suite 5 (Adobe CS5) Dreamweaver pages. The Image Preview window lets you save Photoshop files into web-ready image formats such as GIF, JPEG, and PNG and scale and crop artwork before it’s placed on the page.

  1. Click wherever you want to place the new image.

    Then click the Image object in the Insert panel’s Common category.

  2. The Select Image Source dialog box appears.

    Browse and select a Photoshop PSD file and then click Choose/OK to select the image.

  3. The Image Preview dialog box appears.

    You can optimize, crop, scale, and save your image in the web-friendly GIF, JPEG, or PNG format.

  4. Save your image.

    On the Options tab, select from the Format drop-down list the file format you want to save your image in, and choose from the Quality drop-down list the quality settings that best suit your image.

    You can use the Saved Settings drop-down list at the top of the dialog box to choose an image-quality preset.

  5. (Optional) Click the File tab to switch to the File options.

    Enter settings to scale your image or use the Crop tool at the bottom of the preview window to crop your image.

  6. Click OK to save the image.

  7. The Save Web Image dialog box appears.

    Navigate to your site’s root folder and click OK to save the image in the appropriate folder (for instance, your default images folder).

    If the Image Tab Accessibility Attributes dialog box appears, type a short description of the image in the alternate text field and click OK to place the image.

    The new image is placed and a small icon appears in its upper left corner. This Smart Object indicator shows two green arrows, indicating that the image is up-to-date.

    From the Image Preview dialog box, you can optimize and save a web-ready image from a selected Phot
    From the Image Preview dialog box, you can optimize and save a web-ready image from a selected Photoshop file.