| You can think of a layer as a transparent plane where you can create and place objects. Layers enable you to divide your artwork when building complex or composite images. Different portions of the image can be stored on different layers and selectively turned off or on so you can isolate just the portion you are working on. Layers can contain either vector or bitmap objects, or a combination of both. The Layers panel in Fireworks is similar to layers panels in other graphics programs such as Macromedia FreeHand and Adobe Photoshop, but it includes additional information. On each layer, you can place one object or multiple objects. If you place multiple objects on the same layer, each object is placed on the layer as an individual object within a stack of objects. New objects are initially placed on top of the stack. A thumbnail representation of the object is displayed to the left of the object name on the Layers panel. You can control the stacking order of each object in the stack using Modify > Arrange > Bring to Front, Modify > Arrange > Bring Forward, Modify > Arrange > Send to Back, and Modify > Arrange > Send Backward, or you can use the Layers panel to drag the object to a new position within the stack or move the object to a new layer. Layers let you organize your drawings into distinct levels that can be edited as individual units or hidden from view when needed. The following exercise demonstrates how to use the Layers panel to add new layers, move objects between layers, and hide and lock layers. 1. | Begin by creating a new document. Set the canvas size to 800 pixels for the width and 600 pixels for the height, and make the canvas color white.
This document will become the home page for the Web site pages you are creating in these lessons.
In the early days of the Web, most users had 13-inch monitors. The price of monitors has dropped greatly, and now more users have 17-inch or larger monitors. Today, most Web designers build their pages based on the larger 17-inch size: 800 x 600 pixels. When designing your Web pages, you need to determine the smallest screen size of your users and design the pages accordingly.
Note Actually, the viewable area of an 800 x 600 monitor is 760 x 420 because of the features in the browser window such as the status area and the scroll bars. If you want all your page visible for the smaller monitors, adjust your canvas size. | 2. | Save the document as home_page.png in the Projects folder.
The name you give your Fireworks document is used for the exported HTML page. When naming your documents, you need to keep this in mind and follow some basic rules:
- Use lowercase names for your files. Some Web servers are case sensitive; some require that you use only lowercase filenames.
- Don't use spaces within your filenames. Use the underscore or dash character to simulate a space to separate words. For example, use home_page.htm instead of home page.htm.
- Use letters and numbers, but no special characters such as %, *, or /.
| 3. | Choose Window > Layers.
If the Layers panel was closed, it is opened. A check next to the panel name in the menu list indicates that the panel is open. If you see the panel in the panel group on the right of your screen, you can also click the expander arrow on the panel to open or close it. For this exercise, you might want to close any other panels so you see only the Layers panel.
 | 4. | Move the pointer to the title bar of the panel just below the Layers panel.
When you are over the title bar of a panel below an open panel, the pointer changes to an up-and-down-pointing arrow in Windows and a down-pointing arrow on the Macintosh. When you see the pointer change, you can drag down to increase or decrease the height of the panel above. Once you begin adding layers, you'll want to increase the size of the Layers panel.
 Note You can increase or decrease a panel only if two or more panels are open. |
|
