I’m going to show you my particular workflow for creating a web layout with Adobe Fireworks, and I’m also going to cover the selection tools. When I get started on a new project, I like to have as much open canvas space as possible. Yet it’s also important to keep what’s going to become your finished product at the correct size for the eventual export.
To get started, click File > New to open the New Document Window. Here is where you set the document size and background color. I’m going to leave the discussion on ideal width for a website for a different post, but for our purposes here we’ll be using a relatively wide fixed-width design. So set the width to 940 px, the height to 3000 px or so (think big canvas) and choose a white background color. Make sure your DPI is set to 72, and click ok.
First things first, understanding the difference between vector and raster graphics. Raster graphics are flat images, like photos, jpegs, gifs, etc. Vector images on the other hand, are barely related. A vector image is geometric, much like CAD drawings. Fireworks, just like Flash and Illustrator create a file made up of points, lines, curves, and shapes.