If you use Fireworks to comp your web designs, you probably have worked often with the program's export option that generates both images and HTML code for use in an HTML editor like Dreamweaver. Fireworks creates the table-based layout and slices and arranges the images according to the settings you configure in the Export dialog box.

Although this has been a reasonable way to work, sometimes the table structure that Fireworks exports is complex, making editing very difficult for those in charge of updating page content. Moreover, with the advent of web standards, many designers follow a different method—one that uses CSS and best practices to create attractive and efficient pages with enhanced accessibility. This three-part tutorial guides you through the complete process of using Fireworks and Dreamweaver to produce web standards pages.

In Part 1, you will work in Fireworks to create the design, organize the layers, make the slices, and export them to a defined site. In Parts 2 and 3, you will work in Dreamweaver to build a CSS-based layout that entirely eschews the use of tables. To get started, download the sample ZIP file for this tutorial. . .