Adobe 38039927 - Fireworks CS3 - PC Using Instructions

Using fireworks
Hide thumbs Also See for 38039927 - Fireworks CS3 - PC:
Table of Contents

Advertisement

Quick Links

USING FIREWORKS

Advertisement

Table of Contents
loading

Summary of Contents for Adobe 38039927 - Fireworks CS3 - PC

  • Page 1 USING FIREWORKS...
  • Page 2 The content of this guide is furnished for informational use only, is subject to change without notice, and should not be construed as a commitment by Adobe Systems Incorpo- rated.
  • Page 3: Table Of Contents

    Adobe Help ........
  • Page 4 Checking spelling ............... 124 Using the Text Editor .
  • Page 5 ............. 328 About Adobe XMP .
  • Page 6: Chapter 1: Getting Started

    Note: For more information, see the Read Me.html file on the installation DVD. Activate the software If you have a single-user retail license for your Adobe software, you will be asked to activate your software; this is a simple, anonymous process that you must complete within 30 days of starting the software.
  • Page 7: Adobe Help

    For more information, see “Viewing package contents (Macintosh only)” on page 352. Adobe Help Adobe Help resources Documentation for your Adobe software is available in a variety of formats. In-product and LiveDocs Help In-product Help provides access to all documentation and instructional content available at the time the product ships.
  • Page 8 Using Help in the product In-product Help is available through the Help menu. After you start the Adobe Help Viewer, click Browse to see Help for additional Adobe products installed on your computer. To help you learn about multiple Adobe products, these features are available: •...
  • Page 9: Resources

    Resources Adobe Video Workshop Adobe Creative Suite 3 Video Workshop enables you to learn about your product. There are over 200 training videos for Adobe Creative Suite 3, covering a wide range of subjects for print, web, and video professionals.
  • Page 10 • Understanding the Photoshop, Illustrator, and Fireworks workflow Extras You have access to a wide variety of resources that will help you make the most of your Adobe software. Some of these resources are installed on your computer during the setup process; additional helpful samples and documents are included on the installation or content DVD.
  • Page 11: Adobe Design Center

    Bridge Home, a new destination in Adobe Bridge CS3, provides up-to-date information on all your Adobe Creative Suite 3 software in one convenient location. Start Adobe Bridge, then click the Bridge Home icon at the top of the favorites panel to access the latest tips, news, and resources for your Creative Suite tools.
  • Page 12: Adobe Developer Center

    Visit the Adobe Support website, at www.adobe.com/support, to find troubleshooting information for your product and to learn about free and paid technical support options. Follow the Training link for access to Adobe Press books, a variety of training resources, Adobe software certification programs, and more.
  • Page 13: What's New In Fireworks Cs3

    User-to-user forums are available in English, French, German, and Japanese; blogs are posted in a wide range of languages. To participate in forums or blogs, visit www.adobe.com/communities. What’s new in Fireworks CS3 Create rich symbols This version of Fireworks introduces new and enhanced symbol features.
  • Page 14 ADOBE FIREWORKS CS3 User Guide Add multiple pages to a single document In a never-ending effort to improve web-design workflows, Fireworks CS3 makes it easy to build complex multi- page web prototypes using a single PNG file. Each page contains its own settings for canvas document, size, color, image resolution, and guides.
  • Page 15 With Fireworks CS3, you can directly import native files from Photoshop. Achieving a whole new level of function- ality, Adobe is redefining the concept of what integration should be. Fireworks design comps and images can now be saved as native Photoshop files and opened in either Photoshop or Fireworks CS3 with layer information preserved.
  • Page 16 Efficiently browse, tag, search, and process your images. Using Bridge and Fireworks together means you can take advantage of XMP metadata in your files. Adobe XMP (Extensible Metadata Platform) is a technology that assists the user in adding file information to files saved in PNG, GIF, JPEG, Photoshop, and TIFF formats, and facil- itates the exchange of metadata between Adobe software and other systems that support the XMP metadata standard.
  • Page 17: Chapter 2: Fireworks Basics

    JPEG file, GIF file, or file of another format—along with HTML files containing HTML tables and JavaS- cript code—for use on the web. You also can export or save a type of file specific to another program, such as Adobe Photoshop or Adobe Flash, if you want to continue working in the other program.
  • Page 18: About Vector And Bitmap Graphics

    ADOBE FIREWORKS CS3 User Guide You can also use the Fireworks tools to edit imported graphics. You can import and edit files in JPEG, GIF, PNG, PSD, and many other file formats. After you import a graphic image, you can adjust its color and tone, as well as crop, retouch, and mask it.
  • Page 19 ADOBE FIREWORKS CS3 User Guide About vector graphics Vector graphics render images using lines and curves, called vectors, that include color and position information. For example, the image of a leaf may be defined by a series of points that describe the outline of the leaf. The color...
  • Page 20: Creating A New Document

    ADOBE FIREWORKS CS3 User Guide Creating a new document When you select File > New to create a new document in Fireworks, you create a Portable Network Graphic, or PNG document. PNG is the native file format for Fireworks. After you create graphics in Fireworks, you can export or save them in other familiar web graphic formats, such as JPEG, GIF, and animated GIF.
  • Page 21: Opening And Importing Files

    In addition, you can import images from a digital camera or scanner. Note: Fireworks preserves many, but not all JavaScript behaviors when you import a file from Adobe Dreamweaver. If Fireworks supports a particular behavior, it recognizes that behavior and maintains it when you move a file back to Dreamweaver.
  • Page 22 ADOBE FIREWORKS CS3 User Guide Note: Fireworks saves 16-bit TIFF images at 24-bit color depth. Animated GIFs You can bring animated GIF files into Fireworks in two ways: • You can import an animated GIF as an animation symbol. You can edit and move all the elements of the animation as a single unit and use the Library panel to create new instances of the symbol.
  • Page 23 ADOBE FIREWORKS CS3 User Guide You can get HTML content into Fireworks in several ways: • You can open all the HTML tables in an HTML file. • You can open the first HTML table that Fireworks encounters in an HTML file.
  • Page 24 ADOBE FIREWORKS CS3 User Guide Pasting into Fireworks Pasting an object copied from another application into Fireworks places the object in the center of the active document. You can copy and paste an object or text in any of these formats from the Clipboard: •...
  • Page 25 ADOBE FIREWORKS CS3 User Guide Select Edit > Paste in Fireworks. If the bitmap image on the Clipboard has a different resolution than the current document does, you see a dialog box asking whether or not to resample. Select one of the following: •...
  • Page 26 ADOBE FIREWORKS CS3 User Guide Select Photoshop Plug-Ins. Click Browse if the Select the Photoshop Plug-ins Folder (Windows) or Choose a Folder (Macintosh) dialog box doesn’t automatically open. Navigate to the folder containing the Photoshop plug-ins. To import an image from a digital camera (Windows): Connect the camera to your computer.
  • Page 27: Saving Fireworks Files

    ADOBE FIREWORKS CS3 User Guide Follow the instructions to apply the desired settings. The imported image is opened as a new Fireworks document. Saving Fireworks files When you create a new document or open an existing Fireworks PNG file, the document’s filename has the extension .png.
  • Page 28 ADOBE FIREWORKS CS3 User Guide Select either Images or Fireworks PNG in the Export As pop-up menu. If you select Images, each page will be saved in the default file format. This file format can be set using the Optimize panel.
  • Page 29: The Fireworks Work Environment

    ADOBE FIREWORKS CS3 User Guide The Fireworks work environment When you open a document in Fireworks for the first time, Fireworks activates the work environment, including the Tools panel, Property inspector, menus, and other panels. The Tools panel, on the left of the screen, contains labeled categories, including bitmap, vector, and web tool groups.
  • Page 30 ADOBE FIREWORKS CS3 User Guide Using the Tools panel The Tools panel is organized into six categories: Select, Bitmap, Vector, Web, Colors, and View. Changing tool options When you select a tool, the Property inspector displays tool options. Some tool options remain displayed as you work with the tool.
  • Page 31: Using The Property Inspector

    ADOBE FIREWORKS CS3 User Guide Selecting a tool from a tool group A small triangle in the lower right corner of a tool in the Tools panel indicates that it is part of a tool group. For example, the Rectangle tool is part of the basic shape tool group, which also includes the Rounded Rectangle, Ellipse, and Polygon basic tools, as well as all of the Auto Shape tools, which appear below the divider line.
  • Page 32 ADOBE FIREWORKS CS3 User Guide To collapse the Property inspector when it is docked, do one of the following: • Click the expander arrow or the title of the Property inspector. • Select Collapse Panel Group from the docked Property inspector Options menu.
  • Page 33 ADOBE FIREWORKS CS3 User Guide lets you create new colors to add to the current document’s color palette or to apply to selected The Color Mixer panel objects. manages the current document’s color palette. The Swatches panel provides information about the dimensions of selected objects and the exact coordinates of the The Info panel pointer as you move it across the canvas.
  • Page 34 ADOBE FIREWORKS CS3 User Guide • Select Group With > New Panel Group from the Options menu in the panel group’s title bar. (The Group With command’s name changes depending on the name of the active panel.) The panel appears in a new panel group of its own.
  • Page 35 ADOBE FIREWORKS CS3 User Guide Using the panel group or panel Options menu Each panel group and panel has an Options menu listing a range of choices specific to the active panel or panel group. An Options menu also appears in the Property inspector (except in Windows when the Property inspector is undocked).
  • Page 36 The Quick Export button lets you export your Fireworks files to a number of programs, including Dreamweaver, Flash, Photoshop, Illustrator, Adobe Director, Adobe GoLive®, and FreeHand. In addition, you can preview your files in the browser of your choice. For more information, see “Using the Quick Export button” on page 288.
  • Page 37 ADOBE FIREWORKS CS3 User Guide Zooming and panning Fireworks lets you zoom in or out at a preset or user-defined magnification percentage. A. Hand tool B. Zoom tool C. Zoom pop-up menu To zoom in using preset increments, do one of the following: •...
  • Page 38 ADOBE FIREWORKS CS3 User Guide Note: You cannot enter a magnification percentage in the Set Magnification text box. To zoom out based on a specific area: ❖ Alt-drag (Windows) or Option-drag (Macintosh) a selection area with the Zoom tool. To return to 100% magnification: ❖...
  • Page 39 ADOBE FIREWORKS CS3 User Guide To close a document view window: ❖ Click the window’s Close button. Controlling document redraw Display modes affect a document’s onscreen representation, but not its object data or output quality. To control document redraw: ❖...
  • Page 40 ADOBE FIREWORKS CS3 User Guide To change the canvas color from the Modify menu: Select Modify > Canvas > Canvas Color. Select White, Transparent, or Custom. If you select Custom, click a color in the Swatches pop-up window. To select the canvas color from the Property inspector: Choose Select >...
  • Page 41 ADOBE FIREWORKS CS3 User Guide Select Current Page Only to apply the canvas size change to the current page. If this box is unchecked, the canvas size change applies to all pages in the active document, as well as any new pages that are created.
  • Page 42 ADOBE FIREWORKS CS3 User Guide Original; trimmed canvas To trim or fit the canvas to the document contents: Choose Select > Deselect to view the document properties in the Property inspector. Click Fit Canvas in the Property inspector. The canvas expands or contracts to the size of the contents of the canvas.
  • Page 43 ADOBE FIREWORKS CS3 User Guide Using rulers, guides, and the grid You can use rulers and guides to lay out objects as precisely as possible and to help you draw. You can place guides in the document and snap objects to those guides or turn on the Fireworks grid and snap objects to the grid.
  • Page 44 ADOBE FIREWORKS CS3 User Guide Fireworks also has slice guides that allow you to slice a document for use on the web. Regular image guides are different from slice guides, however. For information on slice guides, see “Moving slice guides to edit slices” on page 204.
  • Page 45 ADOBE FIREWORKS CS3 User Guide Select the new grid color from the color box pop-up window, and click OK. To change the size of the grid’s cells: Select View > Grid > Edit Grid. Enter the appropriate values in the horizontal and vertical spacing text boxes, and click OK.
  • Page 46: Chapter 3: Selecting And Transforming Objects

    Chapter 3: Selecting and Transforming Objects As you work in Fireworks CS3, you manipulate vector and bitmap objects, text blocks, slices and hotspots, and areas of pixels. Using the selection and transformation tools, you can move, copy, delete, rotate, scale, or skew objects. In documents that have multiple objects, you can organize the objects by stacking, grouping, and aligning them.
  • Page 47 ADOBE FIREWORKS CS3 User Guide • Select the object in the Layers panel. To preview what you would select if you were to click on an object beneath the pointer on the canvas, select the Mouse Highlight option in the Editing tab of the Preferences dialog box. For more about preferences, see “Setting preferences”...
  • Page 48 ADOBE FIREWORKS CS3 User Guide Note: The name appears in the title bar of the document whenever you select this item. For slices and buttons, the name is the filename when exported. • The number of objects when more than one object is selected Note: If the status bar is turned on (Windows only), selected objects are also identified in the status bar at the bottom of the document window.
  • Page 49: Selecting Pixels

    ADOBE FIREWORKS CS3 User Guide To show all objects: ❖ Select View > Show All. Note: To hide objects whether they are selected or not, you can click or drag along the Eye column in the Layers panel. Selecting pixels...
  • Page 50 ADOBE FIREWORKS CS3 User Guide Note: The Magic Wand tool also has a Tolerance setting. For more information, see “Selecting areas of similar color” on page 46. Creating pixel selection marquees The Marquee, Oval Marquee, and Lasso tools in the Bitmap section of the Tools panel allow you to select specific pixel areas of a bitmap image by drawing a marquee around them.
  • Page 51 ADOBE FIREWORKS CS3 User Guide Selecting areas of similar color The Magic Wand tool allows you to select areas of pixels that are similar in color. By adjusting the Magic Wand’s Tolerance and Edge options in the Property inspector, you can control how the Magic Wand selects pixels.
  • Page 52 ADOBE FIREWORKS CS3 User Guide Removing a selection marquee You can remove a selection marquee without affecting the document. To remove a marquee, do one of the following: • Draw another marquee. • Click outside the current selection with a marquee or lasso tool.
  • Page 53 ADOBE FIREWORKS CS3 User Guide To subtract pixels from a selection: ❖ Hold down Alt (Windows) or Option (Macintosh) and use a bitmap selection tool to select the pixel area to be punched out. Creating a marquee from intersecting marquees You can select pixels in an existing marquee by drawing a marquee that overlaps the original.
  • Page 54 ADOBE FIREWORKS CS3 User Guide A pixel selection is created on the selected bitmap from the intersection of the opaque areas of the two overlapping objects. When you position the pointer over the thumbnail and hold down the specified modifier keys, the pointer indicates that you are about to create a pixel selection from the intersection of the opaque areas of two overlapping objects.
  • Page 55 ADOBE FIREWORKS CS3 User Guide Selecting an area around an existing marquee You can create an additional marquee to frame an existing marquee at a specified width. This lets you create special graphics effects, such as feathering the edges of a pixel selection.
  • Page 56 ADOBE FIREWORKS CS3 User Guide Saving marquee selections You can save the size, shape, and location of a selection to reapply later. You can also save multiple marquee selec- tions. To save a marquee selection: Choose Select > Save Bitmap Selection to open the Save Selection dialog box.
  • Page 57 ADOBE FIREWORKS CS3 User Guide • “Subtract from selection” subtracts the active selection from the one specified in the Document and Selection boxes. • “Intersect with selection” intersects the active selection with the one specified in the Document and Selection boxes.
  • Page 58: Editing Selected Objects

    ADOBE FIREWORKS CS3 User Guide Inserting a new bitmap by cutting or copying You can insert a new bitmap based on a pixel selection into the current layer of a document by cutting or copying the selected pixels. To insert a new bitmap by cutting and pasting a pixel selection: Select an area of pixels using a pixel selection tool.
  • Page 59: Transforming And Distorting Selected Objects And Selections

    ADOBE FIREWORKS CS3 User Guide Note: You cannot use the Duplicate or Clone commands with bitmap selections. Use the Subselection tool or Rubber Stamp tool to duplicate parts of a bitmap image. For more information about using the Subselection tool, see the following procedures.
  • Page 60: Rotating Objects

    ADOBE FIREWORKS CS3 User Guide A. Center point B. Transform handles Object rotated, scaled, skewed, distorted, and flipped vertically and horizontally To transform selected objects using the transform handles: Select a transformation tool. As you move the pointer on or near the selection handles, the pointer changes to indicate the current transformation.
  • Page 61 ADOBE FIREWORKS CS3 User Guide Note: You can also rotate the document canvas. For more information, see “Rotating the canvas” on page 36. To rotate a selected object 90° or 180°: ❖ Select Modify > Transform and select a Rotate command from the submenu.
  • Page 62 ADOBE FIREWORKS CS3 User Guide To achieve the illusion of perspective: ❖ Drag a corner point. Distorting objects You change the size and proportions of an object by dragging a selection handle with the Distort tool. To distort a selected object: Do one of the following to display the transform handles: •...
  • Page 63: Organizing Objects

    ADOBE FIREWORKS CS3 User Guide Organizing objects When working with multiple objects in a single document, you can use several techniques to organize the document: • You can group individual objects to treat them as one or protect each object’s relationship to the others in the group.
  • Page 64: Aligning Objects

    ADOBE FIREWORKS CS3 User Guide To select the group that contains a subselected object, do one of the following: • Right-click (Windows) or Control-click (Macintosh) anywhere in the group and choose Select > Superselect from the context menu. • Choose Select > Superselect.
  • Page 65 ADOBE FIREWORKS CS3 User Guide • Select Modify > Align > Center Horizontal to align the center points of the objects along a horizontal axis. • Select Modify > Align > Bottom to align the objects to the bottommost selected object.
  • Page 66: Chapter 4: Working With Bitmaps

    Chapter 4: Working with Bitmaps Bitmaps are graphics composed of small colored squares called pixels, which combine like the tiles of a mosaic to create an image. Examples of bitmap graphics include photographs, scanned images, and graphics created from paint programs.
  • Page 67 ADOBE FIREWORKS CS3 User Guide When you create a new bitmap object, it is added to the current layer. In the Layers panel with layers expanded, you can see a thumbnail and name for each bitmap object under the layer on which it resides. Although some bitmap applications consider each bitmap object a layer, Fireworks organizes bitmap objects, vector objects, and text as separate objects that reside on layers.
  • Page 68: Accessing Photo Editing Tools

    ADOBE FIREWORKS CS3 User Guide Accessing photo editing tools To make it easy for you to get started editing photos as quickly as possible, Fireworks has assembled the most commonly used tools for photo editing all in one place. The Image Editing panel contains the following tools: Red- eye Removal, Crop, Rotate, Blur, Sharpen, Dodge, and Burn.
  • Page 69 ADOBE FIREWORKS CS3 User Guide Painting bitmap objects You can use the Brush tool to paint a brush stroke using the color in the Stroke Color box, or you can use the Paint Bucket tool to change the color of selected pixels to the color in the Fill Color box. With the Gradient tool, you can fill bitmap or vector objects with a combination of colors in adjustable patterns.
  • Page 70 ADOBE FIREWORKS CS3 User Guide Open a Fireworks document or any file that Fireworks can open. For more information, see “Slices, Rollovers, and Hotspots” on page 200. Select the Eyedropper tool from the Colors section of the Tools panel. Set the Color Averaging Sample setting in the Property inspector: creates a stroke or fill color from a single pixel.
  • Page 71: Retouching Bitmaps

    ADOBE FIREWORKS CS3 User Guide To feather the edges of a pixel selection as you make a pixel selection: Select a bitmap selection tool from the Tools panel. Select Feather from the Edge pop-up menu in the Property inspector. Drag the slider to set the number of pixels you want to blur along the edge of the selection.
  • Page 72 ADOBE FIREWORKS CS3 User Guide Move to a different part of the image and drag the pointer. You will see two pointers. The first one, the source of the cloning, is in the shape of a cross hair. For more infor- mation, see “Editing preferences”...
  • Page 73 ADOBE FIREWORKS CS3 User Guide To smudge colors in an image: Select the Smudge tool. Set the tool options in the Property inspector: specifies the size of the brush tip. Size sets a round or square brush tip shape. Shape specifies the softness of the brush tip.
  • Page 74 ADOBE FIREWORKS CS3 User Guide Original photograph; after using the Red-eye Removal tool To correct the red-eye effect in a photograph: Select the Red-eye Removal tool from its pop-up menu. Set the attributes in the Property inspector: determines the range of hues to replace (0 replaces only red; 100 replaces all hues that contain red).
  • Page 75 ADOBE FIREWORKS CS3 User Guide Click the From color box to select the color probe, and select a color from the pop-up menu to specify the color you want to replace. Click the To color box in the Property inspector and select a color from the pop-up menu.
  • Page 76: Adjusting Bitmap Color And Tone

    If you prefer to apply filters in an irreversible, permanent way, you can select them from the Filters menu. However, Adobe recommends that you use filters as Live Filters whenever possible. You can apply filters from the Filters menu to pixel selections, but not Live Filters. You can, however, define an area of a bitmap and create a separate bitmap from it, and then apply a Live Filter to it.
  • Page 77 ADOBE FIREWORKS CS3 User Guide Fireworks applies the Live Filter only to the new bitmap object, simulating the application of a filter to a pixel selection. Note: Although Live Filters are more flexible, large numbers of Live Filters in a document can slow down Fireworks performance.
  • Page 78 ADOBE FIREWORKS CS3 User Guide To adjust highlights, midtones, and shadows: Select the bitmap image. Do one of the following to open the Levels dialog box: • In the Property inspector, click the Add Live Filters button, and then select Adjust Color > Levels from the Filters pop-up menu.
  • Page 79 ADOBE FIREWORKS CS3 User Guide To adjust highlights, midtones, and shadows automatically: Select the image. Do one of the following to select Auto Levels: • In the Property inspector, click the Add Live Filters button, and then select Adjust Color > Auto Levels from the Filters pop-up menu.
  • Page 80 ADOBE FIREWORKS CS3 User Guide Curves dialog box In the Channel pop-up menu, select whether you want to apply changes to individual color channels or to all colors. Click a point on the grid’s diagonal line and drag it to a new position to adjust the curve.
  • Page 81: Adjusting Brightness And Contrast

    ADOBE FIREWORKS CS3 User Guide Select the appropriate eyedropper to reset the tonal values in the image: • Click the lightest pixel in the image with the Highlight eyedropper to reset the highlight value. • Click a pixel of neutral color in the image with the Midtone eyedropper to reset the midtone value.
  • Page 82 ADOBE FIREWORKS CS3 User Guide To add a Color Fill Live Filter to a selected object: In the Property inspector, click the Add Live Filters button, and then select Adjust Color > Color Fill from the Filters pop-up menu. Select a blending mode.
  • Page 83 ADOBE FIREWORKS CS3 User Guide To change an RGB image to a two-tone image or to add color to a grayscale image: ❖ Select Colorize in the Hue/Saturation dialog box. Note: When you select Colorize, the value range of the Hue and Saturation sliders changes. Hue changes to 0 to 360.
  • Page 84: Blurring And Sharpening Bitmaps

    ADOBE FIREWORKS CS3 User Guide Blurring and sharpening bitmaps Fireworks has a set of blurring and sharpening options that you can apply as Live Filters or as irreversible, permanent filters. Blurring an image Blurring softens the look of a bitmap image. Fireworks has six blurring options: softens the focus of selected pixels.
  • Page 85 ADOBE FIREWORKS CS3 User Guide Drag the Angle dial to set the direction of the blur effect. Drag the Distance slider to set the strength of the blur effect. Values range from 1 to 100. An increase in distance results in a stronger blur effect.
  • Page 86 ADOBE FIREWORKS CS3 User Guide Original; after applying Find Edges To apply the Find Edges filter to a selected area, do one of the following: • In the Property inspector, click the Add Live Filters button, and then select Other > Find Edges from the Filters pop-up menu.
  • Page 87 ADOBE FIREWORKS CS3 User Guide Original; after sharpening To sharpen an image using a sharpen option: Select the image. Do one of the following to select a sharpen option: • In the Property inspector, click the Add Live Filters button, and then select Sharpen > Sharpen or Sharpen More from the Filters pop-up menu.
  • Page 88: Adding Noise To An Image

    ADOBE FIREWORKS CS3 User Guide Adding noise to an image When viewed at high magnification levels, most images obtained from digital cameras and scanners do not have perfectly uniform colors. Instead, the colors you see consist of pixels of many different colors. In image editing, “noise”...
  • Page 89: Chapter 5: Working With Vector Objects

    Chapter 5: Working with Vector Objects A vector object is a computer graphic whose shape is defined by a path. The shape of a vector path is determined by points that are plotted along the path. A vector object’s stroke color follows the path. Its fill occupies the area inside the path.
  • Page 90 ADOBE FIREWORKS CS3 User Guide For the Rectangle or Ellipse tool, Shift-drag to constrain shapes to squares or circles. To constrain a shape and draw from the center point: ❖ Position the pointer at the intended center point and Shift-Alt-drag (Windows) or Shift-Option-drag (Macintosh) the drawing tool.
  • Page 91 ADOBE FIREWORKS CS3 User Guide To draw a polygon: In the Vector section of the Tools panel, select the Polygon tool, which is one of the basic shape drawing tools. In the Property inspector, do one of the following to specify the number of sides for the polygon: •...
  • Page 92 ADOBE FIREWORKS CS3 User Guide draws object groups that appear as rectangles with chamfers, corners that are rounded to the Chamfer Rectangle inside of the rectangle. You can edit the chamfer radius of all corners together, or change the chamfer radius of individual corners.
  • Page 93 ADOBE FIREWORKS CS3 User Guide • Control+Command-click the Direction control point to reset the x-axis only. • Double-click the Perspective control point to reset the width of the shadow only. For information about how to change the properties of an Auto Shape, see “Changing the properties of Auto Shapes”...
  • Page 94 ADOBE FIREWORKS CS3 User Guide To adjust the width of an arrow tail: ❖ Drag the body width control point of a selected arrow. Adjusting bent arrow Auto Shapes Bent arrows have five control points. There are control points for adjusting the flare of the arrowhead, the length of the arrowhead tip, the length of the arrow tail, the width of the arrow tail, and the roundness of the arrow’s bend.
  • Page 95 ADOBE FIREWORKS CS3 User Guide Adjusting connector line Auto Shapes Connector lines have five control points. There are control points for placing the start and end points, for adjusting the position of the cross bar (the line that connects the start and end line segments), and for adjusting the roundness of the corners.
  • Page 96 ADOBE FIREWORKS CS3 User Guide To resize a slice of a selected pie: ❖ Drag a drag-to-segment control point on the outer perimeter of the shape. To reset the a selected pie to one slice: ❖ Click the Reset control point.
  • Page 97 ADOBE FIREWORKS CS3 User Guide To adjust the number of turns in a selected spiral: ❖ Drag the spirals control point. To open or close a selected spiral: ❖ Click the open/close spiral control point. Adjusting star Auto Shapes Stars initially have five control points. There are control points for adding or removing points, for adjusting the inner and outer angles of the points, and for adjusting the roundness of the peaks and valleys.
  • Page 98 ADOBE FIREWORKS CS3 User Guide Drawing freeform paths You can draw freeform vector paths with the Vector Path tool, much as you draw using a felt-tip marker or crayon. The Vector Path tool is located in the Pen tool pop-up menu.
  • Page 99 ADOBE FIREWORKS CS3 User Guide Drawing paths by plotting points One way to draw and edit vector objects in Fireworks is to plot points as if drawing a connect-the-dots picture. When you click each point with the Pen tool, Fireworks automatically draws the path of the vector object from the last point you clicked.
  • Page 100 ADOBE FIREWORKS CS3 User Guide • To close the path, click the first point you plotted. The beginning and end points of a closed path are the same. Note: Loops formed by a path overlapping itself are not closed paths. Only paths that begin and end on the same point are closed paths.
  • Page 101 ADOBE FIREWORKS CS3 User Guide Click a point with the Subselection tool to select it. Selected corner points appear as solid blue squares. Drag the point or use the arrow keys to move the point to a new location. Adjusting the shape of a curved path segment You can change the shape of a vector object by dragging its point handles with the Subselection tool.
  • Page 102 ADOBE FIREWORKS CS3 User Guide Converting path segments to straight or curved Straight path segments are intersected by corner points. Curved path segments contain curve points. You can convert a straight segment to a curved segment and vice versa by converting its point.
  • Page 103 ADOBE FIREWORKS CS3 User Guide The handles retract, and the adjacent segments straighten. Selecting points The Subselection tool allows you to select multiple points. Before selecting a point with the Subselection tool, you must select the path using the Pointer or Subselection tool or by clicking its thumbnail in the Layers panel.
  • Page 104 ADOBE FIREWORKS CS3 User Guide To change the shape of a path segment: ❖ Drag a point handle with the Subselection tool. Alt-drag (Windows) or Option-drag (Macintosh) to drag one handle at a time. To adjust the handle of a corner point: Select the Subselection tool in the Tools panel.
  • Page 105: Editing Paths

    ADOBE FIREWORKS CS3 User Guide To merge two open paths: Select the Pen tool in the Tools panel. Click the end point of one of the paths. Move the pointer to the end point of the other path and click.
  • Page 106 ADOBE FIREWORKS CS3 User Guide As you move the pointer over a selected path, it changes to the push or pull pointer, depending on its location relative to the selected path. Pointer Meaning The Freeform tool is in use. The Freeform tool is in use, and the pull pointer is in position to pull the selected path.
  • Page 107 ADOBE FIREWORKS CS3 User Guide Distorting paths You can use the Reshape Area tool to pull the area of all selected paths within the outer circle of the reshape area pointer. The pointer’s inner circle is the boundary of the tool at full strength. The area between the inner and outer circle reshapes paths at less than full strength.
  • Page 108 ADOBE FIREWORKS CS3 User Guide If desired, change the precision level of the Redraw Path tool by selecting a number from the pop-up menu in the Precision box of the Property inspector. The higher the number you select, the greater the number of points that appear on the path.
  • Page 109 ADOBE FIREWORKS CS3 User Guide To create one continuous path from two open paths: Select the Subselection tool in the Tools panel. Select two end points on two open paths. Select Modify > Combine Paths > Join. To create a composite path: Select two or more open or closed paths.
  • Page 110 ADOBE FIREWORKS CS3 User Guide To create a closed path that encloses the area common to all selected closed paths: ❖ Select Modify > Combine Paths > Intersect. The resulting path assumes the stroke and fill attributes of the object that is placed farthest back.
  • Page 111 ADOBE FIREWORKS CS3 User Guide You might want to use Simplify if you have a straight line that contains more than two points, for example. (Only two points are necessary to produce a straight line.) Or perhaps your path contains points that lie exactly on top of one another.
  • Page 112 ADOBE FIREWORKS CS3 User Guide Specify a corner type: miter, round, or beveled. If you chose miter, set the miter limit, the point at which a miter corner automatically becomes a beveled corner. The miter limit is the ratio of miter corner length to stroke width.
  • Page 113 ADOBE FIREWORKS CS3 User Guide Icon Function Inset paths Invert paths Open/close paths Extrude paths Blend paths Point tools Straighten Smooth Round to whole positions Round to half positions Move points Scale points Rotate points Mirror points Fillet points Select entire contour...
  • Page 114: Chapter 6: Working With Text

    You can import text while retaining rich text format attributes. Also, when you import an Adobe Photoshop document containing text, the text remains editable. Fireworks handles missing fonts upon import by asking you to select a substitute font or allowing you to import text as a static image.
  • Page 115 ADOBE FIREWORKS CS3 User Guide The Property inspector when the Text tool is selected Naming a text object As you add text to your Fireworks document, that text object is automatically saved under a name that matches the text you’ve typed. You can change the assigned name to a different name, if you prefer.
  • Page 116 ADOBE FIREWORKS CS3 User Guide When you have finished entering text, do one of the following: • Click outside the text block. • Select another tool in the Tools panel. • Press Escape. Moving text blocks You can select a text block and move it anywhere in your document, as you would any other object. You can also move text blocks as you drag to create them.
  • Page 117: Formatting Text

    ADOBE FIREWORKS CS3 User Guide Formatting text Within a text block, you can vary all aspects of text, including size, font, spacing, leading, and baseline shift. When you edit text, Fireworks redraws its stroke, fill, and filter attributes accordingly. You can change a text block’s attributes using the Property inspector. If the Property inspector is minimized, click the expander arrow in the lower right corner to see all text properties.
  • Page 118: Inserting Special Characters

    ADOBE FIREWORKS CS3 User Guide Note: The fonts that were used most recently appear at the top of the Font pop-up menu. To change the font size, drag the Font Size pop-up slider or enter a value in the text box. Font size is measured in points.
  • Page 119 ADOBE FIREWORKS CS3 User Guide A. Fill Color box • In the Tools panel, click the Fill Color box and select a color from the color pop-up window, or sample a color from anywhere on the screen using the eyedropper pointer while the Fill Color box pop-up window is open.
  • Page 120 ADOBE FIREWORKS CS3 User Guide To set kerning: Do one of the following to select the text you want to kern: • Click between two characters with the Text tool. • Use the Text tool to highlight the characters you want to change.
  • Page 121 ADOBE FIREWORKS CS3 User Guide Setting text orientation A text block can be oriented horizontally or vertically. By default, text is oriented horizontally. Horizontal and vertical orientation Text can also flow right to left or left to right. Text flowing right to left and left to right In Fireworks, you set horizontal and vertical orientation as well as the direction of text flow in the Property inspector.
  • Page 122 ADOBE FIREWORKS CS3 User Guide Vertical text can be aligned to the top or bottom of a text block, centered within the text block, or fully justified between both the top and bottom edges. To achieve a stretched filter, or to fit text into a specific space, you can set the alignment to stretch the text horizon- tally (for horizontally oriented text) or vertically (for vertically oriented text).
  • Page 123 In the Property inspector, select one of options from the Anti-Aliasing pop-up menu: Note: When you open vector files, such as Adobe FreeHand files, in Fireworks, text is anti-aliased. You can edit this attribute using the Property inspector. For more information, see “Opening graphics created in other applications” on page 16.
  • Page 124: Applying Strokes, Fills, And Filters To Text

    ADOBE FIREWORKS CS3 User Guide Setting baseline shift Baseline shift determines how closely text sits above or below its natural baseline. If there is no baseline shift, the text sits on the baseline. You can use baseline shift to create subscript and superscript characters.
  • Page 125: Attaching Text To A Path

    ADOBE FIREWORKS CS3 User Guide Attaching text to a path To free text from the restrictions of rectangular text blocks, you can draw a path and attach text to it. The text flows along the shape of the path and remains editable.
  • Page 126: Transforming Text

    ADOBE FIREWORKS CS3 User Guide Changing text orientation and direction on a path The order in which you draw a path establishes the direction of the text attached to it. For example, if you draw a path from right to left, the attached text appears backward and upside down.
  • Page 127: Converting Text To Paths

    ADOBE FIREWORKS CS3 User Guide You can still edit the transformed text, although severe transformations may make the text difficult to read. When a text block transformation causes text to be resized or scaled, the resulting font size appears in the Property inspector when the text is selected.
  • Page 128 ADOBE FIREWORKS CS3 User Guide Photoshop text You can open or import a Photoshop file containing text. You can also copy text from a Photoshop file and paste into the current Fireworks document or drag it from the Photoshop file to the current document. For more information, see “Opening graphics created in other applications”...
  • Page 129: Checking Spelling

    If you don’t select a language, Fireworks prompts you to select a language dictionary every time you spell-check a document. Note: The Adobe.tlx option is always selected at the top of the Dictionary list. For more information about this option, see “Customizing spell checking” on page 124.
  • Page 130: Using The Text Editor

    ADOBE FIREWORKS CS3 User Guide Select the desired options in the Spelling Setup dialog box: • Select one or more language dictionaries. Note: The Macromedia.tlx option is always selected at the top of the dictionary list. This is the file that contains your custom spelling dictionary.
  • Page 131: Chapter 7: Applying Color, Strokes, And Fills

    Chapter 7: Applying Color, Strokes, and Fills Fireworks CS3 has a wide range of panels, tools, and options for organizing and selecting colors, and applying colors to bitmap images and vector objects. In the Swatches panel, you can select a preset swatch group such as Color Cubes, Continuous Tone, or Grayscale, or you can create custom swatch groups that include your favorite colors or colors approved by your client.
  • Page 132: Organizing Swatch Groups And Color Models

    ADOBE FIREWORKS CS3 User Guide Note: The Paint Bucket tool fills pixel selections and vector objects with the color shown in the Fill Color box in the Tools panel. Color boxes in the Tools panel and the color pop-up window To reset colors to the default: ❖...
  • Page 133 ADOBE FIREWORKS CS3 User Guide Changing swatch groups You can easily switch to another swatch group or create your own. The Swatches panel Options menu contains the following swatch groups: Color Cubes, Continuous Tone, Macintosh System, Windows System, and Grayscale. You can import custom swatches from color palette files saved as ACT or GIF files.
  • Page 134 ADOBE FIREWORKS CS3 User Guide Move the tip of the eyedropper pointer to the open space after the last swatch in the Swatches panel. The eyedropper pointer becomes the paint bucket pointer. Click to add the swatch. When you select Snap to Web Safe in the Options menu of the color pop-up window, any non-websafe color you pick up with the eyedropper pointer is changed to the nearest websafe color.
  • Page 135 Fireworks graphics for print, you can import them into Adobe Illustrator, Adobe Photoshop, or Adobe FreeHand, which automatically perform CMYK conversion of RGB images when output to digital color separations. For more information, see the documentation for those programs.
  • Page 136 ADOBE FIREWORKS CS3 User Guide To pick a color from the Color Mixer: Deselect all objects before mixing a color to prevent unwanted object editing as you mix colors. Click either the Stroke Color or Fill Color box to make it the destination for the new color.
  • Page 137 ADOBE FIREWORKS CS3 User Guide Note: By default, the color’s RGB values appear in the Info panel and the Color Mixer, and its hexadecimal value appears in the color pop-up window, as well as the color box tool tip in Windows. However, you can change the color model displayed in the Color Mixer or the Info panel anytime.
  • Page 138 ADOBE FIREWORKS CS3 User Guide When you view the graphic in a web browser, the web page background shows through every other pixel of the trans- parent web dither fill, creating the appearance of transparency. Note: Not all browsers support PNG files.
  • Page 139 ADOBE FIREWORKS CS3 User Guide To create and swap color palettes for your document: Select the Mixers tab in the Color Palette panel. Use the four fill color boxes at the bottom of the panel to set the four base colors for your document. A palette is automatically created.
  • Page 140: Using Color Boxes And Color Pop-Up Windows

    ADOBE FIREWORKS CS3 User Guide To create a color gradation series using the Blender tab: Select the Blender tab in the Color Palette panel. Use the fill color boxes at the bottom of the panel to select beginning and ending colors for the series.
  • Page 141: Working With Strokes

    ADOBE FIREWORKS CS3 User Guide To display a different swatch group in the color pop-up window: ❖ Select a swatch group from the color pop-up window Options menu. Selecting a swatch group here does not affect the Swatches panel. Sampling colors from a color pop-up window When a color pop-up window is open, the pointer becomes a special eyedropper that can take up colors from almost anywhere on the screen.
  • Page 142 ADOBE FIREWORKS CS3 User Guide Use the options in the Property inspector or the Stroke Options pop-up window to change the stroke applied to an object. To change the stroke color of a drawing tool: Press Control+D (Windows) or Command+D (Macintosh) to deselect all objects.
  • Page 143 ADOBE FIREWORKS CS3 User Guide Creating custom strokes You can use the Edit Stroke dialog box to change specific stroke characteristics. The Edit Stroke dialog box has three tabs: Options, Shape, and Sensitivity. The stroke preview at the bottom of each tab shows the current brush with the current settings. The current pressure- and speed-sensitivity settings are reflected in the preview by a stroke that tapers or fades or otherwise changes from left to right.
  • Page 144 ADOBE FIREWORKS CS3 User Guide To select a dotted or dashed line, select an option from the Dash pop-up menu. To set the lengths of dashes and spaces for a dotted line, use the three sets of On and Off text input boxes to control the first, second, and third dashes, respectively.
  • Page 145: Working With Fills

    ADOBE FIREWORKS CS3 User Guide Creating stroke styles You can change specific stroke characteristics such as ink amount, tip shape, and tip sensitivity, and save the custom stroke as a style for reuse across many documents. To create custom strokes: Do one of the following: •...
  • Page 146: Applying Gradient And Pattern Fills

    ADOBE FIREWORKS CS3 User Guide Editing solid fills A solid fill is a solid color that fills the interior of an object. You can change an object’s fill color in the Tools panel, Property inspector, or Color Mixer. To edit a selected vector object’s solid fill: Click the Fill Color box in the Property inspector, Tools panel, or Color Mixer to open the color pop-up window.
  • Page 147 ADOBE FIREWORKS CS3 User Guide Adding a custom pattern You can set a bitmap file as a new pattern fill. You can use files with these formats as patterns: PNG, GIF, JPEG, BMP, TIFF, and PICT (Macintosh only). When a pattern fill is a 32-bit transparent image, the transparency affects the fill when used in Fireworks.
  • Page 148 ADOBE FIREWORKS CS3 User Guide Edit Gradient pop-up window To open the Edit Gradient pop-up window: Select an object that has a gradient fill or select a gradient fill from the Fill Options pop-up menu in the Property inspector. Click the Fill Color box in the Property inspector or Tools panel to open the pop-up window.
  • Page 149 ADOBE FIREWORKS CS3 User Guide To use the Gradient tool: Click the Paint Bucket tool in the Tools panel and select the Gradient tool from the pop-up menu. Select from the following attributes in the Property inspector: is a pop-up menu from which you can select a gradient type.
  • Page 150: Adding Texture To Strokes And Fills

    ADOBE FIREWORKS CS3 User Guide Select an edge option: Hard Edge, Anti-Alias, or Feather. For a feathered edge, also select the number of pixels on each side of the edge that are to be feathered. The default is 10. You can select from 0 to 100. The higher the level, the more feathering occurs.
  • Page 151 ADOBE FIREWORKS CS3 User Guide • Select a texture from the pop-up menu. • Select Other from the pop-up menu and navigate to a texture file to use an external texture. Note: You can apply textures from files with these formats: PNG, GIF, JPEG, BMP, TIFF, and PICT (Macintosh only).
  • Page 152: Chapter 8: Using Live Filters

    Chapter 8: Using Live Filters Fireworks CS3 Live Filters (formerly known as Live Effects) are enhancements that you can apply to vector objects, bitmap images, and text. Live Filters include bevels and embossing, solid shadows, drop shadows and glows, color correction, and blurring and sharpening.
  • Page 153 ADOBE FIREWORKS CS3 User Guide Note: A newly created fill assumes the current color displayed in the Fill Color box in the Tools panel. You can customize each Live Filter to get the look you want. When you select color correction filters, dialog boxes open containing controls to adjust color characteristics such as auto levels, brightness and contrast, hue and saturation, invert, curves, and color fill.
  • Page 154 ADOBE FIREWORKS CS3 User Guide Applying beveled edges Applying a beveled edge to an object gives it a raised look. You can create an inner bevel or an outer bevel. A rectangle, with Inner Bevel, and with Outer Bevel To apply a beveled edge to a selected object: Click the Add Live Filters button in the Property inspector, then select a bevel option from the pop-up menu: •...
  • Page 155 ADOBE FIREWORKS CS3 User Guide To apply a solid shadow: In the Property inspector, click the Add Live Filters button, point to Shadow and Glow, and then click Solid Shadow. In the Solid Shadow dialog box, adjust the filter settings: •...
  • Page 156 Plug-ins from the Filters menu When you install an Adobe Photoshop plug-in in Fireworks, it is added to the Filters menu and to the Property inspector. You should use the Filters menu to apply filters and Photoshop plug-ins only when you are certain that you will not want to edit or remove the filter.
  • Page 157: Editing Live Filters

    ADOBE FIREWORKS CS3 User Guide Editing Live Filters When you click a Live Filter’s info button in the Property inspector, Fireworks opens a pop-up window with the current settings for the filter, which you can edit. To edit a Live Filter: In the Property inspector, click the info button next to the filter you want to edit.
  • Page 158 ADOBE FIREWORKS CS3 User Guide To create a custom Live Filter using the Property inspector: Apply Live Filter settings to selected objects. For more information, see “Applying Live Filters” on page 147. In the Property inspector, click the Add Live Filters button, then select Options > Save As Style.
  • Page 159 ADOBE FIREWORKS CS3 User Guide A. Save button Enter a command name and click OK to add the command to the Commands menu.
  • Page 160: Chapter 9: Pages, Layers, Masking, And Blending

    In Fireworks, the Layers panel lists layers and the objects contained in each layer. Fireworks layers are similar to layer sets in Adobe Photoshop. Photoshop layers are similar to individual Fireworks objects. Masking gives you creative control over layers and objects. You can apply masks and blending modes from the Layers panel.
  • Page 161: Adding And Removing Pages

    ADOBE FIREWORKS CS3 User Guide Adding and removing pages Using the Pages panel, you can add new pages, delete unwanted pages, and duplicate existing pages. When you create a new page, a blank page is inserted at the end of the list of pages. The new page becomes the active page and is highlighted in the Pages panel.
  • Page 162 ADOBE FIREWORKS CS3 User Guide Using a master page If you have some elements that you want to be common across all of your pages, you can use a master page. When you convert an ordinary page to a master page it moves to the top of the list in the Pages panel and it is colored gray.
  • Page 163 ADOBE FIREWORKS CS3 User Guide Note: If you use the Quick Export button to export the file, only the currently selected page is exported. Choose the location for the export files. Select HTML and Images from the Export pop-up menu.
  • Page 164: Working With Layers

    ADOBE FIREWORKS CS3 User Guide Working with layers Each object in a document resides on a layer. You can either create layers before you draw or add layers as needed. The canvas is below all layers and is not itself a layer. For information on working with the canvas, see “Changing the canvas”...
  • Page 165 ADOBE FIREWORKS CS3 User Guide To activate a layer, do one of the following: • Click the layer name in the Layers panel. • Select an object on that layer. Adding and removing layers Using the Layers panel, you can add new layers, add new sub-layers, delete unwanted layers, and duplicate existing layers and objects.
  • Page 166 ADOBE FIREWORKS CS3 User Guide Viewing layers The Layers panel displays objects and layers in a hierarchical structure. If a document contains many objects and layers, the Layers panel can become cluttered and difficult to navigate. Collapsing the display of layers helps eliminate clutter.
  • Page 167 ADOBE FIREWORKS CS3 User Guide Protecting layers and objects The Layers panel offers a number of options that let you control the accessibility of objects. You can protect objects in your document from inadvertent selection and editing. Locking an individual object prevents that object from being selected or edited.
  • Page 168 ADOBE FIREWORKS CS3 User Guide Merging down causes all selected vector objects and bitmap objects to be flattened into the bitmap object that lies just beneath the bottommost selected object. The result is a single bitmap object. Vector objects and bitmap objects cannot be edited separately once merged, and editability for vector objects is lost.
  • Page 169: Masking Images

    About vector masks If you have used other vector-illustration applications such as Adobe FreeHand, you may be familiar with vector masks, which are sometimes called clipping paths or paste insides. The vector mask object crops or clips the under- lying objects to the shape of its path, creating a cookie-cutter effect.
  • Page 170 ADOBE FIREWORKS CS3 User Guide When a vector mask is selected, the Property inspector displays information about how the mask is applied. The bottom half of the Property inspector displays additional properties that allow you to edit the mask object’s stroke and fill.
  • Page 171 ADOBE FIREWORKS CS3 User Guide Bitmap mask properties in the Property inspector when a bitmap tool is selected By default, most bitmap masks are applied using their grayscale appearance, but you can also apply them using their alpha channel. For more information, see “Changing the way masks are applied” on page 176.
  • Page 172 ADOBE FIREWORKS CS3 User Guide If you are masking multiple objects, the objects must be grouped. For more information about grouping objects, see “Grouping objects” on page 58. Do one of the following to paste the mask: • Select Edit > Paste as Mask.
  • Page 173 ADOBE FIREWORKS CS3 User Guide To create a mask using the Paste Inside command: Select the object or objects to use as the paste inside contents. Position the object or objects so that they overlap the object into which you want to paste the contents.
  • Page 174 ADOBE FIREWORKS CS3 User Guide Using text as a mask Text masks are a type of vector mask. You apply text masks just as you apply masks using existing objects: you simply use text as the mask object. The usual way to apply a text mask is to use its path outline, but you can apply a text mask using its grayscale appearance as well.
  • Page 175 ADOBE FIREWORKS CS3 User Guide Image with mask applied The mask as it appears in the Layers panel Note: For more information about modifying a bitmap mask’s appearance by drawing on it, see “Modifying a mask’s appearance” on page 175.
  • Page 176 ADOBE FIREWORKS CS3 User Guide Draw on the empty mask. In the areas where you draw, the underlying masked object is either hidden or shown, depending on the type of mask you applied. Note: For more information about modifying a bitmap mask’s appearance by drawing on it, see “Modifying a mask’s appearance”...
  • Page 177 ADOBE FIREWORKS CS3 User Guide Fireworks masks can also be exported to Photoshop. They are converted into Photoshop layer masks. If the masked objects include text and you want to maintain text editability in Photoshop, you must select Maintain Editability over Appearance when exporting.
  • Page 178: Editing Masks

    ADOBE FIREWORKS CS3 User Guide Editing masks You can modify masks in many ways. By modifying a mask’s position, shape, and color, you can change the visibility of masked objects. You can also change a mask’s type and the way it is applied. In addition, masks can be replaced, disabled, or deleted.
  • Page 179 ADOBE FIREWORKS CS3 User Guide When selected, masks have a green highlight and masked objects have a blue highlight. Moving masks and masked objects You can reposition masks and masked objects. They can be moved together or independently. To move a mask and its masked objects together: Select the mask on the canvas using the Pointer tool.
  • Page 180 ADOBE FIREWORKS CS3 User Guide Select the Subselection tool and drag the mask’s move handle to a new location. To move masked objects independently of the mask using the move handle: Select the mask on the canvas using the Pointer tool.
  • Page 181 ADOBE FIREWORKS CS3 User Guide To modify a selected mask’s color, do one of the following: • For grayscale bitmap masks, use the bitmap tools to draw on the mask using various grayscale color values. • For grayscale vector masks, change the color of the mask object.
  • Page 182 ADOBE FIREWORKS CS3 User Guide A bitmap mask applied using its alpha channel Both vector and bitmap masks can be applied using their grayscale appearance. Bitmap masks are applied using their grayscale appearance by default. When a mask is applied using its grayscale appearance, the lightness of its pixels determines how much of the masked object is displayed.
  • Page 183 ADOBE FIREWORKS CS3 User Guide Select Modify > Flatten Selection. Adding objects to a masked selection You can add more objects to an existing masked selection. To add masked objects to a masked selection: Select Edit > Cut to cut the selected object or objects you want to add.
  • Page 184: Blending And Transparency

    ADOBE FIREWORKS CS3 User Guide Blending and transparency Compositing is the process of varying the transparency or color interaction of two or more overlapping objects. In Fireworks, blending modes allow you to create composite images. Blending modes also add a dimension of control to the opacity of objects and images.
  • Page 185 ADOBE FIREWORKS CS3 User Guide replaces the color, depending on the blend color. If the blend color is lighter than 50% gray, pixels darker Pin Light than the blend color are replaced, and pixels lighter than the blend color do not change. If the blend color is darker than 50% gray, pixels lighter than the blend color are replaced, and pixels darker than the blend color do not change.
  • Page 186 ADOBE FIREWORKS CS3 User Guide Difference Saturation Color Luminosity Invert Tint Erase Adjusting opacity and applying blends You can use the Property inspector or the Layers panel to adjust the opacity of selected objects and to apply blending modes. An Opacity setting of 100 renders an object completely opaque. A setting of 0 (zero) renders an object completely transparent.
  • Page 187 ADOBE FIREWORKS CS3 User Guide About the Color Fill Live Filter Fireworks also offers a Live Filter that allows you to adjust the color of an object by altering the object’s opacity and blend mode. This Live Filter, called Color Fill, produces the same effect as overlapping an object with one that has a different opacity and blend mode.
  • Page 188: Chapter 10: Using Styles, Symbols, And Urls

    Fireworks has many predefined styles. You can add, change, and remove styles. The Fireworks DVD and the Adobe website have many more predefined styles that you can import into Fireworks. You can also export styles and share them with other Fireworks users or import styles from other Fireworks documents.
  • Page 189 ADOBE FIREWORKS CS3 User Guide Styles panel When you apply a style to an object, you can later update the style without affecting the original object. Fireworks does not keep track of which style you applied to an object. If you delete a custom style, you cannot recover it;...
  • Page 190: Editing Styles

    ADOBE FIREWORKS CS3 User Guide Name the style if you want, and click OK. An icon depicting the style appears in the Styles panel. To base a new style on an existing style: Apply the existing style to a selected object.
  • Page 191: Using Symbols

    ADOBE FIREWORKS CS3 User Guide Using style defaults If you want to delete all custom styles from the Styles panel and restore any deleted default styles, you can reset the Styles panel to its default state. You can also change the size of the icons displayed in the Styles panel.
  • Page 192 ADOBE FIREWORKS CS3 User Guide Select a symbol type: Graphic, Animation, or Button. If you want to use 9-slice scaling guides to scale the symbol, select the Enable 9-slice scaling guides check box. For more information on the 9-slice scaling feature see “Using 9-slice scaling” on page 188.
  • Page 193 ADOBE FIREWORKS CS3 User Guide • Select an instance and select Modify > Symbol > Edit Symbol. • Select a symbol in the Library panel and choose Edit Symbol from the Options menu. Make changes to the symbol and close the window.
  • Page 194 ADOBE FIREWORKS CS3 User Guide The following figure shows how images are scaled using the 9-slice scaling feature. The 9-slice scaling guides are enabled in the Symbol Editor and Button Editor for all symbols by default. To scale a symbol using 9-slice scaling: Double click the symbol or button to open the Symbol Editor or Button Editor.
  • Page 195 ADOBE FIREWORKS CS3 User Guide Creating and using rich graphic symbols Rich symbols are a type of graphic symbol that can be intelligently scaled and given specific attributes using a JavaS- cript (JSF) file. These attributes can then be controlled by using the Symbol Properties panel (Window > Symbol Properties).
  • Page 196 User Guide Click the browse button in the upper right corner of the panel and browse to the symbol PNG file. This is saved in the <user settings>\Application Data\Adobe\Fireworks 9\Common Library\Custom Symbols (Windows), or <user name>/Application Support/Adobe/Fireworks9/Common Library/Custom Symbols (Macintosh) directory, by default.
  • Page 197 ADOBE FIREWORKS CS3 User Guide The Create Symbol Script panel allows non-programmers to assign some simple symbol attributes and create the JavaScript file automatically. To open this panel, select Create Symbol Script from the Commands menu. The JavaScript file Two functions in the JavaScript file must be defined in order to add editable parameters to the symbol: •...
  • Page 198 ADOBE FIREWORKS CS3 User Guide function applyCurrentValues() var currValues = Widget.elem.customData["currentValues"]; //color_bg is the Layer name in the PNG that will change colors var color_bg = Widget.GetObjectByName("color_bg"); color_bg.pathAttributes.fillColor = currValues[0].value; switch (Widget.opCode) case 1: setDefaultValues(); break; case 2: applyCurrentValues(); break;...
  • Page 199 ADOBE FIREWORKS CS3 User Guide • Opacity • Filters • Width and height • x and y coordinates Note: Button instances have additional properties that can be edited without affecting the symbol. For more information about editing button instances, see “Editing button symbols” on page 224.
  • Page 200 ADOBE FIREWORKS CS3 User Guide The imported symbols appear in the Library panel. You can also import and export individual symbols into and out of the Library panels of multiple documents by dragging and dropping or copying and pasting instances.
  • Page 201: Working With Urls

    Absolute URLs are complete URLs that include the server protocol, which is usually http:// for web pages. For example, http://www.adobe.com/support/fireworks is the absolute URL for the Fireworks Support web page. Absolute URLs remain accurate regardless of the location of the source document, but they do not link correctly if the target document is moved.
  • Page 202: Working With Pages

    URLs and then create a library of them. URLs.htm and any new libraries you create are stored in the URL Libraries folder in the Adobe/Fireworks folder in your user-specific Application Data (Windows) or Application Support (Macintosh) folder. For information on locating this folder, see “Working with configuration files”...
  • Page 203 ADOBE FIREWORKS CS3 User Guide To simultaneously add a URL to the library while assigning it to a web object: Select the object. Do one of the following to enter the URL: • Select Add URL from the URL panel Options menu, enter an absolute or relative URL, and click OK.
  • Page 204 ADOBE FIREWORKS CS3 User Guide Select an HTML file and click Open. All URLs in this file are imported.
  • Page 205: Chapter 11: Slices, Rollovers, And Hotspots

    Chapter 11: Slices, Rollovers, and Hotspots Slices are the basic building blocks for creating interactivity in Fireworks. Slices are web objects—they exist not as images, but ultimately as HTML code. You can view, select, and rename them through the Web Layer in the Layers panel.
  • Page 206 ADOBE FIREWORKS CS3 User Guide Slicing allows you to easily update parts of a web page that change frequently. For Updating parts of a web page example, your company’s web page might have an employee-of-the-month section that changes monthly. Slicing enables you to quickly change just the employee’s name and photo without replacing the entire page.
  • Page 207 Note: Alternatively, you can add HTML text-formatting tags to the HTML after it has been exported using a text editor or HTML editor such as Adobe Dreamweaver. Click OK to apply your changes and close the Edit HTML Slice window.
  • Page 208 ADOBE FIREWORKS CS3 User Guide Viewing and displaying slices and slice guides You can control the visibility of slices and other web objects in your document using the Layers panel and the Tools panel. When you turn slice visibility off for the whole document, slice guides are hidden too.
  • Page 209 ADOBE FIREWORKS CS3 User Guide To change the color of a selected slice object: ❖ In the Property inspector, select a new color from the color box. To change the color of slice guides: Select View > Guides > Edit Guides.
  • Page 210: Making Slices Interactive

    ADOBE FIREWORKS CS3 User Guide The pointer changes to the guide movement pointer. Drag the slice guide to the desired location. The slices are resized, and all adjacent slices are automatically resized as well. To reposition a slice guide to the far edge of the canvas, ❖...
  • Page 211 ADOBE FIREWORKS CS3 User Guide • The Behaviors panel allows you to create more complex interactivity. The Behaviors panel contains a variety of interactive behaviors you can attach to slices. By attaching multiple behaviors to a single slice, you can create interesting effects.
  • Page 212 ADOBE FIREWORKS CS3 User Guide The simplest rollover swaps an image in Frame 1 with an image directly below it in Frame 2. You can build more complicated rollovers as well. Swap-image rollovers can swap in images from any frame; disjoint rollovers swap in an image from a slice other than the trigger slice.
  • Page 213 ADOBE FIREWORKS CS3 User Guide Note: You can select the slice while in any frame. Click the behavior handle and select Simple Rollover from the menu. Click the Preview tab and test the simple rollover, or press F12 to preview it in a browser.
  • Page 214 ADOBE FIREWORKS CS3 User Guide A slice triggering a rollover behavior and a disjoint rollover behavior Note: You can also add multiple behaviors using the Behaviors panel. For more information, see “Using the Behaviors panel to add interactivity to slices” on page 209.
  • Page 215 ADOBE FIREWORKS CS3 User Guide sets a slice to be a part of a Fireworks navigation bar. Each slice that is part of the navigation bar Set Nav Bar Image must have this behavior. The Set Nav Bar Image option is actually a behavior group containing the Nav Bar Over, Nav Bar Down, and Nav Bar Restore behaviors.
  • Page 216: Preparing Slices For Export

    ADOBE FIREWORKS CS3 User Guide Click the arrow beside the event and select a new event from the pop-up menu: triggers the behavior when the pointer rolls over the trigger area. onMouseOver triggers the behavior when the pointer leaves the trigger area.
  • Page 217: Assigning Urls

    ADOBE FIREWORKS CS3 User Guide Using the Property inspector or the Layers panel, you can give slices unique names. Fireworks uses the name you specify to name the files that are generated from slicing upon export. If you don’t enter a slice name in the Property inspector or the Layers panel, Fireworks automatically names slices for you upon export.
  • Page 218: Export Settings

    ADOBE FIREWORKS CS3 User Guide Export settings You can optimize a slice by selecting an option from the Export Settings pop-up menu in the Property inspector or Optimize panel. You can select from common export settings to quickly set a file format and apply several format- specific settings.
  • Page 219 ADOBE FIREWORKS CS3 User Guide Option Description Slice # (1,2,3...) The element is labeled numerically or alphabetically, according to the style you select. Slice # (01,02,03...) Slice # (A,B,C...) Slice # (a,b,c...) row/column (r3_c2, r4_c7...) Row (r##) and Col (c##) designate the rows and columns of the table that web browsers use to reconstruct a sliced image.
  • Page 220 ADOBE FIREWORKS CS3 User Guide Note: Use caution when selecting None as a menu option for slice auto-naming. If you select None as the option for any of the first three menus, Fireworks exports slice files that overwrite one another, resulting in a single exported graphic and a table that displays this graphic in every cell.
  • Page 221: Working With Hotspots And Image Maps

    ADOBE FIREWORKS CS3 User Guide Working with hotspots and image maps Web designers can use hotspots to make small parts of a larger graphic interactive, linking areas of web graphics to a URL. You can create an image map in Fireworks by exporting HTML from a document that contains hotspots.
  • Page 222 ADOBE FIREWORKS CS3 User Guide Drag the hotspot tool to draw a hotspot over an area of the graphic. Hold down Alt (Windows) or Option (Macintosh) to draw from a center point. Note: You can adjust the position of a hotspot as you drag to draw it. While holding down the mouse button, simply press and hold down the Spacebar, then drag the hotspot to another location on the canvas.
  • Page 223 ADOBE FIREWORKS CS3 User Guide Creating image maps After you’ve inserted several hotspots on top of a desired graphic, you must export the graphic as an image map so it will function in a web browser. Exporting an image map generates the graphics and the HTML containing map information for hotspots and corresponding URL links.
  • Page 224 ADOBE FIREWORKS CS3 User Guide Note: A hotspot can trigger only a disjoint rollover. It cannot be the target of a rollover coming from another hotspot or slice. After you create a disjoint rollover with a hotspot, the connecting blue line remains visible only while the hotspot is selected.
  • Page 225: Chapter 12: Creating Buttons And Pop-Up Menus

    When you export a button or pop-up menu, Fireworks automatically generates the CSS code or JavaScript necessary to display it in a web browser. In Adobe Dreamweaver, you can easily insert CSS code, JavaScript, and HTML code from Fireworks into your web pages, or you can cut and paste the code into any HTML or CSS file.
  • Page 226 ADOBE FIREWORKS CS3 User Guide About button states A button can have up to four different states. Each state represents the button’s appearance in response to a mouse event: is the default or at-rest appearance of the button. The Up state is the way the button appears when the pointer is moved over it.
  • Page 227 ADOBE FIREWORKS CS3 User Guide • Click Copy Up Graphic to paste a copy of the Up state button into the Over window, and then edit it to change its appearance or text. • Drag and drop, import, or draw a graphic.
  • Page 228 ADOBE FIREWORKS CS3 User Guide In the pop-up menu that appears, do one of the following: • Select Bevel and Emboss > Inner Bevel. • Select Bevel and Emboss > Outer Bevel. In the pop-up window that appears, select a button preset filter. These are described below.
  • Page 229 • Select Edit > Libraries and import button symbols into the document’s Library panel from the button libraries on the submenu. These libraries contain a wide variety of premade button symbols prepared by Adobe. You import and export button symbols just as you import and export animation and graphic symbols. For more information, see “Importing symbols”...
  • Page 230 ADOBE FIREWORKS CS3 User Guide • Size and position of the active area • Core button behavior • Optimization and export settings • URL link (also available as an instance-level property) • Target frame (also available as an instance-level property)
  • Page 231 ADOBE FIREWORKS CS3 User Guide Setting interactive button properties With Fireworks, you can control the interactive elements of a button, including the active area, URL, target, and alternative (alt) image description. Modifying the active area of a button symbol The active area of a button symbol triggers interactivity when a user moves the pointer over it or clicks it in a web browser.
  • Page 232 ADOBE FIREWORKS CS3 User Guide • Select a URL from the URL panel. Note: Changing the URL for a button symbol won’t change the URL for existing button instances of that symbol that already have unique URLs assigned to them. This also applies to changes made to a button symbol’s target and alt text.
  • Page 233: Creating Navigation Bars

    ADOBE FIREWORKS CS3 User Guide Setting the alternate (alt) text for a button symbol or instance Alternate (alt) text appears on or near an image placeholder while an image is downloading from the web or in place of an image if it fails to download. It also replaces graphics if the user has the browser set to refrain from displaying images.
  • Page 234: Creating Pop-Up Menus

    ADOBE FIREWORKS CS3 User Guide Creating pop-up menus Pop-up menus are displayed in a browser when the user moves a pointer over or clicks a triggering web object, such as a slice or hotspot. You can attach URL links to pop-up menu items for navigation. For example, you can use pop- up menus to organize several navigation options that are related to a button in a nav bar.
  • Page 235 ADOBE FIREWORKS CS3 User Guide Depending on the design of the pop-up menu, you may not use all the tabs or options in the Pop-up Menu Editor. You can edit settings in any tab anytime, but you must add at least one menu item in the Content tab to create a menu that you can preview in a browser.
  • Page 236 ADOBE FIREWORKS CS3 User Guide Creating submenus within a pop-up menu Using the Indent Menu and Outdent Menu buttons on the Content tab of the Pop-up Menu Editor, you can create submenus—pop-up menus that appear when the user moves the pointer over or clicks another pop-up menu item.
  • Page 237 ADOBE FIREWORKS CS3 User Guide Click Done. Designing the appearance of a pop-up menu After you create a basic menu and optional submenus, you can format the text, apply graphic styles to the Over and Up states, and select vertical or horizontal orientation in the Appearance tab of the Pop-up Menu Editor.
  • Page 238 ADOBE FIREWORKS CS3 User Guide For information on opening an existing pop-up menu in the Pop-up Menu Editor, see “Editing pop-up menus” on page 236. Select a preset size from the Size pop-up menu or enter a value in the Size text box.
  • Page 239 ADOBE FIREWORKS CS3 User Guide Setting advanced pop-up menu properties The Advanced tab of the Pop-up Menu Editor offers additional settings to control cell size, padding, and spacing; text indention; menu disappearance delay; and border width, color, shadow, and highlight.
  • Page 240 ADOBE FIREWORKS CS3 User Guide Do one of the following to complete the pop-up menu or continue building it: • Click Next to move to the Position tab or select another tab to continue building the pop-up menu. • Click Done to close the Pop-up Menu Editor. In the workspace, the hotspot or slice on which you built the pop- up menu displays a blue behavior line attached to an outline of the top level of the pop-up menu.
  • Page 241 ADOBE FIREWORKS CS3 User Guide To set the position for a pop-up submenu using the Pop-up Menu Editor: With the desired pop-up menu open in the Pop-up Menu Editor, click the Position tab. For information on opening an existing pop-up menu in the Pop-up Menu Editor, see “Editing pop-up menus” on page 236.
  • Page 242 ADOBE FIREWORKS CS3 User Guide To move an entry in the pop-up menu: With the desired pop-up menu displayed in the Pop-up Menu Editor, click the Content tab. Drag the menu item to a new location in the list. Click Done.
  • Page 243: Chapter 13: Creating Animations

    The Optimize panel lets you set optimization and export settings to control how your file is created. Fireworks can export animations as animated GIF or Adobe Flash SWF files. You can also import Fireworks animations directly into Flash for further editing.
  • Page 244: Working With Animation Symbols

    ADOBE FIREWORKS CS3 User Guide Note: Degree and direction of movement options are found only in the Animate dialog box. Use the Frame Delay controls in the Frames panel to set the speed of the animated motion. For more information, see “Setting the frame delay”...
  • Page 245 Although the default is 72, you can enter any number you wish in the Move text box. Movement is linear, and there are no keyframes (unlike in Flash and Adobe Director). is the direction, in degrees, in which you want the object to move. Values range from 0 to 360º. This option Direction is available only in the Animate dialog box.
  • Page 246 ADOBE FIREWORKS CS3 User Guide To change animation symbol properties: Select an animation symbol. Select Modify > Animation > Settings to open the Animate dialog box or Window > Properties to open the Property inspector if it is not already open.
  • Page 247: Working With Frames

    ADOBE FIREWORKS CS3 User Guide You can change the direction of the motion by changing the angle of the path. To change movement or direction: ❖ Drag one of the symbol’s animation start or end handles to a new location. The green point indicates the starting point;...
  • Page 248 ADOBE FIREWORKS CS3 User Guide Enter a value for the frame delay. Press Enter, or click outside the panel to close the pop-up window. Showing and hiding frames for playback You can show or hide frames for playback. If a frame is hidden, it is not displayed during playback and it is not exported.
  • Page 249 ADOBE FIREWORKS CS3 User Guide To copy a selected frame and place it in a sequence: Select Duplicate Frame from the Frames panel Options menu. Enter the number of duplicates to create for the selected frame, select where the duplicate frames are to be inserted, and click OK.
  • Page 250: Using Onion Skinning

    ADOBE FIREWORKS CS3 User Guide To share a layer across frames: Click the layer to select it. Select Share Across Frames. Note: All the contents in a shared layer appear in every frame. To disable the sharing of a layer across frames: Click the shared layer to select it.
  • Page 251: Tweening

    ADOBE FIREWORKS CS3 User Guide turns off onion skinning and displays only the contents of the current frame. No Onion Skinning displays the contents of the current frame and the next frame. Show Next Frame displays the contents of the current and adjacent frames.
  • Page 252: Exporting Your Animation

    ADOBE FIREWORKS CS3 User Guide • To set how long each frame appears in the Document window, enter frame delay settings in the Frames panel. • Frames excluded from the export do not appear in the preview. • Previewing the animation in the Original view displays the full-resolution source graphic, not the optimized preview used for the exported file.
  • Page 253: Working With Existing Animations

    ADOBE FIREWORKS CS3 User Guide From the Transparency pop-up menu in the Optimize panel, select either Index Transparency or Alpha Trans- parency. For a description of these options, see “Making areas transparent” on page 271. Use the transparency tools in the Optimize panel to select colors for transparency.
  • Page 254: Using Multiple Files As One Animation

    ADOBE FIREWORKS CS3 User Guide Imported GIFs lose their original frame delay settings and assume the frame delay of the current document. Because the imported file is an animation symbol, you can apply additional motion to it. For example, you can import an animation of a man walking in place and then apply direction and motion properties to have the man walk across the screen.
  • Page 255: Chapter 14: Creating Slideshows

    • Apply slide transitions to images in the album • Export the slideshow to a specific folder • Use a default Fireworks album player for your slideshow, or find more players on the Fireworks Adobe Exchange site The Create Slideshow output is built so that any Flash designer/developer can build a Fireworks Album Player in Flash that uses the generated XML output.
  • Page 256 ADOBE FIREWORKS CS3 User Guide If you are a Flash designer or developer, you can also build a custom album player in Flash to display the Fireworks Album Creator’s XML output. For more information, see “Creating a custom Fireworks album player” on page 254.
  • Page 257: Slideshow Properties

    ADOBE FIREWORKS CS3 User Guide To delete an album: Select Commands > Create Slideshow. In the Create Slideshow window, select Albums > Open an existing AlbumBook. Browse to the folder that contains the existing slideshow XML file and click Open.
  • Page 258 ADOBE FIREWORKS CS3 User Guide Starts the slideshow automatically when the player opens. Auto-Start Slideshow: Allows the viewer to click and open the image in a new browser window. This allows the Allow clicking images: viewer of the slideshow to save images, view them in new tab, or view the full-sized version of the image.
  • Page 259: Creating A Custom Fireworks Album Player

    ADOBE FIREWORKS CS3 User Guide Slideshow Properties panel Use these options to customize the currently selected slideshow. Apply the specified options to all albums in the AlbumBook or only to the currently selected Apply to all albums: album. Number of seconds between each image.
  • Page 260 ADOBE FIREWORKS CS3 User Guide <?xml version=”1.0” encoding=”utf-8”?> <FWACPlayer> <Player name=”Player - Black (Flash)” preview=”player_black.jpg” launch=”index.html”> <File src=”player_black.fap” dst=”player_black.swf ”/> <File src=”player_black.html” dst=”index.html” /> <Info src=”player_black.info”/> </Player> <Player name=”Player - White (Flash)” preview=”player_white.jpg” launch=”index.html”> <File src=”player_white.fap” dst=”player_white.swf ”/> <File src=”player_white.html” dst=”index.html”...
  • Page 261 ADOBE FIREWORKS CS3 User Guide showThumbnails: whether or not to show thumbnails; or, whether or not thumbnails were exported thumbWidth: width of thumbnail thumbHeight: height of thumbnail autoStart: starts the slideshow automatically allowClick: whether or not to allow users to click the images...
  • Page 262: Chapter 15: Optimizing And Exporting

    Chapter 15: Optimizing and Exporting The ultimate goal in web graphic design is to create great-looking images that download as fast as possible. To do that, you must select a file format with the best compression for your image while maintaining as much quality as possible.
  • Page 263: Using The Export Wizard

    ADOBE FIREWORKS CS3 User Guide • Adjusting the colors in the graphic (for 8-bit file formats only). You can limit colors by confining the image to a specific set of colors called a color palette. Then you trim unused colors from the color palette. Fewer colors in the palette means fewer colors in the image, which results in a smaller file size for paletted image file types.
  • Page 264 ADOBE FIREWORKS CS3 User Guide A. Saved set of options for the selected export B. File size and download time estimates C. Preview chosen export settings D. Save export settings in the active view You can use split views to compare various settings to find the smallest file size that maintains an acceptable level of quality.
  • Page 265 ADOBE FIREWORKS CS3 User Guide Note: When you zoom or pan while multiple views are open, all views zoom and pan simultaneously. Click Export when you have finished changing settings. In the Export dialog box, type a name for the file, select a destination, set any other options if desired, and click Save.
  • Page 266: Optimizing In The Workspace

    ADOBE FIREWORKS CS3 User Guide • Enter pixel coordinates for the boundaries of the export area. To set animation settings using Image Preview: Click the Animation tab. Use the following techniques to preview animation frames: • To display a single frame, select the desired frame in the list on the left side of the dialog box, or use the frame controls in the lower right area of the dialog box.
  • Page 267 ADOBE FIREWORKS CS3 User Guide You don’t have to use the Export Wizard and Image Preview in Fireworks if you’re comfortable optimizing and exporting graphics. Fireworks has optimization and export features in the workspace that give you greater control over how files are exported: •...
  • Page 268 ADOBE FIREWORKS CS3 User Guide is a color palette that contains only the actual colors used in the graphic. The color palette contains GIF Adaptive 256 up to a maximum of 256 colors. sets quality to 80 and smoothing to 0, resulting in a high-quality but larger graphic.
  • Page 269 ADOBE FIREWORKS CS3 User Guide When you optimize a selected slice, the slices not being optimized are dimmed. To preview a graphic based on the current optimization settings: ❖ Click the Preview button in the upper left of the Document window.
  • Page 270 ADOBE FIREWORKS CS3 User Guide Choosing a file type You should base your choice of file format upon the design and use of your graphic. A graphic’s appearance can vary from one format to another, especially when different types of compression are used. In addition, only certain graphic file types are accepted by most web browsers.
  • Page 271 ADOBE FIREWORKS CS3 User Guide Choosing a color palette GIFs and other 8-bit image formats contain a color palette. A color palette is a list of up to 256 colors available to the file. Only colors defined in the color palette appear in the graphic; however, some color palettes contain colors that are not in the graphic.
  • Page 272 ADOBE FIREWORKS CS3 User Guide To select a color depth: ❖ Select an option from the Colors pop-up menu in the Optimize panel or type a value in the text box. You can select from 2 to 256 colors. Note: The actual colors in the image could be lower than the maximum number of colors you select. The number at the bottom of the color table indicates the actual number of colors visible in the image.
  • Page 273 ADOBE FIREWORKS CS3 User Guide Viewing colors in a palette The color table in the Optimize panel displays colors in the current preview when you are working in 8-bit color or less and lets you modify an image’s palette. The color table updates automatically when you are in Preview mode. It appears empty if you are optimizing more than one slice at a time or if you are not optimizing in an 8-bit format such as GIF.
  • Page 274 ADOBE FIREWORKS CS3 User Guide To select a range of colors: Click a color. Hold Shift and click the last color in the range you want to select. To preview all the pixels in the document that contain a specific color: Click the Preview button at the upper left of the Document window.
  • Page 275 You can save custom palettes as external palette files. You can use saved palettes with other Fireworks documents or in other applications that support external palette files, such as Adobe FreeHand, Adobe Flash, and Adobe Photoshop. Saved palette files have the .act extension.
  • Page 276 Alpha transparency is also useful for exporting files to Flash or Adobe Director, because both applications support this type of transparency. Note: Setting colors to transparent affects only the exported version of the image, not the actual image. You can see what the exported image will look like in a preview.
  • Page 277 ADOBE FIREWORKS CS3 User Guide • Click a color in the document. To add or remove transparent colors: Click the Preview, 2-Up, or 4-Up button at the upper left of the Document window. In 2-Up or 4-Up view, click a view other than the original.
  • Page 278 ADOBE FIREWORKS CS3 User Guide Adjusting JPEG quality JPEG is a lossy format, which means that some image data is discarded when it is compressed, reducing the quality of the final file. However, image data can sometimes be discarded with little or no noticeable difference in quality.
  • Page 279 ADOBE FIREWORKS CS3 User Guide Select Preserve Text Quality. All text items will automatically be exported at a higher level, regardless of the Selective Quality value. Select Preserve Button Quality. All button symbols will automatically be exported at a higher level.
  • Page 280 ADOBE FIREWORKS CS3 User Guide By setting the Matte option in the Optimize panel, you can anti-alias objects that lie directly above the canvas to the Matte color. This is useful when exporting or saving graphics for placement on web pages with colored backgrounds.
  • Page 281: Exporting From Fireworks

    ADOBE FIREWORKS CS3 User Guide • File > Export Fireworks then applies these settings to new documents. Note: As in previous versions of Fireworks, new slices still get their default optimization settings from the parent document. You can also save custom optimization settings for future use in optimization or batch processing. The following information is saved in custom preset optimizations: •...
  • Page 282 ADOBE FIREWORKS CS3 User Guide The current export/save location, which is defined anytime you browse away from the default location presented in a Save, Save As, Save a Copy, or Export dialog box The current file’s location The default location where new documents or images are saved on your operating system In contrast, the default location where Fireworks saves a document is determined by a different set of criteria.
  • Page 283 ADOBE FIREWORKS CS3 User Guide (Optional) Select Put Images in Subfolder. Click Export. The files Fireworks exported appear on your hard disk. Images and an HTML file are generated in the location you specified in the Export dialog box. For more information about the options available in the Export dialog box when HTML and Images is selected as the file type, see “Exporting Fireworks HTML”...
  • Page 284 ADOBE FIREWORKS CS3 User Guide If you retain the original filename for the updated slice and upload the slice to the same place on your website where the original came from, the new slice replaces the original slice in the HTML document.
  • Page 285 ADOBE FIREWORKS CS3 User Guide Type a filename and select a destination folder. In the Export pop-up menu, select one of the following: exports frames as multiple files. Frames to Files exports layers as multiple files. Layers to Files Note: This exports all layers on the current frame.
  • Page 286 • Use the Update HTML command to make changes to an HTML file you’ve previously created. Note: Adobe Dreamweaver shares a tight integration with Fireworks. Fireworks handles the export of HTML to Dream- weaver differently than it handles export to other HTML editors. If you are exporting Fireworks HTML to Dreamweaver, see “Working with Dreamweaver”...
  • Page 287 Fireworks and Dreamweaver. These files have an .mno extension. Exporting Fireworks HTML Fireworks lets you export HTML in Generic, Dreamweaver, FrontPage, and Adobe GoLive formats. Generic HTML works in most HTML editors. Exporting Fireworks HTML generates an HTML file and the associated image files in a location you specify.
  • Page 288 ADOBE FIREWORKS CS3 User Guide Click OK to return to the Export dialog box. Select Export HTML file from the HTML pop-up menu. Choosing Export HTML generates an HTML file and the associated image files in the location you specify.
  • Page 289 ADOBE FIREWORKS CS3 User Guide To copy Fireworks HTML using the Export dialog box: Select File > Export. Note: Optionally, if you are exporting to Dreamweaver, click the Quick Export button and select Copy HTML to Clipboard from the Dreamweaver submenu.
  • Page 290 ADOBE FIREWORKS CS3 User Guide If your Fireworks document contains interactive elements, you’ll need to copy the JavaScript code as well. JavaScript code is surrounded by tags and is located in the section of the document. Copy and <SCRIPT> <HEAD>...
  • Page 291 ADOBE FIREWORKS CS3 User Guide exports all frames as CSS layers. Fireworks Frames exports the slices in the document as CSS layers. Fireworks Slices Select Trim Images to automatically crop the exported images and layers to fit the objects. Select Put Images in Subfolder to choose a folder for images.
  • Page 292 ADOBE FIREWORKS CS3 User Guide Note: For more information on HTML setup options, see “Setting HTML export options” on page 287. Export your document using any of the methods available for exporting or copying HTML. For information about the various ways you can export and copy HTML from Fireworks, see “Exporting HTML” on page 280.
  • Page 293 ADOBE FIREWORKS CS3 User Guide • Select a formula for auto-naming slices in the Slice Auto-Naming pop-up menus. You can use the default settings, or choose your own options. Note: Use caution when selecting None as a menu option for slice auto-naming. If you select None as the option for any of the first three menus, Fireworks exports slice files that overwrite one another, resulting in a single exported graphic and a table that displays this graphic in every cell.
  • Page 294: Sending A Fireworks Document As An E-Mail Attachment

    ADOBE FIREWORKS CS3 User Guide Customizing the Quick Export pop-up menu You can add additional options to the Quick Export pop-up menu if you know JavaScript and XML. To add options to the Quick Export pop-up menu: Create your own JSF files and drop them into the Quick Export Menu folder on your hard disk.
  • Page 295 ADOBE FIREWORKS CS3 User Guide checks the file out, overwriting the local file with the remote copy. Check Out is enabled in Fireworks Check Out only if the Enable File Check In and Check Out option is enabled in Dreamweaver for the site in which the document lives.
  • Page 296: Chapter 16: Using Fireworks With Other Applications

    You can export Fireworks graphics to many applications, including other Adobe products. When used with other Adobe applications, Fireworks offers powerful integration features: • Fireworks can be opened to edit selected graphics from inside many Adobe applications, such as Adobe Dream- weaver, Adobe Flash, HomeSite, Adobe FreeHand, and Adobe Director.
  • Page 297: Working With Dreamweaver

    ADOBE FIREWORKS CS3 User Guide Working with Dreamweaver Unique integration features make it easy to work on files interchangeably in Dreamweaver and Fireworks. Dream- weaver and Fireworks recognize and share many of the same file edits, including changes to links, image maps, table slices, and more.
  • Page 298 ADOBE FIREWORKS CS3 User Guide When you create a Fireworks image from a Dreamweaver image placeholder, a new Fireworks document is created with a canvas of the same dimensions as the selected placeholder. Inside Fireworks, you can use any Fireworks tools to create your graphic.
  • Page 299 ADOBE FIREWORKS CS3 User Guide Fireworks is opened with an empty canvas that is exactly the same size as the placeholder image. The Document window indicates that you are editing an image from Dreamweaver. Create an image in Fireworks and click Done when you are finished.
  • Page 300 ADOBE FIREWORKS CS3 User Guide Exporting Fireworks HTML to Dreamweaver Exporting Fireworks files to Dreamweaver is a two-step process. From Fireworks, you export files directly to a Dreamweaver site folder. This generates an HTML file and the associated image files in the location you specify. You then place the HTML code into Dreamweaver using the Insert Fireworks HTML feature.
  • Page 301 ADOBE FIREWORKS CS3 User Guide Copying code from an exported Fireworks file and pasting it into Dreamweaver You can open an exported Fireworks HTML file in Dreamweaver and then manually copy and paste only the desired sections into another Dreamweaver document.
  • Page 302 ADOBE FIREWORKS CS3 User Guide Note: Dreamweaver library items do not support pop-up menus. To export a Fireworks document as a Dreamweaver library item: Select File > Export. Select Dreamweaver Library from the Save as Type pop-up menu. Select the Library folder in your Dreamweaver site as the location in which to place the files. If this folder does not exist, use the Select Folder dialog box to create or locate the folder.
  • Page 303 ADOBE FIREWORKS CS3 User Guide About Roundtrip HTML Fireworks recognizes and preserves most types of edits made to a document in Dreamweaver, including changed links, edited image maps, edited text and HTML in HTML slices, and behaviors shared between Fireworks and Dreamweaver.
  • Page 304 “Setting launch-and-edit options” on page 302. Note: You may get a Dreamweaver error if you nest another table inside the original Fireworks-generated table and then try to edit the table using Roundtrip editing in Dreamweaver. For more information, see TechNote 19231 on the Adobe website.
  • Page 305 ADOBE FIREWORKS CS3 User Guide Dreamweaver supports all behaviors applied in Fireworks, including those required for rollovers and buttons. The following Dreamweaver behaviors are supported by Fireworks during a launch-and-edit session: • Simple Rollover • Swap Image • Swap Image Restore •...
  • Page 306 ADOBE FIREWORKS CS3 User Guide A dialog box opens. Although the title bar doesn’t display this name, this is actually the Fireworks Export Preview dialog box. Make the desired edits in the Export Preview dialog box: • To edit optimization settings, click the Options tab.
  • Page 307 ADOBE FIREWORKS CS3 User Guide To edit a placed animation’s settings, see “Optimizing Fireworks images and animations placed in Dreamweaver” on page 300 and “Using Export Preview” in Fireworks Help. Setting launch-and-edit options To use Roundtrip HTML effectively, you should perform some preliminary tasks, such as setting Fireworks as your primary image editor in Dreamweaver and specifying launch-and-edit preferences in Fireworks.
  • Page 308 ADOBE FIREWORKS CS3 User Guide In the Editors list, if Fireworks appears in the list, select it. If Fireworks is not in the list, click the Plus (+) button, locate the Fireworks application on your hard disk, and click Open.
  • Page 309 ADOBE FIREWORKS CS3 User Guide To specify launch-and-edit preferences for Fireworks: In Fireworks, choose Edit > Preferences. Note: On Mac OS X, choose Fireworks > Preferences. Click the Launch and Edit tab (Windows) or choose Launch and Edit from the pop-up menu (Macintosh).
  • Page 310: Working With Flash

    ADOBE FIREWORKS CS3 User Guide Working with Flash Fireworks integrates well with Flash. You can easily import, copy and paste, or export Fireworks vectors, bitmaps, animations, and multi-state button graphics for use in Flash. Launch-and-edit functionality also makes it easy to edit Fireworks graphics from within Flash.
  • Page 311 ADOBE FIREWORKS CS3 User Guide The Import Fireworks Document dialog box appears. Do one of the following: Select the Import as a Single, Flattened Bitmap option if you want to import the file as a single bitmap image and lose all editability. If the PNG has multiple pages, only the first page is imported.
  • Page 312 ADOBE FIREWORKS CS3 User Guide preserves the editability of all text. If text objects contain special fills, strokes, or effects that Keep all text editable Flash does not support, those properties are either lost or converted to their Flash equivalents, which may not look the same.
  • Page 313 ADOBE FIREWORKS CS3 User Guide Select the way you’ d like text imported: preserves the editability of text, unless it has special fills, strokes, or Import as bitmaps to maintain appearance effects that Flash does not support. To preserve the appearance of such text, Flash converts it to a non-editable bitmap image.
  • Page 314 About exporting Fireworks graphics to other formats for use in Flash You can export Fireworks graphics as JPEG, GIF, PNG, and Adobe Illustrator 7 (AI) files, and then import them into Flash.
  • Page 315 ADOBE FIREWORKS CS3 User Guide For information on exporting JPEG and GIF files, see Fireworks Help. For information on exporting to PNG format, see “Exporting PNG files with transparency” on page 311. For information on importing any of these formats into Flash, see “Importing exported Fireworks graphics and animations into Flash”...
  • Page 316 ADOBE FIREWORKS CS3 User Guide In the Objects section, choose one of the following: allows you to maintain path editability. Effects and formatting are lost. Maintain Paths converts vector objects to bitmap objects as needed and preserves the appearance of applied Maintain Appearance strokes and fills.
  • Page 317: Working With Freehand

    The procedures provided in this section apply not only to using Fireworks with FreeHand but also to using Fireworks with other vector graphics applications, such as Adobe Illustrator and CorelDraw. For more information, see “Working with other vector graphics applications” on page 316.
  • Page 318 ADOBE FIREWORKS CS3 User Guide Note: Use the Property inspector to change selected objects to Anti-Alias or Hard Edge. specifies how multi-page documents are handled when imported: File Conversion • The Open a Page option imports only the specified page.
  • Page 319 ADOBE FIREWORKS CS3 User Guide Create a new document in Fireworks or open an existing one. Select Edit > Paste. To drag a FreeHand graphic into Fireworks: ❖ Drag the graphic from FreeHand into an open document in Fireworks. In Windows, if your FreeHand and Fireworks applications are maximized, drag the FreeHand graphic to the Fireworks button in the taskbar.
  • Page 320 ADOBE FIREWORKS CS3 User Guide imports Fireworks frames as separate layers. Open Frames as Layers Select a frame to import from the Frame pop-up menu. To import all frames, select All. Note: The All option is available only if you are opening frames as layers or if you are opening a PNG file (rather than importing it).\...
  • Page 321 Working with other vector graphics applications Fireworks can share vector graphics with other vector graphics applications, such as Adobe Illustrator. In Fireworks, you export and import vector graphics from these applications in the same way that you export and import graphics from FreeHand.
  • Page 322: Working With Director

    ADOBE FIREWORKS CS3 User Guide • Live Filters • Blending modes • Textures, pattern fills, web dither fills, and gradient fills • Slice objects and image maps • Many text-formatting options • Guides, grids, and canvas color • Bitmap images •...
  • Page 323 ADOBE FIREWORKS CS3 User Guide Select Director from the Save As pop-up menu. Select an option from the Source pop-up menu: exports each layer in the document. Select this option if you are exporting layered content or an Fireworks Layers animation.
  • Page 324 ADOBE FIREWORKS CS3 User Guide Change options if desired: allows you to specify a color depth for the imported graphics. If they contain transparency, choose 32-bit color. Color allows you to set the registration point for the imported graphics. Registration converts Fireworks behaviors to Lingo code.
  • Page 325: Working With Homesite

    ADOBE FIREWORKS CS3 User Guide In Fireworks, change the optimization settings as desired. Click Update when finished. Click Done if the MIX Editing dialog box appears. The image is updated in Director using the new settings. Working with HomeSite You can use Fireworks and HomeSite® together to create and edit web pages. Exporting and opening Fireworks HTML in HomeSite is simple, and inserting Fireworks graphics into HomeSite documents is just as easy.
  • Page 326 ADOBE FIREWORKS CS3 User Guide To export Fireworks HTML to HomeSite: ❖ Export your document to HTML in Fireworks, and then open the exported file in HomeSite by choosing File > Open. For more information, see Fireworks Help. Copying Fireworks HTML to the Clipboard for use in HomeSite A fast way to place Fireworks-generated HTML in HomeSite is to copy it to the Clipboard from Fireworks, and then paste it directly into a HomeSite document.
  • Page 327: Working With Photoshop

    ADOBE FIREWORKS CS3 User Guide • Right-click the image on the Thumbnails tab of the Results window. • Right-click the associated tag in the HTML code on the Edit tab of the Document window. Select Edit in Fireworks from the pop-up menu.
  • Page 328 ADOBE FIREWORKS CS3 User Guide • The first alpha channel in the Channels palette converts to transparent areas in the Fireworks image. Fireworks does not support additional Photoshop alpha channels. Photoshop adjustment layers, clipping groups, and paths are not supported by Fireworks. Fireworks ignores these features when importing Photoshop files.
  • Page 329 ADOBE FIREWORKS CS3 User Guide imports each layer in the Photoshop file as a separate object on a single layer Layers: Convert to Fireworks Objects in Fireworks. makes the imported layers visible across all frames in the Fireworks file. Layers: Share Layer Between Frames imports each layer in the Photoshop file as an object on a separate frame in Fireworks.
  • Page 330 ADOBE FIREWORKS CS3 User Guide Navigate to the folder where the Photoshop or other filters and plug-ins are installed, and click Select (Windows) or Choose (Macintosh). If a message appears asking if you want to restart Fireworks, click OK. Restart Fireworks to load the filters and plug-ins.
  • Page 331: About Working With Illustrator

    ADOBE FIREWORKS CS3 User Guide flattens all objects on each individual Fireworks layer, and each Fireworks layer Flatten Each Fireworks Layer becomes a layer in Photoshop. When you choose this option, you lose the ability to edit the Fireworks objects in Photoshop.
  • Page 332: About Working With Golive

    ADOBE FIREWORKS CS3 User Guide Illustrator AI files can contain linked files and placed files of the following types: PDF, BMP, EPS, GIF, JPEG, Images: JPEG2000, PICT, PCX, PCD, PSD, PXR, PNG, TGA and TIFF. Embedded Images are brought into Fireworks as raster images.
  • Page 333: About Extending Fireworks

    Extending Fireworks Help. About Adobe XMP Adobe XMP (eXtensible Metadata Platform) is a technology that assists the user in adding file information to files saved in PNG, GIF, JPEG, Photoshop and TIFF formats. XMP facilitates the exchange of metadata between Adobe applications.
  • Page 334: Flex Integration For Rich Internet Application Layouts (Mxml Export)

    Fireworks can help in the development of next-generation rich Internet applications—referred to as RIAs—by making it possible to export common library assets as known components for use in Adobe Flex™ Builder™. The best part is there's no work necessary on your part, because Fireworks exports the necessary Flex code (MXML) for you with styling and absolute positioning maintained.
  • Page 335: Chapter 17: Automating Repetitive Tasks

    The Find and Replace feature helps you search for and replace elements, such as text, URLs, fonts, and colors. Find and Replace can search the current document or multiple files. Find and Replace works only in Fireworks PNG files or in files containing vector objects, such as Adobe FreeHand, uncompressed CorelDraw, and Adobe Illustrator files.
  • Page 336 • Select Edit > Find. • Press Control+F (Windows) or Command+F (Macintosh). Note: If the files you select are locked or checked in from an Adobe Dreamweaver site, you are prompted to unlock them or check them out before proceeding.
  • Page 337: Finding And Replacing Text

    ADOBE FIREWORKS CS3 User Guide Setting options for finding and replacing in multiple files When finding and replacing among multiple files, you can determine how Fireworks handles multiple open files after the search. To save, close, and back up each file after it is searched: Select Replace Options from the Find panel Options menu.
  • Page 338 ADOBE FIREWORKS CS3 User Guide To search for and replace fonts in one or more Fireworks documents: Select Find Font from the Find pop-up menu of the Find panel. Select the font and font style to find. You can restrict your search by minimum and maximum point sizes.
  • Page 339: Batch Processing

    ADOBE FIREWORKS CS3 User Guide To search for all non-websafe colors and replace them with websafe colors: ❖ Select Find Non-Web216 from the Find pop-up menu of the Find panel. Note: Find Non-Web216 does not find or replace pixels within image objects.
  • Page 340 ADOBE FIREWORKS CS3 User Guide Note: If the files you select are locked or checked in from a Dreamweaver site, you are prompted to unlock them or check them out before proceeding. Click one of the following in the Batch (Windows) or Batch Process (Macintosh) dialog box: adds selected files and folders to the list of files to batch-process.
  • Page 341 ADOBE FIREWORKS CS3 User Guide • To add a task to the batch, select it in the Batch Options list and click Add. Each task can be added only once. For more information on the Scale option, see “Scaling graphics with a batch process” on page 338. For more infor- mation on the Rename option, see “Changing filenames with a batch process”...
  • Page 342 In addition, a log file named FireworksBatchLog.txt is created during the batch process. It lists all of the files processed, the specific files that could not be opened (if any), and other information. You can find this log file at: • \\Documents and Settings\username\Application Data\Adobe\Fireworks 9\FireworksBatchLog.txt (Windows) • /Users/username/Library/Application Support/Adobe Fireworks 9/FireworksBatchLog.txt (Macintosh) Changing optimization settings with a batch process You can change file optimization settings using the Export option in the Batch Process dialog box.
  • Page 343 ADOBE FIREWORKS CS3 User Guide Scaling graphics with a batch process You can alter the height and width of images being exported using the Scale option in the Batch Process dialog box. To set scaling options for batch-processed files: Select Scale from the Batch Options list and click Add.
  • Page 344 ADOBE FIREWORKS CS3 User Guide Select the type of attribute to find and replace from the Find pop-up menu: text, font, color, URL, or Non- Web216. Enter or select the specific element to find in the Find box. Enter or select the specific element to replace in the Change To box.
  • Page 345 ADOBE FIREWORKS CS3 User Guide For information on completing the batch process, see “Batch processing” on page 334. For more information on creating commands, see “Scripting with the History panel” on page 342. Note: Some commands do not work during a batch process. Select commands that work within the document without requiring any object to be selected.
  • Page 346: Extending Fireworks

    With the Extension Manager, you can install and manage extensions that augment the functionality of Fireworks. Or you can write custom JavaScript code and use it as a custom command in Fireworks. You can also use Adobe Flash SWF movies as custom commands in Fireworks. You can paste color values directly from Flash actionscript into Fireworks color boxes.
  • Page 347 Upon installation, Fireworks includes a collection of default extensions in the Commands menu. You can also use the Extension Manager to bundle your own extensions and send them to the Adobe Exchange for Fireworks. Through the Exchange, you can share your extensions with other Fireworks users.
  • Page 348 ADOBE FIREWORKS CS3 User Guide To undo or redo steps using the History panel: Drag the Undo Marker up the panel until you reach the last step you want to undo or redo. Click along the Undo Marker track on the left of the History panel.
  • Page 349 • On your hard disk, delete the JSF file for the command from the Commands folder in your user-specific Fireworks configuration folder. For information on locating this folder, see “About user configuration files” on page 351. To rename or delete a command that shipped with Fireworks or that you downloaded from the Adobe Exchange: •...
  • Page 350: Flash Swf Movies Used As Fireworks Panels

    ADOBE FIREWORKS CS3 User Guide To edit a command using JavaScript: From your desktop, navigate to the appropriate Commands or Command Panels folder on your hard disk. Note: The exact location of these folders varies from system to system and depends on whether you want the command or panel to be available just to your user profile or to all users.
  • Page 351: Chapter 18: Preferences And Keyboard Shortcuts

    Chapter 18: Preferences and Keyboard Shortcuts Fireworks CS3 preference settings let you control the general appearance of the user interface, as well as editing and folder aspects. In addition, Fireworks allows you to customize your keyboard shortcuts. This means that you can customize your shortcuts and standardize them among your favorite software programs.
  • Page 352: Editing Preferences

    Launch and Edit preferences By setting launch-and-edit preferences, you can control how external applications, such as Adobe Flash and Adobe Director launch and edit graphics in Fireworks. In most cases, Fireworks attempts to locate the source PNG for a graphic on its own. When it can’t locate the source PNG, Fireworks uses the launch-and-edit preferences that you set to determine how it will handle locating the source PNG file.
  • Page 353 Fireworks graphics and interactive elements within Dreamweaver, see “Working with Dreamweaver” on page 292. Folders preferences The folders preferences give you access to additional Adobe Photoshop plug-ins, texture files, and pattern files from external sources. targets folders containing plug-ins, textures, and Additional Materials (Photoshop Plug-Ins, Textures, and Patterns) patterns.
  • Page 354: Changing Keyboard Shortcut Sets

    Using shortcuts increases your productivity by allowing you to perform simple actions quickly. If you are accustomed to using shortcuts from other applications such as Adobe FreeHand, Adobe Illustrator, Photoshop, or products that use a different standard, you can switch to the shortcut set you prefer.
  • Page 355: Working With Configuration Files

    ADOBE FIREWORKS CS3 User Guide Do one of the following: • Click the Add a New Shortcut (+) button to add a secondary shortcut to the shortcut list. • Click Change to replace the selected shortcut. Deleting custom shortcuts and custom shortcut sets You can delete any custom shortcut or any custom shortcut set.
  • Page 356: About Reinstalling Fireworks

    For information about viewing all files and folders, see Windows Help. About user configuration files Fireworks user configuration files are stored in the Adobe/Fireworks 9 folder in your user-specific Application Data folder (Windows) or Application Support folder (Macintosh). The location of this folder varies depending on what operating system you use and on whether your system is a multiuser system or a single-user system.
  • Page 357: Viewing Package Contents (Macintosh Only)

    ADOBE FIREWORKS CS3 User Guide Note: Your user-specific configuration files are located in your user-specific Application Data (Windows) or Application Support (Macintosh) folder. For information on locating this folder, see “About user configuration files” on page 351. You will be asked during the uninstall process if you want to remove preferences and user-specific configuration files.
  • Page 358: Index

    75 behaviors 210 scaling 240 Adobe Bridge 328 Behaviors panel 209 setting frame delay 242 Adobe Bridge Home 6 Dreamweaver 206 sharing layers across frames 244 Adobe Design Center 6 Nav Bar Down 210 transparency 247...
  • Page 359 127 cloning boundaries 136 swapping stroke and fill colors bitmap areas 66 Bridge Home 6 in 127 images 66 Bridge, Adobe 328 color models objects 54 brightness 76 CMY 130 CMY color model 130 Brightness/Contrast filter 76 Grayscale 130...
  • Page 360 269 location of 351 Marquee preference 347 Exact 266 master 350, 351 deleting Grayscale 266 configuring Adobe Fireworks 346 frames 244 importing 266 Connector Line tool 87 layers 160 locking colors 269 Constrain Proportions option 17 Live Filters 152...
  • Page 361 289 animations 301 switching 31 embossing 149 external editor preference 303 tiling views 33 EPS files, opening in Adobe Launch and Edit preferences 304 Fireworks 17 Dodge tool 66 launching and editing Adobe Eraser tool 65 Doughnut tool 87...
  • Page 362 146 FreeHand text 332 adjusting 144 exporting to 314 URLs 333 applying color fills 76 placing Adobe Fireworks graphics uses 330 applying gradient 64, 142 in 312 Fireworks 327 applying pattern 141 Full Screen with Menus mode 33 Fireworks.
  • Page 363 HSB color model 130 rotating 144 Dreamweaver 295 HTML 281 saving custom 145 Adobe Fireworks images into copying and pasting from Adobe Dreamweaver 292 transforming 144 Fireworks to Dreamweaver 283 Inset Path command 106 Grayscale color model 130 exporting 280, 282...
  • Page 364 INDEX 359 reference sheet for current set 350 enabling or disabling 148 midtones 72 secondary shortcuts 349 Fill Color 182 mirroring. See flipping objects UTF-8 encoded reference in buttons 222 mobile phone graphics 17 sheets 350 Photoshop plug-ins 150 mobile phone graphics. See WBMP keyboard shortcuts in Help 3 files removing 152...
  • Page 365 263, 275 opening custom layouts 30 resuming path 99 sharing with another user 276 Optimize 27 straight segments 94 Optimize Image in Adobe Fireworks Options menu in 30 Pencil tool 63 command 300 organizing 28 perspective illusion 57 Optimize panel 27...
  • Page 366 INDEX 361 importing PSD files into Adobe advanced properties 234 Fireworks 323 Quick Export button 31, 288 description 229 Pick Distance preference 347 designing appearance 232 Quick Export pop-up menu 289 PICT file format 265 editing 236 pie chart 87...
  • Page 367 203 Selective JPEG compression 273 rounded rectangles 85 creating 201 Enable Selective Quality 273 Rubber Stamp tool 66 editing Adobe Fireworks table overlay color 273 slices from Dreamweaver 299 rulers 38 exporting 277, 278 preserve button quality 274...
  • Page 368 INDEX 363 straight segments, editing 95 SWF movies 345 changing shape of path 120 Stroke Color box 136 symbol library 186 converting text to path 122 strokes 136 Symbol Properties panel 28 detaching from path 120 adding texture 145 symbols editing text attached to a path 120 changing centering 139 breaking a link 193...
  • Page 369 Update HTML command 285, 296 group 128 Text 109 updates 7 work environment 24 tool group pop-up menus 26 updating slices 278 workflow in Adobe Fireworks 12 Transform 54 URL library 196 Zoom 32 adding URLs 197 Tools panel 25 adding used URLs 198...

This manual is also suitable for:

Fireworks cs3

Table of Contents