Web Design Tutorials

Fireworks Web Design Tutorial

Learn how to design you very own web site using Fireworks MX onwards

Fireworks Web Design Tutorial

Learn how to design you very own web site using Fireworks MX onwards

Compatible Versions of Adobe Fireworks for this Tutorial

Fireworks CS3 Fireworks 4-8 | Fireworks CS3
Adobe Fireworks CS4 & above users: If you are using Fireworks CS4+ please note that some features, steps and screenshot images may differ for the above tutorial. Recommended Version: Fireworks CS6
Please note: This page bridges you to our recently released Fireworks Web Design Tutorials as this page's content has been overhauled to give way to our new CSS Web Design Guide. A short synopsis of what the new guide teaches follows.

Learn how to easily design a professional website using Adobe Fireworks and then build it into a CSS website using Adobe Dreamweaver. The cool CSS website we are going to create step-by-step is shown below:

CSS website design with Dreamweaver and Adobe Fireworks

Website Design with Dreamweaver & Fireworks

This CSS website design guide teaches layout design with Fireworks and CSS/XHTML website conversion with Dreamweaver. Learn CSS Web Design by following these simple steps:
  1. Introduction: How to make a Website
  2. Layout Design: Designing the website's layout with Fireworks
    1. Designing the website's header and footer
    2. Designing the website's background and navigation
    3. Placing photos and content into the website's design
  3. Export Images: Slicing and Exporting the website images with Fireworks
  4. Dreamweaver Site: Setting up the website in Dreamweaver
  5. CSS Tutorial: CSS and XHTML website programming with Dreamweaver
  6. CSS Styles: Formatting the web pages using CSS style sheets in Dreamweaver
Please like, +1, link to and share this SmartWebby resource if you found it helpful. Thanks!