Adobe Dreamweaver CC 2014 v.13 - Manual (Page 665)

To the top
Smart Object
When the web image (that is, the image on the Dreamweaver page) is out of sync with the original Photoshop file, Dreamweaver detects that the
original file has been updated, and displays one of the Smart Object icon’s arrows in red. When you select the web image in Design view and click
the Update from Original button in the Property inspector, the image updates automatically, reflecting any changes that you made to the original
Photoshop file.
When you use the Smart Objects workflow, you do not need to open Photoshop to update a web image. Additionally, any updates you make to a
Smart Object in Dreamweaver are non-destructive. That is, you can change the web version of the image on your page while keeping the original
Photoshop image intact.
You can also update a Smart Object without selecting the web image in Design view. The Assets panel lets you update all Smart Objects,
including images that might not be selectable in the Document window (for example, CSS background images).
Image optimization settings
For both the copy/paste and the Smart Object workflows, you can specify optimization settings in the Image Optimization dialog box. This dialog
box lets you specify the file format and image quality. If you are copying a slice or a layer, or inserting a Photoshop file as a Smart Object for the
first time, Dreamweaver displays this dialog so that you can easily create the web image.
If you copy and paste an update to a particular slice or layer, Dreameaver remembers the original settings and re-creates the web image with
those settings. Likewise, when you update a Smart Object using the Property inspector, Dreamweaver uses the same settings you used when you
first inserted the image. You can change an image’s settings at any time by selecting the web image in Design view, and then clicking the Edit
Image Settings button in the Property inspector.
Storing Photoshop files
If you’ve inserted a web image, and have not stored the original Photoshop file in your Dreamweaver site, Dreamweaver recognizes the path to the
original file as an absolute local file path. (This is true for both the copy/paste and Smart Object workflows.) For example, if the path to your
Dreamweaver site is C:\Sites\mySite, and your Photoshop file is stored in C:\Images\Photoshop, Dreameaver will not recognize the original asset
as part of the site called mySite. This will cause problems if you ever want to share the Photoshop file with other team members because
Dreamweaver will only recognize the file as being available on a particular local hard drive.
If you store the Photoshop file inside your site, however, Dreamweaver establishes a site-relative path to the file. Any user with access to the site
will also be able to establish the correct path to the file, assuming that you have also provided the original file for them to download.
For a video tutorial on the Smart Objects workflow in Photoshop and Dreamweaver, see www.adobe.com/go/lrvid4043_dw .
Create a Smart Object
When you insert a Photoshop image (PSD file) into your page, Dreamweaver creates a Smart Object. A Smart Object is a web-ready image that
maintains a live connection to the original Photoshop image. Whenever you update the original image in Photoshop, Dreamweaver gives you the
option of updating the image in Dreamweaver with the click of a button.
658