Exporting to HTML

Now that we have sliced our image and chosen optimization settings for each slice we are ready to export it to HTML. Fireworks creates an HTML table based on the slices you defined. It then places each slice of the image into a table cell to re-create the full image. Once you have exported your image to HTML you can then open this page in any HTML editing package and create pages or whole sites based on it.

1. Choose File > Export.
   
   The Export window will appear. Choose the following settings:
   File name: Fireworks will give the HTML file the same name as your image document name. You can change this if you like.
   Save as type: HTML and Images
   HTML: Export HTML File
   Slices: Export Slices
   Selected Slices Only: Unchecked
   Include Areas without Slices: Checked
   Put Images in Subfolder: Checked (If you do not check this option Fireworks will save all your slice images at the same level in the folder as your HTML file)
   
2. Choose the Options... button. Leave the General and Table settings unchanged. Choose the Document Specific tab and set the following options:
   
   Click OK
   
3. Click Save.
   Your image has now been saved as an HTML file along with a folder of the sliced images.
   
4. Navigate to the folder you just exported your image to and double-click on the HTML file within it to see the results of your work.
   
   If you would like you can open the exported HTML file with Dreamweaver to view the table that has been created.