Dreamweaver &
Fireworks: The Ultimate Creative Tag Team
Home > Build >
Software > Dreamweaver
by
Don Herion
(1) (2)
With the release of Macromedia Dreamweaver/Fireworks 4 Studio,
Web designers have the tools to work more efficiently than ever before. It is
easier to interchange files between the two programs than ever before. These interchangeable
files can include links, image maps, table slices, and more. The advantages of
these two programs working symbiotically are many. You can create graphics with
image maps, slices and tables in Fireworks, then export them to Dreamweaver. In
Dreamweaver, you can then check the download time and if the graphics are too
large or don't fit on your page the way you envisioned, you can edit the graphic
in Fireworks, optimize it, crop it, etc. When you save it, it goes right back
into Dreamweaver.
Tutorial 1
- Importing a Sliced Image into Dreamweaver
I created this image in Fireworks.
It's a title graphic for my new 'Extreme Sports' business I'm thinking of starting.
The file consists of 4 photos, and some text elements. For this project I sliced
it into 5 parts and exported it as html and images.
 |
| Sliced title image |
To insert
the html and image slices into an existing Dreamweaver document, you place an
insertion point where you wish the html table to appear. Now click the 'Insert
Fireworks HTML' icon in the toolbar, pick the .html document and hit OK. The table
and graphics drop into your Dreamweaver document. Below is the outcome.
Another way to import such documents are to do an - Edit
- Copy HTML Code, follow the wizard, then go into Dreamweaver, place the insertion
point and go - Edit - Paste. A third way is to go - File - Export - in Fireworks,
choose - HTML and Images - select - Copy to Clipboard and save. Then go into Dreamweaver,
place the insertion point in Dreamweaver and go - Edit - Paste.
Editing
Fireworks Table
Now that my header has been added to my Web page I decide
to make some fast changes. I want to change the color and size of the letter 'X'
in 'Xtreme' and rearrange my image slices. I select the table containing my graphics
and click the 'Edit' button in the 'Property Bar.'
 |
| Editing tables/images in Dreamweaver and Fireworks |