New Document Setup

All new documents for web pages will be 760 X 450 pixels. Do not make your page wider than 760 pixels or a horizontal scroll bar will appear on the viewer's Netscape browser.

Fireworks MX® has a number of options available for the creation of a new document right from the start of the process, as well as many ways that the work area—called the canvas—can be modified once a project is underway. In this first exercise, you will go through the steps of creating a new Fireworks MX® document, see how the canvas and image can be modified, and pick up some valuable tips along the way.

1. Fireworks MX® does not automatically open a document when the program first starts. Choose FILE/NEW to go to the New Document dialog box, shown below.

The New Document dialog box is displayed every time a new Fireworks MX® file is created.

2. This dialog box has three purposes: to set the size of the document in width and height, to set the resolution of the document, and to establish the color of the canvas itself. The subsequent steps look at how these options are adjusted and the effect the settings can have.
   
3. By default, Fireworks MX® presents this information in pixels, and since you have carefully planned your web page, you know the exact size in pixels of any graphic you need for one of your pages before you design it. For this first document, set the width and height of this new file to the settings you see in the image above.
   
   
   
4. You may find that you get so accustomed to using Fireworks MX® that you want to create a document for print rather than the Web. In that case, you could set the width and height in inches or millimeters, rather than pixels, to conform to a specific paper size. To do so, simply click the drop-down arrow next to the unit of measurement and highlight the option you want. Be sure to change the unit first, and then set the value; otherwise, you may get some highly unusual results.
   
5. To use a predetermined size suitable for a web page, you can even choose COMMANDS/PANEL LAYOUT SETS as you see below, to access three canvas sizes that match the three most common monitor resolution settings.
   
   
   
6. Once you have determined the size, the next step is to choose the resolution of the image in pixels per inch (ppi). By default, this setting is 72 ppi, a suitable setting for an image that is to be displayed on a computer screen, since almost all monitors are restricted to a resolution no higher than 96 ppi, with 72 ppi being the most common. Why pack lots of extra pixels into an image, increasing its file size, if your viewers won’t be able to see them anyway? Keeping the resolution to the default 72 ppi setting can also go a long way toward keeping the exported file size down. Of course, if you were creating a document for print, you might need to experiment with this setting, but for the Web, 72 ppi is just fine.
   
7. The final setting determines the canvas color. Again, nothing too tricky here, except the option to make the canvas transparent. To create a transparent background when the file is ultimately exported to a GIF or JPEG format, you will need to begin with a transparent background at the beginning or change to a transparent background later on. Your other options are to use white, or use the Color Chooser, as shown earlier in Figure 1, to pick a custom color. For this project, set your canvas to white.
   
8. That’s it for settings for now. Click OK and save the file as flower_practice, accepting the default file type—Fireworks MX® PNG.
   
9. Resize your window so that you have some gray area around the canvas. This “negative area” around the canvas is a tool in itself. Use it when you want to drag images off the canvas so they can be rearranged. Also, whenever you have an object selected on the canvas, a handy way to unselect it is to click in the negative area of the Document window.
   
10. You open a file in Fireworks MX® in the same way you open any other document—choose File | Open. In this case, the file you want to open is called fire_logo.png, can open this file by clicking here.

Whenever a file is opened in Fireworks MX®, it is automatically converted to a Fireworks MX® PNG format. If you were to save the file now, the correct format would be the native PNG format for Fireworks MX®. To convert it back to a JPEG or GIF format, you would export the file.

Customizing the Fireworks MX® Workspace
Preferences in Fireworks MX® are used to further customize the Fireworks MX® workspace and how it behaves. To access preferences select EDIT/PREFRENCES.

The Preferences dialog box appears. Preferences are divided into five categories: General, Editing, Launch and Edit, Folders, and Import . At this point, some of the Preferences may not be clear to you because they relate to concepts covered in later chapters. As we progress through the book, we’ll be highlighting Preferences where applicable. At this point, we recommend that you keep the Preferences at the default settings.