1. The Web Collection Standard CS3 Revealed
CHAPTER 1: INTEGRATING ADOBE CS3 WEB STANDARD

2. Chapter Lessons Insert a Fireworks image into a Dreamweaver document
Edit a Fireworks image from a Dreamweaver document
Create a Fireworks image and import it into Flash
Insert and edit a Flash movie in Dreamweaver
The Web Collection Standard CS3 Revealed

3. Introduction Adobe CS3: suite of integrated Web development products
Dreamweaver, Flash, Fireworks
Products can integrate easily with each other
Products have common features and interface elements
The Web Collection Standard CS3 Revealed

4. Insert a Fireworks Image
In this lesson, you will:
Insert a Fireworks image into a Dreamweaver document
The Web Collection Standard CS3 Revealed

5. Placing a Fireworks Image into Dreamweaver
Ways to place PNG, JPEG, and GIF images created in Fireworks directly into a Dreamweaver document
Use Image command on Insert menu
Export an image from Fireworks into a Dreamweaver site folder
The Web Collection Standard CS3 Revealed

6. Placing a Fireworks Image into Dreamweaver
Exporting an image to Library folder allows you to insert the image as a library item
Export command on File menu in Fireworks
When you export an image file as an image only, one file (.jpg or .gif) is created
The Web Collection Standard CS3 Revealed

7. Fireworks as the Primary External Image Editor
You can import a Fireworks image into a Dreamweaver document
You can edit a Fireworks graphic by launching Fireworks from within Dreamweaver
The Web Collection Standard CS3 Revealed

8. Fireworks as the Primary External Image Editor
Fireworks must be set as the primary external image editor for GIF, JPEG, and PNG files in Dreamweaver
Preferences dialog box in Dreamweaver
The Web Collection Standard CS3 Revealed

9. Using Design Notes Design Notes file (MNO)
Contains information about the original source file (PNG or FLA) that created the exported file
Allows access to the source file for editing
Save Fireworks source PNG file and exported files in a Dreamweaver site
The Web Collection Standard CS3 Revealed

10. FIGURE 1: Contents of a Design Notes file
Using Design Notes
Source filename
FIGURE 1: Contents of a Design Notes file
The Web Collection Standard CS3 Revealed

11. Specifying Launch and Edit Preferences
Use the Fireworks Preferences dialog box
Always Use Source PNG
Automatically launches Fireworks PNG file
Never Use Source PNG
Automatically launches the exported Fireworks image
The Web Collection Standard CS3 Revealed

12. Specifying Launch and Edit Preferences
Ask When Launching
Allows you to specify whether or not to launch the source PNG file
The Web Collection Standard CS3 Revealed

13. Specifying Launch and Edit Preferences
FIGURE 4: Fireworks Preferences dialog box
The Web Collection Standard CS3 Revealed

14. Setting up the Dreamweaver Site
FIGURE 2: File structure for a Web site
The Web Collection Standard CS3 Revealed

15. Edit a Fireworks Image From Dreamweaver
In this lesson, you will:
Edit a Fireworks image from a Dreamweaver document
The Web Collection Standard CS3 Revealed

16. Editing a Fireworks Image from Dreamweaver
Select image in the Dreamweaver document
Click Edit Fireworks in Property inspector
Fireworks is launched
Image appears in an edit window
The Web Collection Standard CS3 Revealed

17. Editing a Fireworks Image from Dreamweaver
Make your changes
Click Done to return to Dreamweaver document
To make quick export changes
Use Optimize Image in Fireworks command to display the Optimize dialog box
The Web Collection Standard CS3 Revealed

18. Editing a Fireworks Image from Dreamweaver
Edit Fireworks button
FIGURE 12: Edit Fireworks button in the Property inspector
The Web Collection Standard CS3 Revealed

19. Create a Fireworks Image and Import it into Flash
In this lesson, you will:
Insert a Adobe Flash movie into a Dreamweaver document
Edit a Adobe Flash movie within Dreamweaver
The Web Collection Standard CS3 Revealed

20. Create a Fireworks Image and Import it into Flash
Flash allows you to import Fireworks PNG files directly into a Flash document
Advantage: Fireworks layers can be imported as Flash layers
This allows you to edit individual parts of an image, such as animating text or using a photograph to create a button
The Web Collection Standard CS3 Revealed
Chapter 1 20

21. Create a Fireworks Document and Import it into Flash
Open Flash
Make sure layer to which you import is not hidden
Click Import on the File menu
Import to stage or Import to Library
Select the file to import
The Import Fireworks Document dialog box opens with many options
Click OK when done
The Web Collection Standard CS3 Revealed
Chapter 1 21

22. Click to keep all text editable
Create a Fireworks Document and Import it into Flash
Click to keep all text editable
The Web Collection Standard CS3 Revealed
Chapter 1 22

23. Insert and Edit a Flash Movie in Dreamweaver
Flash movies can be inserted into Dreamweaver
Set the insertion point where you would like the movie to appear
Use the Media command on the Insert menu
Choose the .swf file that you would like to insert
You may need to copy the file to the root folder
A placeholder will appear (not the movie itself)
The Web Collection Standard CS3 Revealed
Chapter 1 23

24. Insert and Edit a Flash Movie in Dreamweaver
You can use the Property inspector to complete the following:
Edit the Flash movie
Play and stop the Flash movie
Set width and height dimensions
Cause the movie to loop
Reposition the placeholder in the document window
The Web Collection Standard CS3 Revealed
Chapter 1 24

25. Insert and Edit a Flash Movie in Dreamweaver
The Web Collection Standard CS3 Revealed
Chapter 1 25

26. Chapter 1 Tasks Insert a Fireworks image into a Dreamweaver document
Edit a Fireworks image from a Dreamweaver document
Create a Fireworks image and import it into Flash
Insert and edit a Flash movie in Dreamweaver
The Web Collection Standard CS3 Revealed