Accessibility

Table of Contents

Designing a website application with Fireworks CS4

Setting up the Fireworks workspace

Before you start working with Fireworks, it's a good idea to become familiar with the interface. A good way to do this is to customize the interface and make it your own.

Set the Fireworks preferences

As you continue to use Fireworks, it is likely you'll adapt the interface to suit your own unique workflow needs and personalize it further, but here are some tips to get you started:

  1. Select Edit > Preferences (Windows) or Fireworks > Preferences (Mac).
  2. In the General category, change the number of "Undo Steps" to 80 or higher. When making detailed edits that involve many small brush strokes it is easy to run out of undos quickly. Setting a higher Maximum Undo level allows more flexibility.
  3. In the Edit category, select "Precise cursors." This option displays the cursor as a crosshair for all tools, rather than the standard icon cursors. This setting gives you greater precision in your work.
  4. In the Photoshop Import/Open category, select the check box next to Clipping masks: Flatten to maintain appearance (see Figure 1). This option maintains the appearance of Adobe Photoshop clipping path masks when they are imported into Fireworks CS4.
  5. Click OK.

Setting the Photoshop Import options in the Fireworks Preferences dialog box

Figure 1. Setting the Photoshop Import options in the Fireworks Preferences dialog box

Organize the panels

Panels are an essential element of the Fireworks design workflow. Familiarizing yourself with all of the available panels will allow you to work more efficiently. Let's begin in the iconic mode with only the panel names displayed.

From the drop-down menu in the dark gray bar in the upper right corner of the screen, select Iconic Mode with Panel Names (see Figure 2).

Click the downward arrow icon next to Expanded Mode to choose the option to Select Iconic Mode with Panel Names

Figure 2. Click the downward arrow icon next to Expanded Mode to choose the option to Select Iconic Mode with Panel Names

This option displays all of the standard panels so that you can see them and select them when needed. Depending on the type of designs you create, you may find that you use these panels frequently:

  • The Color Palette is an advanced interface useful when working with color.
  • The Path panel is helpful when working with vectors.
  • The Info panel and the Path panel are both used frequently. Place both panels in an area that is easy to access.

Fireworks CS4 gives you a great deal of control over how the panels are arranged on your interface. Later in this tutorial we'll discuss some other recommended strategies for organizing your workspace.

Show the rulers

When the rulers are displayed, you can drag out guides on to your document. Guides are an excellent design aid when working in Fireworks, so it is a good idea to show the rulers as you are working. It's important to note that rulers may be shown only when a document is open in Fireworks.

  • To show the rulers, select View > Rulers.