manualshive.com logo in svg

MACROMEDIA FIREWORKS 8-USING FIREWORKS, Руководство пользователя, Страница: 5 / 472

Поделиться
Скачать
MACROMEDIA FIREWORKS 8-USING FIREWORKS Скачать руководство пользователя страница 5

Contents

5

Chapter 11:  Slices, Rollovers, and Hotspots. . . . . . . . . . . . . . . . . 251

Creating and editing slices . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 252
Making slices interactive. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 260
Preparing slices for export . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 269
Working with hotspots and image maps . . . . . . . . . . . . . . . . . . . . . . . .  275

Chapter 12:  Creating Buttons and Pop-up Menus  . . . . . . . . . . . 281

Creating button symbols . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 282
Creating navigation bars   . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 293
Creating pop-up menus  . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 293

Chapter 13:  Creating Animation  . . . . . . . . . . . . . . . . . . . . . . . . .  307

Building animation . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 308
Working with animation symbols  . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 308
Working with frames . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .313
Tweening . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .318
Previewing an animation. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .319
Exporting your animation . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 320
Working with existing animations . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 322
Using multiple files as one animation . . . . . . . . . . . . . . . . . . . . . . . . . . . 323

Chapter 14:  Optimizing and Exporting . . . . . . . . . . . . . . . . . . . .  325

About optimizing. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 326
Using the Export Wizard. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 326
Optimizing in the workspace . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .331
Exporting from Fireworks . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 352
Sending a Fireworks document as an e-mail attachment . . . . . . . . . 370
Using the File Management button  . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 371

Chapter 15:  Using Fireworks with Other Applications  . . . . . . .  373

Working with Macromedia Dreamweaver  . . . . . . . . . . . . . . . . . . . . . .  374
Working with Macromedia Flash  . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 392
Working with Macromedia FreeHand MX  . . . . . . . . . . . . . . . . . . . . . . 399
Working with Macromedia Director MX . . . . . . . . . . . . . . . . . . . . . . . . 405
Working with Macromedia HomeSite . . . . . . . . . . . . . . . . . . . . . . . . . . .410
Working with Adobe Photoshop. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .413
About working with Adobe GoLive. . . . . . . . . . . . . . . . . . . . . . . . . . . . . .419
About working with HTML editors . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 420
About extending Fireworks  . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 420

Содержание FIREWORKS 8-USING FIREWORKS

Страница 1: ...Using Fireworks...

Страница 2: ...ility for the content on those third party sites Copyright 2005 Macromedia Inc All rights reserved This manual may not be copied photocopied reproduced translated or converted to any electronic or mac...

Страница 3: ...work environment 29 Chapter 3 Selecting and Transforming Objects 51 Selecting objects 51 Selecting pixels 55 Editing selected objects 68 Transforming and distorting selected objects and selections 69...

Страница 4: ...and Fills 167 Using the Colors section of the Tools panel 168 Organizing swatch groups and color models 169 Using color boxes and color pop up windows 176 Working with strokes 177 Working with fills...

Страница 5: ...20 Working with existing animations 322 Using multiple files as one animation 323 Chapter 14 Optimizing and Exporting 325 About optimizing 326 Using the Export Wizard 326 Optimizing in the workspace 3...

Страница 6: ...xtending Fireworks 437 Flash SWF movies used as Fireworks panels 443 Chapter 17 Preferences and Keyboard Shortcuts 445 Setting preferences 445 Changing keyboard shortcut sets 449 Working with configur...

Страница 7: ...tomate the workflow to meet the demands of time consuming updates and changes Fireworks integrates with other Macromedia products such as Dreamweaver Flash FreeHand and Director as well as your other...

Страница 8: ...You can register electronically during the product activation process when you first launch Fireworks By registering you get on the priority list to receive up to the minute notices about upgrades an...

Страница 9: ...other Studio products Optimization Image Editing panel This new panel is a central location where you can access commonly used image editing tools filters and menu commands More import file formats F...

Страница 10: ...ash grids now use a dotted line and a lighter default grid color Create without complexity 25 new blend modes 25 new choices to alter the look of your colors and objects Perspective shadow Add a persp...

Страница 11: ...timization now defaults to the last settings used See Saving and reusing optimization settings on page 351 Save multiple selections Save restore name and delete multiple marquee selections within PNG...

Страница 12: ...ess the guide at any time in Fireworks help Help Getting Started with Fireworks The guide is also available in PDF format on the Macromedia website at www macromedia com go fireworks_documentation The...

Страница 13: ...hics from scratch after any simple edit Fireworks generates JavaScript making rollovers easy to create Efficient optimization features shrink the size of web graphic files without sacrificing quality...

Страница 14: ...bitmap For example select the Pen tool from the Vector section of the Tools panel and you can begin drawing vector paths by plotting points Select the Brush tool and you can drag to paint a bitmap ob...

Страница 15: ...Up or 4 Up views in the workspace You can slice an image into smaller parts and then optimize each part in the format that best suits the content For added optimization flexibility you can use select...

Страница 16: ...f the lines and curves that describe its shape Vector graphics are resolution independent which means you can move resize reshape or change the color of a vector graphic as well as display it on outpu...

Страница 17: ...NG 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 You c...

Страница 18: ...s created in other graphics programs In addition you can import images from a digital camera or scanner To open a Fireworks document 1 Select File Open The Open dialog box appears 2 Select the file an...

Страница 19: ...it the image You can then either select Save As to save your work as a new Fireworks PNG file or as another file format or with some image types you can select Save to save the document in its origina...

Страница 20: ...ator EPS files that contain vector information the Vector File Options dialog box opens This is the same dialog box that appears when you open or import FreeHand files WBMP files Fireworks can open WB...

Страница 21: ...ent window To open only the first table of an HTML file 1 Select File Open 2 Select the HTML file that contains the table you want to open and click Open The first table in the HTML file opens in a ne...

Страница 22: ...image or text into Fireworks From the other application drag the object or text into Fireworks Pasting into Fireworks Pasting an object copied from another application into Fireworks places the object...

Страница 23: ...document Fireworks asks whether you want the bitmap to be resampled Resampling adds pixels to or subtracts pixels from a resized bitmap to match the appearance of the original bitmap as closely as pos...

Страница 24: ...port Fireworks retains the proportions of the image Importing from a digital camera or scanner You can import images from a digital camera or scanner only if it is TWAIN compliant Windows or uses buil...

Страница 25: ...ect Images dialog box select the images you want to import and then click OK 6 Follow the instructions to apply the desired settings The imported image is opened as a new Fireworks document To import...

Страница 26: ...r open an existing Fireworks PNG file the document s filename has the extension png Files of other types such as PSD and HTML also open as PNG files allowing you to use the Fireworks PNG document as y...

Страница 27: ...le Save Saving documents in other formats When you use File Open to open a file of a format other than PNG you can use all of the features of Fireworks to edit the image You can then select Save As to...

Страница 28: ...clude adding new objects masks and Live Filters as well as adjusting opacity applying blend modes and saving pixel selections To export a document to another format 1 Select a file format in the Optim...

Страница 29: ...ent properties It then changes to display properties for a newly selected tool or currently selected object as you work in the document The panels are initially docked in groups along the right side o...

Страница 30: ...ories 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 Fo...

Страница 31: ...gle Ellipse and Polygon basic tools as well as all of the Auto Shape tools which appear below the divider line To select an alternative tool from a tool group 1 Click the tool icon and hold down the m...

Страница 32: ...erty inspector and select Full Height from the Property inspector Options menu To reduce the Property inspector to half height do one of the following Click the expander arrow in the lower right corne...

Страница 33: ...mages The Layers panel organizes a document s structure and contains options for creating deleting and manipulating layers The Frames panel includes options for creating animations The History panel l...

Страница 34: ...rkspace You can undock panel groups add panels to a group undock individual panels rearrange the order of docked panel groups and collapse and close panel groups You can also open and close individual...

Страница 35: ...4 x 768 Select Window Workspace Layouts 1280 x 1024 To open a panel Select the panel name from the Window menu To close a panel do one of the following Select the panel name from the Window menu Click...

Страница 36: ...s 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 To select...

Страница 37: ...export your Fireworks files to a number of Macromedia applications including Dreamweaver Flash Director and FreeHand In addition you can export your files to Photoshop FrontPage Adobe GoLive and Illu...

Страница 38: ...dition you can easily pan the view of a document which is helpful if you zoom in and can no longer see the entire canvas Using document tabs Windows When your document is maximized you can easily choo...

Страница 39: ...s do one of the following Select the Zoom tool and click to specify the new center point inside the document window Each click magnifies the image to the next preset magnification Select a zoom settin...

Страница 40: ...t based on a specific area Alt drag Windows or Option drag Macintosh a selection area with the Zoom tool To return to 100 magnification Double click the Zoom tool in the Tools panel To pan around the...

Страница 41: ...ng multiple document views You can use multiple views to see one document at different magnifications simultaneously Changes you make in one view are automatically reflected in all other views of the...

Страница 42: ...se this command to preview how a document would appear on the Macintosh platform Changing the canvas When you first create a new Fireworks document you must specify document characteristics You can mo...

Страница 43: ...ies in the Property inspector then click the Canvas color box 2 Pick a color from the Swatches pop up window or click the eyedropper on a color anywhere onscreen To select a transparent canvas click t...

Страница 44: ...ifferently than most image editing applications do Fireworks contains pixel based bitmap image objects and path based vector objects When a bitmap object is resampled pixels are added to or removed fr...

Страница 45: ...wise or 90 counterclockwise When you rotate the canvas all objects in the document rotate To rotate the canvas do one of the following Select Modify Canvas Rotate 180 Select Modify Canvas Rotate 90 CW...

Страница 46: ...box surrounds the area of the document that you want to keep 3 Double click inside the bounding box or press Enter to crop the document Fireworks resizes the canvas to the area you define and deletes...

Страница 47: ...rks grid and snap objects to the grid Using rulers Rulers help you to measure organize and plan the layout of your work Because Fireworks images are intended for the web where graphics are measured in...

Страница 48: ...ving slice guides to edit slices on page 258 To create a horizontal or vertical guide 1 Click and then drag from the corresponding ruler 2 Position the guide on the canvas and release the mouse button...

Страница 49: ...nd repeat multiple actions With the History panel you can view modify and repeat the actions taken to create the document The History panel lists the most recent actions you have performed in Firework...

Страница 50: ...ction to highlight it Control click Windows or Command click Macintosh to highlight multiple individual actions Shift click to highlight a continuous range of actions 3 Click the Replay button at the...

Страница 51: ...Before you can do anything with any object on the canvas you must select it This applies to a vector object path or points a text block word or letter a slice or hotspot an instance or a bitmap object...

Страница 52: ...ct the object in the Layers panel To select objects by dragging Drag the Pointer tool to include one or more objects in the selection area Using the Subselection tool You use the Subselection tool to...

Страница 53: ...tor identifies the selection The upper left area of the Property inspector contains the following information about the selection A description of the item being inspected A text box to enter a name f...

Страница 54: ...ect To select everything on every layer in the document Choose Select Select All To deselect all selected objects Choose Select Deselect To hide the path selection feedback of a selected object Select...

Страница 55: ...s the options for that tool Selecting the Live marquee box allows you to change Edge settings and the amount of feather if Feather is specified as the Edge setting for your bitmap selection while you...

Страница 56: ...the Marquee or Oval Marquee tool 2 Set the Style and Edge options in the Property inspector For more information see Bitmap selection tool options on page 55 3 Drag to draw a selection marquee which d...

Страница 57: ...the starting point Double click in the workspace 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 Tole...

Страница 58: ...r with the Magic Wand tool 2 Select Select Select Similar One or more marquees show all areas containing the selected range of pixels according to the current Tolerance setting in the Property inspect...

Страница 59: ...ls around the existing marquee or smooth the border of the marquee Moving a marquee You can move a marquee to place it over a different area of pixels To move the marquee do one of the following Drag...

Страница 60: ...rt of the selection 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 int...

Страница 61: ...of its opaque area from the current pixel selection To create a pixel selection on a selected bitmap from the intersection of overlapping objects 1 Control click Windows or Command click Macintosh an...

Страница 62: ...her a selection by setting a feather amount in the Property inspector before or during your use of a bitmap selection tool For more information see Bitmap selection tool options on page 55 To feather...

Страница 63: ...e that you want to place around the existing marquee and click OK Smoothing the border of a marquee You can eliminate excess pixels along the edges of a pixel selection This is useful if excess pixels...

Страница 64: ...e marquee selections To save a marquee selection 1 Select Select Save Bitmap Selection to open the Save Selection dialog box 2 The Document box displays the name of the active document in which your m...

Страница 65: ...at you have previously named and saved To restore a marquee selection 1 Select Select Restore Bitmap Selection to open the Restore Selection dialog box 2 The Document box displays the name of the acti...

Страница 66: ...election from a different document 3 The Selection box displays the name of the active selection in the active document You can leave that as is or if you want to delete a different selection from the...

Страница 67: ...nsert a new bitmap by cutting and pasting a pixel selection 1 Select an area of pixels using a pixel selection tool 2 Select Edit Insert Bitmap via Cut A new bitmap object based on the pixel selection...

Страница 68: ...ects by pasting 1 Select an object or multiple objects 2 Select Edit Cut or Edit Copy 3 Select Edit Paste To duplicate one or more selected objects Select Edit Duplicate As you repeat the command dupl...

Страница 69: ...rea if you are using the Marquee Oval Marquee or Lasso tool Press Escape Transforming and distorting selected objects and selections You can transform a selected object or group or a pixel selection u...

Страница 70: ...lected objects using the transform handles 1 Select a transformation tool As you move the pointer on or near the selection handles the pointer changes to indicate the current transformation 2 Do one o...

Страница 71: ...r press Alt while dragging any handle Rotating objects When rotated an object pivots on its center point You rotate an object by selecting a preset angle or by placing the pointer outside an object s...

Страница 72: ...zontal axis without moving its relative position on the canvas To flip a selected object Select Modify Transform Flip Horizontal or Flip Vertical Skewing objects Skewing an object transforms it by sla...

Страница 73: ...using the Property inspector or Info panel Enter new width W or height H measurements To scale or rotate selected objects using Numeric Transform 1 Select Modify Transform Numeric Transform The Numeri...

Страница 74: ...n 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 You c...

Страница 75: ...a around it To add objects to or remove them from the selection hold down Shift as you click or drag To select the group that contains a subselected object do one of the following Right click Windows...

Страница 76: ...r Aligning objects The Align commands in the Modify menu give you a wide range of arrangement options allowing you to do any of the following Align objects along a horizontal or vertical axis Align se...

Страница 77: ...y Align Distribute Heights About arranging objects among layers The Layers panel offers another dimension of organizational control You can move selected objects from one layer to another by dragging...

Страница 78: ...78 Chapter 3 Selecting and Transforming Objects...

Страница 79: ...rting images Fireworks has a powerful set of Live Filters for tone and color adjustment as well as a number of ways to retouch your bitmap images including cropping feathering and duplicating or cloni...

Страница 80: ...e 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 Fi...

Страница 81: ...one of the following Select Edit Cut then Edit Paste Select Edit Copy then Edit Paste Select Edit Insert Bitmap via Copy to copy the current selection into a new bitmap Select Edit Insert Bitmap via C...

Страница 82: ...rayscale Convert to Sepia Tone Filters Blur Blur More Sharpen Sharpen More Unsharp Mask Add Noise Convert to Alpha Find Edges View Options Show Hide Rulers Show Hide Grid Snap Don t Snap to Grid Edit...

Страница 83: ...Auto Erase uses the fill color when the Pencil tool is clicked over the stroke color Preserve Transparency restricts the Pencil tool to drawing only in existing pixels not in transparent areas of a g...

Страница 84: ...e color of a single pixel an average of color values within a 3 by 3 pixel area or an average of color values within a 5 by 5 pixel area To sample a stroke or fill color 1 If the correct attribute is...

Страница 85: ...r or Fill Color boxes throughout Fireworks Erasing bitmap objects You can use the Eraser tool to remove pixels By default the Eraser tool pointer represents the size of the current eraser but you can...

Страница 86: ...selection 4 Make a selection To feather the edges of a pixel selection from the menu bar 1 Select Select Feather 2 Type a value in the Feather Selection dialog box to set the feather radius and click...

Страница 87: ...two pointers The first one the source of the cloning is in the shape of a cross hair For more information see Editing preferences on page 446 Depending upon the brush preferences you ve selected the s...

Страница 88: ...a pixel selection do one of the following Drag the pixel selection with the Subselection tool Alt drag Windows or Option drag Macintosh the pixel selection using the Pointer tool Blurring sharpening a...

Страница 89: ...technique of increasing or decreasing light exposure as the photograph is developed To lighten or darken parts of an image 1 Select the Dodge tool to lighten parts of an image or the Burn tool to dar...

Страница 90: ...olors with grays and blacks Original photograph after using the Red eye Removal tool To correct the red eye effect in a photograph 1 Select the Red eye Removal tool from its pop up menu 2 Set the attr...

Страница 91: ...Swatch 3 Click the From color well to select the color probe and select a color from the pop up menu to specify the color you want to replace 4 Click the To color well in the Property inspector and se...

Страница 92: ...e From color with the To color leaving some of the From color intact 5 Using the tool click down on a section of the bitmap image that contains the color you want to replace Without lifting the tool c...

Страница 93: ...djust the contrast and brightness the tonal range and the hue and color saturation of your images Applying filters as Live Filters from the Property inspector is nondestructive Live Filters do not per...

Страница 94: ...With Levels you can correct bitmaps that contain a high concentration of pixels in the highlights midtones or shadows Or you can use Auto Levels and let Fireworks adjust the tonal range for you If yo...

Страница 95: ...dows The Histogram helps you determine the best method of correcting an image s tonal range A high concentration of pixels in the shadows or highlights indicates that you could improve the image by ap...

Страница 96: ...ider adjusts the midtones using values from 10 to 0 The left slider adjusts the shadows using values from 0 to 255 As you move the sliders the values are automatically entered in the Input Levels boxe...

Страница 97: ...rrect the tonal range Curves lets you adjust any color along the tonal range instead of only three variables without affecting other colors For example you can use Curves to correct for a color cast c...

Страница 98: ...Channel pop up menu select whether you want to apply changes to individual color channels or to all colors N OT E If the Property inspector is partially minimized click the Add Filters button instead...

Страница 99: ...eyedropper in the Levels or Curves dialog box To adjust the tonal balance manually using the tonal eyedroppers 1 Open the Levels or Curves dialog box and select a color channel from the Channel pop up...

Страница 100: ...s Contrast dialog box In the Property inspector click the Add Live Filters button and then select Adjust Color Brightness Contrast from the Filters pop up menu Select Filters Adjust Color Brightness C...

Страница 101: ...uickly To add a Color Fill Live Filter to a selected object 1 In the Property inspector click the Add Live Filters button and then select Adjust Color Color Fill from the Filters pop up menu 2 Select...

Страница 102: ...the Lightness slider to adjust the lightness of the colors Values range from 100 to 100 6 Click OK To change an RGB image to a two tone image or to add color to a grayscale image Select Colorize in th...

Страница 103: ...lues You can use Invert to change each color in an image to its inverse on the color wheel For example applying the filter to a red object R 255 G 0 B 0 changes the color to light blue R 0 G 255 B 255...

Страница 104: ...ng Zoom Blur creates the appearance that the image is moving toward or away from the viewer To blur an image 1 Select the image 2 Do one of the following In the Property inspector click the Add Live F...

Страница 105: ...he Filters pop up menu Select Filters Blur Motion Blur 3 Drag the Angle dial to set the direction of the blur effect 4 Drag the Distance slider to set the strength of the blur effect Values range from...

Страница 106: ...fect 4 Drag the Quality slider to set the smoothness of the blur effect Values range from 1 to 100 An increase in quality results in a blur effect with fewer repetitions of the original image 5 Click...

Страница 107: ...ses the contrast of adjacent pixels about three times as much as Sharpen Unsharp Mask sharpens an image by adjusting the contrast of the pixel edges This option offers the most control so it is usuall...

Страница 108: ...p contrast surrounding each pixel edge 5 Drag the Threshold slider to select a threshold of 0 to 255 Values between 2 and 25 are most commonly used An increase in threshold sharpens only those pixels...

Страница 109: ...o create the illusion that both images come from the same source You can also add noise to an image for artistic reasons for instance to simulate an old photograph or static on a television screen Ori...

Страница 110: ...ider to set the amount of noise Values range from 1 to 400 An increase in amount results in an image with more randomly placed pixels 4 Select the Color check box to apply color noise Leave the check...

Страница 111: ...ith the Vector Path and Pen tools Using the Pen tool you can draw complex shapes with smooth curves and straight lines by plotting points one by one Fireworks offers several methods for editing the ve...

Страница 112: ...e Line Rectangle or Ellipse tool from the Tools panel 2 If desired set the stroke and fill attributes in the Property inspector See Chapter 7 Applying Color Strokes and Fills on page 167 3 Drag on the...

Страница 113: ...the Rounded Rectangle tool 2 Drag the canvas to draw the rectangle To round the corners of a selected rectangle In the Property inspector enter a value from 0 to 100 in the Roundness box and press En...

Страница 114: ...enter a value Values closer to 0 result in long thin points values closer to 100 result in short stubby points 5 Drag the canvas to draw the star To constrain a star s orientation to increments of 45...

Страница 115: ...can edit the end points for the first and third sections of the connector line as well as the location of the second section which connects the first and last sections Doughnut draws object groups th...

Страница 116: ...ction control point to constrain its movement on a 45 degree angle Click the Direction control point to reset the shadow its size will be identical to the original shape Control Command click the Dire...

Страница 117: ...ct one from the Insert New Auto Shape pop up menu at the bottom of the panel The new shape appears in the upper left corner of the document Adjusting arrow Auto Shapes Arrows have five control points...

Страница 118: ...length control point of a selected bent arrow To adjust the width of a bent arrow tail Drag the handle width control point of a selected bent arrow To adjust the corner roundness of a bent arrow tail...

Страница 119: ...sition of the cross bar the line that connects the start and end line segments and for adjusting the roundness of the corners To move the start or end point of a connector line Drag the control point...

Страница 120: ...or resetting the pie to one slice You can add as many sections as you want using control points For each new section Fireworks adds a control point for resizing or splitting the new section To add sec...

Страница 121: ...f sides on a selected smart polygon Drag the sides control point To split a selected smart polygon into segments Alt drag Windows or Option drag Macintosh the sides control point To resize the inner p...

Страница 122: ...These Auto Shapes are generally more complex than those that appear in the Tools panel Instead of drawing these Auto Shapes directly on the canvas you place these Auto Shapes into your drawing by dra...

Страница 123: ...ector Path tool See Chapter 7 Applying Color Strokes and Fills on page 167 Using the Vector Path tool The Vector Path tool has a wide variety of brush stroke categories including Air Brush Calligraphy...

Страница 124: ...horizontal or vertical line hold down Shift while dragging 5 Release the mouse button to end the path To close the path release the mouse button when you return the pointer to the point at the beginni...

Страница 125: ...nter and click to place the next point A straight line segment joins the two points 5 Continue plotting points Straight segments bridge each gap between points 6 Do one of the following to end the pat...

Страница 126: ...rks extends the line segment to the new point 4 Continue plotting points If you click and drag a new point you produce a curve point if you just click you produce a corner point 5 Do one of the follow...

Страница 127: ...of a vector object by dragging its point handles with the Subselection tool The point handles determine the degree of curvature between fixed points These curves are known as B zier curves To edit th...

Страница 128: ...t point handle goes up Alt drag a handle to move it independently Converting path segments to straight or curved Straight path segments are intersected by corner points Curved path segments contain cu...

Страница 129: ...n the Tools panel 2 Click a curve point on a selected path The handles retract and the adjacent segments straighten Selecting points The Subselection tool allows you to select multiple points Before s...

Страница 130: ...on tool If either point nearest the clicked point is a curve point the near handle is also displayed Moving points and point handles You can change an object s shape by dragging its points and point h...

Страница 131: ...g points from the path reshapes it or simplifies editing To insert a point on a selected path Using the Pen tool click anywhere on the path where there is not a point To delete a point from a selected...

Страница 132: ...two open paths 1 Select an open path 2 Select the Subselection tool and drag an end point of the path within a few pixels of the end point of the similar path The end point snaps to the other path an...

Страница 133: ...pushing a path segment 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...

Страница 134: ...oint slightly away from the path 3 Drag toward the path to push it Nudge the selected path to reshape it To change the size of the push pointer do one of the following While holding down the mouse but...

Страница 135: ...holding down the mouse button press the Right Arrow key or 2 to increase the width of the pointer While holding down the mouse button press the Left Arrow key or 1 to decrease the width of the pointe...

Страница 136: ...pointer 4 Drag to redraw or extend a path segment The portion of the path to be redrawn is highlighted in red 5 Release the mouse button Changing a path s appearance by varying pressure and speed You...

Страница 137: ...You can combine path objects into a single path object You can connect the end points of two open paths to create a single closed path or you can join multiple paths to create a composite path To crea...

Страница 138: ...to create 4 If you chose Feather in the Edge setting specify the value you want to use for the amount of feather 5 To convert the selected path to a marquee click OK Creating an object from the inters...

Страница 139: ...from which the portions are to be removed 4 Select Modify Combine Paths Punch Stroke and fill attributes remain unchanged Cropping a path You can crop a path using the shape of another path The front...

Страница 140: ...simplification amount and click OK As you increase the amount of simplification you increase the degree to which Fireworks can alter the path to reduce the number of points on that path Expanding a s...

Страница 141: ...a specific number of pixels To expand or contract a selected path 1 Select Modify Alter Path Inset Path to open the Inset Path dialog box 2 Select a direction to contract or expand the path Inside co...

Страница 142: ...142 Chapter 5 Working with Vector Objects...

Страница 143: ...assigned name The capability to edit text anytime even after you apply Live Filters such as drop shadows and bevels means you can easily make changes to text You can also copy objects that include te...

Страница 144: ...an change the assigned name to a different name if you prefer To change the name of a text object 1 Select the text object The existing name of that text object is displayed both in the Text box of th...

Страница 145: ...eates a fixed width text block For information on the different types of text blocks see Using auto sizing and fixed width text blocks on page 146 4 Type your text To enter a paragraph break press Ent...

Страница 146: ...dth of wrapped text Fixed width text blocks are created by default when you drag to draw a text block using the Text tool When the text pointer is active within a text block a hollow circle or hollow...

Страница 147: ...t Editor on page 165 To edit text 1 Select the text you want to change Click a text block with the Pointer or Subselection tool to select the entire block To select multiple blocks simultaneously hold...

Страница 148: ...g style button Inserting special characters You can insert special characters into your text directly from within Fireworks rather than having to copy and paste those characters from another source To...

Страница 149: ...and Live Filters applied to a text block as you edit text in the text block but the Text tool does not retain stroke characteristics or Live Filters if you create a new text block For more information...

Страница 150: ...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 Click the Fill Color box in the Tools panel and selec...

Страница 151: ...old down Control Windows or Command Macintosh while pressing the Left Arrow or Right Arrow keys on the keyboard The Left Arrow key increases the space between letters by 1 and the Right Arrow key move...

Страница 152: ...ses the space between lines and the Down Arrow key moves lines closer together Setting text orientation A text block can be oriented horizontally or vertically By default text is oriented horizontally...

Страница 153: ...Setting text alignment Alignment determines the position of a paragraph of text relative to the edges of its text block In horizontal alignment text is aligned relative to the left and right edges of...

Страница 154: ...ander arrow in the lower right corner to see all properties To indent the first line of selected paragraphs In the Property inspector drag the Paragraph Indent pop up slider or enter a value in the te...

Страница 155: ...and the background preserving the shapes of the text characters and enhancing detailed areas of the characters Smooth Anti Alias creates a soft transition between the edges of the text and the backgr...

Страница 156: ...width or height of the characters and drag it lower to reduce their width or height Setting baseline shift Baseline shift determines how closely text sits above or below its natural baseline If there...

Страница 157: ...are applied to all text in a selected text block not just to the highlighted text For more information about strokes and fills see Chapter 7 Applying Color Strokes and Fills on page 167 For more info...

Страница 158: ...h exceeds the length of the path the remaining text returns and repeats the shape of the path Text on a path that returns and repeats the path shape To place text on a path 1 Shift select a text block...

Страница 159: ...raw 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 Text attached to a path drawn right...

Страница 160: ...t 2 In the Property inspector enter a value in the Text Offset text box Then press Enter Transforming text You can transform text blocks in the same ways you can transform other objects You can scale...

Страница 161: ...d text with the Subselection tool Select the converted text and select Modify Ungroup You can edit the individual converted character paths using the vector editing tools For more information on editi...

Страница 162: ...size and style bold italic underline Alignment left right center justified Leading Baseline shift Range kerning Horizontal scale Color of the first character All other RTF information is ignored In Fi...

Страница 163: ...to display the text in the default system font To leave the missing font as is click No Change 4 Click OK The next time you open a document with the same missing fonts the Missing Fonts dialog box inc...

Страница 164: ...ng spell checking You can customize the way Fireworks spell checks documents using the Spelling Setup dialog box From here you can specify one or more language dictionaries for Fireworks to use during...

Страница 165: ...might be difficult to edit onscreen such as large text blocks text attached to a path or text with hard to read fonts and sizes You can choose to display such text in the system font and default size...

Страница 166: ...166 Chapter 6 Using Text...

Страница 167: ...pop up window from which you can select a color for the color box Move the pointer away from an open color pop up window and you can click any color on your screen to apply it to the color box The Co...

Страница 168: ...p window To reset colors to the default Click the Default Colors button in the Tools panel or in the Color Mixer To remove the stroke and fill from selected objects using the No Stroke or Fill button...

Страница 169: ...watches panel 1 Click the icon next to the Stroke Color or Fill Color box in the Tools panel or Property inspector to make it active 2 If the Swatches panel is not already open select Window Swatches...

Страница 170: ...sort color swatches or entire swatch groups using the Swatches panel Swatches panel To add a color to the Swatches panel 1 Select the Eyedropper tool from the Tools panel 2 Select the number of pixels...

Страница 171: ...ch from the Swatches panel 1 Hold down Control Windows or Command Macintosh and place the pointer over a swatch The pointer becomes the scissors pointer 2 Click the swatch to delete it from the Swatch...

Страница 172: ...mal displaying hexadecimal color values for red R green G and blue B color components Hexadecimal RGB values are calculated based on a range of values from 00 to FF TI P Although CMY is a color model...

Страница 173: ...2 Click either the Stroke Color or Fill Color box to make it the destination for the new color 3 Select a color model from the Color Mixer Options menu 4 Do any of the following to specify color compo...

Страница 174: ...lor value of any part of your document using the Info panel 1 Click the Eyedropper tool in the Tools panel 2 Select Window Info to display the Info panel 3 Move the pointer over the object containing...

Страница 175: ...ce color box in the Fill Options window The two websafe dither colors appear in the color boxes to the right The web dither appears on the object and becomes the active fill color 4 Click outside the...

Страница 176: ...rrent color assigned to the associated object property Selecting colors from a color pop up window When you click any color box a color pop up window similar to the Swatches panel opens You can choose...

Страница 177: ...r feature associated with the color box and the color pop up window closes Working with strokes Using the Property inspector the Stroke Options pop up menu and the Edit Stroke dialog box you can have...

Страница 178: ...acintosh to deselect all objects 2 Select a drawing tool in the Tools panel 3 Click the Stroke Color box in the Tools panel or Property inspector to open the color pop up window 4 Select a color for t...

Страница 179: ...ent 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 To open the Edit Stroke dialog bo...

Страница 180: ...the Dash pop up menu 7 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 8 Click Ap...

Страница 181: ...rient brush strokes To move a brush stroke inside or outside the selected path 1 Click the Stroke Color box in the Tools panel or the Property inspector to open the color box pop up window 2 Select an...

Страница 182: ...7 Working with fills Using the Property inspector the Fill Options pop up menu the Fill Options pop up window and the Gradient pop up window as well as a collection of bitmap textures and patterns you...

Страница 183: ...t of swatches or sample a color from anywhere on the screen using the eyedropper pointer 4 Use the tool as desired Editing solid fills A solid fill is a solid color that fills the interior of an objec...

Страница 184: ...n the Property inspector or the Fill Options pop up window to edit fill attributes Applying a pattern fill You can fill a path object with a bitmap graphic known as a pattern fill Fireworks ships with...

Страница 185: ...ector object properties displayed in the Property inspector select Pattern from the Fill Options pop up menu 2 Click the Fill Color box and select Other from the Pattern Name pop up menu 3 Navigate to...

Страница 186: ...n the Property inspector or Tools panel to open the pop up window The Edit Gradient pop up window opens with the current gradient in the color ramp and preview To add a new color or opacity swatch to...

Страница 187: ...ith a gradient instead of a solid color Like the Paint Bucket tool it retains the properties of the last used element To use the Gradient tool 1 Click the Paint Bucket tool in the Tools panel and sele...

Страница 188: ...l width and skew Drag a square handle Setting hard edged anti aliased or feathered fill edges In Fireworks you can make the edge of a fill a regular hard line or soften the edge by anti aliasing or fe...

Страница 189: ...a custom gradient for use across many documents you must create a style For more information see Creating and deleting styles on page 237 Removing a fill You can easily remove fill attributes from sel...

Страница 190: ...Sandpaper Use the Stroke options in the Property inspector or the Stroke Options pop up window to add a texture to a brush stroke To add texture to the stroke of a selected object 1 Do one of the fol...

Страница 191: ...Other from the pop up menu and navigate to a texture file to use an external texture 3 Enter a percentage from 0 to 100 to control the depth of the texture Increasing the percentage increases the tex...

Страница 192: ...192 Chapter 7 Applying Color Strokes and Fills...

Страница 193: ...e or rearrange the order of filters to experiment with a combined filter You can turn Live Filters on and off or delete them in the Property inspector When you remove a filter the object or image retu...

Страница 194: ...ers button and the list of applied Live Filters displayed in the Property inspector When the Property inspector is at half height click Edit Filters to display the Add Live Filters button the Delete L...

Страница 195: ...box click OK If the Live Filter has a pop up window press Enter or click anywhere in the workspace 3 Repeat steps 1 and 2 to apply more Live Filters To enable or disable a Live Filter applied to an ob...

Страница 196: ...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 1 Click the Add Live Filters button in the Property inspe...

Страница 197: ...he angle of the light shining on the object Drop Shadow Inner Shadow and Glow filters To apply a solid shadow 1 In the Property inspector click the Add Live Filters button point to Shadow and Glow and...

Страница 198: ...Property inspector then select Shadow and Glow Glow 2 Edit the filter settings in the pop up window Click the color box to open the color pop up window and set the glow color Drag the Width slider to...

Страница 199: ...rs however are saved with the Fireworks file To install Photoshop plug ins 1 In the Property inspector click the Add Filters button then select Options Locate Plugins 2 Navigate to the folder where th...

Страница 200: ...er Bevel filter should be applied before filters that change the object s exterior For example you should apply the Inner Bevel filter before you apply the Outer Bevel Glow or Shadow filter To reorder...

Страница 201: ...ns 3 Type a name for the style and click OK The custom Live Filter name is added to the Add Filters pop up menu and a style icon representing the Live Filter is added to the Styles panel To create a c...

Страница 202: ...from the Commands menu You can use these commands in batch processing For more information see Performing commands with a batch process on page 434 s To save filter settings as a command 1 Apply the f...

Страница 203: ...yers panel You can also create masks using options on the Select and Modify menus You can use a vector object or a bitmap object to block out part of the underlying image For example if you want to bl...

Страница 204: ...mines how objects on one layer overlap objects on another You can rearrange the order of layers and of objects within layers The Layers panel displays the current state of all layers in the current fr...

Страница 205: ...ou can add new layers delete unwanted layers and duplicate existing layers and objects When you create a new layer a blank layer is inserted above the currently selected layer The new layer becomes th...

Страница 206: ...fore Current Layer places the new layer or layers above the selected layer After Current Layer places the new layer or layers below the selected layer At the Bottom places the new layer or layers at t...

Страница 207: ...location in the Layers panel To move all selected objects on a layer to another location Drag the layer s blue selection indicator to another layer All selected objects on the layer move to the other...

Страница 208: ...the left of the layer name A padlock icon indicates that the layer is locked To lock multiple layers Drag the pointer along the Lock column in the Layers panel To lock or unlock all layers Select Loc...

Страница 209: ...2 Do one of the following Select Merge Down from the Layers panel Options menu Select Modify Merge Down Select Merge Down from the context menu that appears when you right click Windows or Control cli...

Страница 210: ...individual layers as if the layers were ungrouped in Photoshop before being imported into Fireworks The clipping effect on Photoshop grouped layers is lost on import Masking images As the name suggest...

Страница 211: ...cookie cutter effect A vector mask applied using its path outline When you create a vector mask a mask thumbnail with a pen icon appears in the Layers panel to indicate you ve created a vector mask A...

Страница 212: ...mask editing process When a mask is selected the Property inspector displays a variety of properties not only for a selected mask but also for any bitmap tools you might use to edit the mask Original...

Страница 213: ...You can create a mask from an existing object When used as a mask a vector object s path outline can be used to clip or crop other objects When a bitmap object is used as a mask either the brightness...

Страница 214: ...ects you want to use as the mask can be either in front of or behind the objects or group to be masked 3 Select Edit Cut to cut the object or objects you want to use as the mask 4 Select the object or...

Страница 215: ...type of mask object you use The Paste Inside command creates a mask by filling a closed path or bitmap object with other objects vector graphics text or bitmap images The path itself is sometimes refe...

Страница 216: ...te a mask using the Paste Inside command 1 Select the object or objects to use as the paste inside contents 2 Position the object or objects so that they overlap the object into which you want to past...

Страница 217: ...as well A text mask applied using its path outline For more information see Creating a mask from an existing object on page 213 For more information about the different ways masks can be applied see C...

Страница 218: ...map use one of the marquee or lasso tools to create a pixel selection 4 Select a bitmap painting tool from the Tools panel such as the Brush Pencil Paint Bucket or Gradient tool 5 Set the desired tool...

Страница 219: ...the current pixel selection The other pixels in the bitmap object are shown To achieve the same effect make a pixel selection then Alt click Windows or Option click Macintosh the Add Mask button To u...

Страница 220: ...dify Mask Reveal Selection to show the area defined by the pixel selection Select Modify Mask Hide Selection to hide the area defined by the pixel selection The results of Reveal Selection and Hide Se...

Страница 221: ...oshop you must select Maintain Editability over Appearance when exporting Grouping objects to form a mask You can group two or more objects to create a mask The topmost object becomes the mask object...

Страница 222: ...nge 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 The results of editing a mask are immediately vis...

Страница 223: ...red To select a mask Click the mask thumbnail in the Layers panel The Layers panel displays a yellow highlight around a mask thumbnail when it is selected To select masked objects Click the masked obj...

Страница 224: ...he mask on the canvas using the Pointer tool 2 Drag the mask to a new location but don t drag the move handle unless you want to move the masked object separately from the mask To move masks and maske...

Страница 225: ...jects independently of the mask using the move handle 1 Select the mask on the canvas using the Pointer tool 2 Drag the move handle to a new location The objects move without affecting the position of...

Страница 226: ...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 To modify a mask by adding more mask...

Страница 227: ...f the path or text is used as the mask Optionally you can show the mask s fill and stroke This produces the same result as using Paste Inside to create masks For more information see Creating a mask f...

Страница 228: ...or masks into bitmap masks Bitmap masks cannot be converted into vector masks however For more information about vector and bitmap masks see About masks on page 211 To apply a vector mask using its pa...

Страница 229: ...the thumbnail of the masked object in the Layers panel and select Edit Paste as Mask 3 Click Replace when asked whether to replace the existing mask or add to it The existing mask object is replaced...

Страница 230: ...mode Fireworks applies it to the selected objects in their entirety Objects in a single document or on a single layer can have blending modes that differ from those of other objects in the document o...

Страница 231: ...with the luminance and saturation of the base color to create the result color Saturation combines the saturation of the blend color with the luminance and hue of the base color to create the result c...

Страница 232: ...s Here are examples of some of the blending modes in Fireworks For additional examples see the following web site at www pegtop net delphi blendmodes Original image Normal Multiply Screen Darken Light...

Страница 233: ...or or the Layers panel 3 Select a setting from the Opacity pop up slider or type a value in the text box To set a default blending mode and opacity level to be applied to objects as you draw them 1 Ch...

Страница 234: ...234 Chapter 9 Layers Masking and Blending...

Страница 235: ...ly save them in the Styles panel and then apply that combination of attributes to other objects Fireworks has three types of symbols graphic animation and button Each has unique characteristics for it...

Страница 236: ...has many predefined styles You can add change and remove styles The Fireworks CD ROM and the Macromedia web site have many more predefined styles that you can import into Fireworks You can also export...

Страница 237: ...yle is displayed in the Styles panel You can also delete styles from the Styles panel The following attributes can be saved in a style Fill type and color including patterns textures and vector gradie...

Страница 238: ...Double click a style in the Styles panel 3 In the Edit Style dialog box select or deselect components of the attributes you wish to apply The Edit Style dialog box contains the same options as the Ne...

Страница 239: ...menu to switch between large and small preview sizes Applying attributes without creating a style You can copy attributes from one object and apply them to other objects without creating a new style i...

Страница 240: ...submenu You can create a symbol from any object text block or group and then organize them in the Library panel To place instances in a document you simply drag them from the Library panel onto the c...

Страница 241: ...select Modify Symbol Edit Symbol 2 Make changes to the symbol and close the window The symbol and all instances reflect the modifications To rename a symbol 1 Double click the symbol name in the Libr...

Страница 242: ...edits you make to the symbol won t be reflected in the former instance Button symbols have several convenient features that allow you to retain the symbol instance relationship for a group of buttons...

Страница 243: ...g or dragging and dropping You can import symbols from other libraries including libraries containing symbols prepared in Macromedia Fireworks and libraries containing symbols that you or someone else...

Страница 244: ...an navigate to previously exported symbol library PNG files For more information see the next procedure In addition you can import symbols from previously exported library PNG files located on your ha...

Страница 245: ...enu to export them in a PNG file You can then import the symbols by navigating to the PNG file that contains the symbols using the Edit Libraries submenu For more information see Importing symbols on...

Страница 246: ...d store the URLs in the library You use the URL panel to add edit and organize your URLs For example if your website contains several navigation buttons to return to your home page you can add the URL...

Страница 247: ...you create are stored in the URL Libraries folder in the Macromedia Fireworks 8 folder in your user specific Application Data Windows or Application Support Macintosh folder For information on locatin...

Страница 248: ...ete URL from Library button at the bottom of the URL panel To delete all unused URLs from the library 1 Select Clear Unused URLs from the URL panel Options menu 2 Click OK Editing URLs You can easily...

Страница 249: ...represents one level htmldocs file htm links to a file located in a folder named htmldocs which is in the folder containing the source document Relative URLs are usually the simplest ones to use for l...

Страница 250: ...250 Chapter 10 Using Styles Symbols and URLs...

Страница 251: ...create rollover and swap image effects in the workspace You can view the assigned behaviors in the Behaviors panel and create more complex interactions using this panel You can also incorporate intera...

Страница 252: ...thout sacrificing quality Slicing enables you to optimize each individual slice using the most appropriate file format and compression settings For more information see Chapter 14 Optimizing and Expor...

Страница 253: ...area includes the outermost edges of the selected object 2 If more than one object is selected select how to apply slices Single creates a single slice object that covers all selected objects Multipl...

Страница 254: ...or select HTML from the Type pop up menu 3 Click Edit 4 Type text in the Edit HTML Slice window and format the text if desired by adding HTML text formatting tags 5 Click OK to apply your changes and...

Страница 255: ...ygon Slice tool 2 Click to place the vector points of the polygon The Polygon Slice tool draws only straight line segments 3 When drawing a polygon slice object around objects with soft edges be sure...

Страница 256: ...bjects currently in your document 3 Click a slice name to select it The slice is highlighted in the Web Layer and is selected on the canvas Showing and hiding slices Hiding a slice renders the slice i...

Страница 257: ...selected slice object In the Property inspector select a new color from the color box To change the color of slice guides 1 Select View Guides Edit Guides 2 Select a new color from the Slice Color se...

Страница 258: ...ce object by dragging its slice guides If multiple slice objects are aligned along a single slice guide you can drag that slice guide to resize all the slice objects simultaneously Resizing multiple s...

Страница 259: ...o edit the shape of a selected slice do one of the following Select the Pointer or Subselection tool and drag the slice s corner points to modify its shape Use a transformation tool to perform the des...

Страница 260: ...ate simple interactivity 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 multi...

Страница 261: ...incorporating rollover effects For more information see Creating hotspots on page 276 About rollovers Rollovers all work the same way One graphic triggers the display of another when the pointer rolls...

Страница 262: ...mple rollover to a slice 1 Ensure that the trigger object is not on a shared layer For more information see Sharing layers on page 209 2 Select Edit Insert Slice to create a slice on top of the trigge...

Страница 263: ...erent location on the web page The image that is rolled over is considered the trigger the image that changes is considered the target As with simple rollovers that use just one slice you first have t...

Страница 264: ...1 in the Frames panel to return to the frame that has the original image 6 Select the slice hotspot or button that covers the trigger area the original image and place the pointer over the behavior ha...

Страница 265: ...to the upper left edge of the same slice creates a swap image and dragging it to another slice creates a disjoint rollover 2 Select the frame of the swap image and click OK 3 Create more rollovers by...

Страница 266: ...is automatically set for you by default when you use the Button Editor to create a button that includes an Include Over While Down state or Show Down Image Upon Load state When you create a two state...

Страница 267: ...t such as onClick that triggers the behavior To change the mouse event that activates the behavior 1 Select the trigger slice or hotspot containing the behavior you want to modify All behaviors associ...

Страница 268: ...av Bar Down dialog box select Image File and click the folder icon 2 Navigate to the file you want to use and click Open 3 If necessary deselect Preload Images if the external file is an animated GIF...

Страница 269: ...auto naming convention that Fireworks uses through the HTML Setup dialog box Fireworks exports a sliced Fireworks document as an HTML file and a series of graphic files You can define properties for...

Страница 270: ...nts in a new unnamed browser window parent loads the linked document in the parent frameset or window of the frame that contains the link If the frame containing the link is not nested then the linked...

Страница 271: ...me to each slice file automatically based on the default naming convention To auto name a slice file When you export your sliced image enter a name in the File Name Windows or Name Macintosh text box...

Страница 272: ...hic home_f2 gif and the Down state graphic home_f3 gif You can create your own naming convention for multiframe slices using the HTML Setup dialog box To change the default auto naming convention 1 Se...

Страница 273: ...wly in browsers but because there are no spacers it is easier to edit their HTML For more information about HTML see Exporting HTML on page 357 To define how Fireworks exports HTML tables 1 Select Fil...

Страница 274: ...reaking Space places an HTML space tag in empty cells The cell appears hollow 6 Click OK For more information about specifying HTML export options see Setting HTML export options on page 367 NO TE If...

Страница 275: ...wnload and the processing power required to reassemble sliced graphics Hotspots are ideal when you want areas of an image to link to other web pages but you don t need those areas to highlight or prod...

Страница 276: ...panel 2 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 To create an odd shaped hotspot 1 Select the Polygon H...

Страница 277: ...or polygon hotspot In the Property inspector select Rectangle Circle or Polygon from the Hotspot Shape pop up menu Preparing hotspots for export You can use the Property inspector to assign URLs alter...

Страница 278: ...rresponding graphics files which you can later import into Dreamweaver or another HTML editor Copy to Clipboard copies all required HTML including a table if the document is sliced to the Clipboard so...

Страница 279: ...fined by a slice Rollover effects are applied to hotspots the same way that they are to slices For more information see Adding simple interactivity to slices on page 260 After you create a disjoint ro...

Страница 280: ...t the text triggers the rollover effect yet the entire graphic beneath the slice swaps out when the rollover effect occurs Avoid creating hotspots that overlap more than one slice or unpredictable beh...

Страница 281: ...has a Pop up Menu Editor which allows you to quickly and easily create vertical or horizontal pop up menus The Advanced tab of the Pop up Menu Editor gives you creative control over cell spacing and p...

Страница 282: ...to edit Double click the instance on the canvas and you can change it in the Button Editor or the Property inspector Like other symbols buttons have a registration point The registration point is a ce...

Страница 283: ...tate tab 2 Import or create the Up state graphic Drag and drop or import the graphic that will appear as the button s Up state into the work area of the Button Editor Use the drawing tools to create a...

Страница 284: ...two state button on page 283 To create a Down state 1 With a two state button open in the Button Editor click the Down tab 2 Do one of the following to create the button s Down state Click Copy Over...

Страница 285: ...Select Bevel and Emboss Inner Bevel Select Bevel and Emboss Outer Bevel 4 In the pop up window that appears select a button preset filter These are described below 5 Repeat steps 1 through 4 for the r...

Страница 286: ...tional instances of a button symbol in a document do one of the following Select an instance and then select Edit Clone to place another instance directly in front of the selected instance The new ins...

Страница 287: ...on the submenu These libraries contain a wide variety of premade button symbols prepared by Macromedia You import and export button symbols just as you import and export animation and graphic symbols...

Страница 288: ...ce level properties are edited in the Property inspector when a single instance is selected You change these properties for an instance without affecting the associated symbol or any other instances o...

Страница 289: ...nclose all the states of a button You can edit a button slice only in the Active Area tab of the Button Editor Each button can have only one slice If you draw a slice using a slice tool in the active...

Страница 290: ...pears in the Link text box in the Property inspector for each instance This is helpful when entering absolute URLs within a site you need only complete the last part of the URL in each instance s Link...

Страница 291: ...tor 1 Do one of the following to open the button in the Button Editor Double click a button instance in the workspace In the Library panel double click the button preview or the symbol icon beside the...

Страница 292: ...be a symbol or instance level button property You can set alternate text for a button symbol or instance in the Property inspector To set the alt text for a button symbol in the Button Editor 1 Do on...

Страница 293: ...stance and select Edit Clone Alt drag Windows or Option drag Macintosh the button instance 4 Shift drag a button to align it horizontally or vertically For more precise control use the arrow keys to m...

Страница 294: ...zontal orientation Advanced contains options that determine the cell dimensions padding and spacing the cell border width and color menu delay and text indention Position contains options that determi...

Страница 295: ...pop up menu if any are available If you ve entered URLs for other web objects in the document those URLs appear in the Link pop up menu Target designates the target for the URL You can enter a custom...

Страница 296: ...der the item directly above it on the menu item list 4 To add the next item to the submenu highlight it and click Indent Menu All items that are contiguously indented at the same level constitute a si...

Страница 297: ...to the Appearance 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 dis...

Страница 298: ...states and select vertical or horizontal orientation in the Appearance tab of the Pop up Menu Editor To set the orientation of a pop up menu 1 With the desired pop up menu open in the Pop up Menu Edit...

Страница 299: ...p menu or enter the name of a custom font 4 Optionally click a text style button to apply a bold or italic style 5 Click a justification button to align text to the left or right or center it 6 Select...

Страница 300: ...itor 1 Apply any combination of stroke fill texture and Live Filters to an object and save it as a style using the Styles panel For more information see Creating and deleting styles on page 237 2 Sele...

Страница 301: ...menu in the Pop up Menu Editor see Editing pop up menus on page 304 2 Select a width or height constraint from the Automatic Pixels pop up menu Automatic forces the cell height to conform to the text...

Страница 302: ...rder Border Color Shadow and Highlight allow you to modify the color of pop up menu borders 8 Do one of the following to complete the pop up menu or continue building it Click Next to move to the Posi...

Страница 303: ...on tab For information on opening an existing pop up menu in the Pop up Menu Editor see Editing pop up menus on page 304 2 Do one of the following to define the menu position Click a Position button t...

Страница 304: ...submenu position To make each submenu s position relative to the parent pop up menu select Place in Same Position 4 Click Done to close the Pop up Menu Editor or click Back to modify properties on oth...

Страница 305: ...can also choose to have the CSS code written to an external css file and export that file along with an mm_css_menu js file to the same location as the HTML file If you do not choose to use CSS code f...

Страница 306: ...n image file called arrows gif This image is the tiny arrow that appears next to a menu entry that tells users a submenu exists No matter how many submenus a document contains Fireworks always uses th...

Страница 307: ...ngs to the symbol to gradually change the content of successive frames You can make a symbol appear to move across the canvas fade in or out get bigger or smaller or rotate Because you can have multip...

Страница 308: ...fading in or out and angle and direction of rotation For more information see Editing animation symbols on page 310 3 Use the Frame Delay controls in the Frames panel to set the speed of the animated...

Страница 309: ...on and the type of action such as scaling or rotation By default a new animation symbol has five frames each with a delay time of 0 07 seconds To create an animation symbol 1 Select Edit Insert New Sy...

Страница 310: ...properties in the Property inspector You can edit any of the following properties for an animation symbol Frames is the number of frames you want to include in the animation Although the slider limit...

Страница 311: ...x click OK to accept the changed properties Removing animations You can remove animations either by deleting the animation symbol from the library or by removing the animation from the symbol To remov...

Страница 312: ...mbol moves The green dot on the motion path indicates the starting point and the red dot shows the end point The blue points on the path represent frames For example a symbol with five frames would ha...

Страница 313: ...me delay determines how long the current frame is displayed It is specified in hundredths of a second For example a setting of 50 displays the frame for half a second and a setting of 300 displays it...

Страница 314: ...ming animation frames As you set up an animation Fireworks creates the appropriate number of frames and displays them in the Frames panel By default the frames are named Frame 1 Frame 2 and so on When...

Страница 315: ...ick OK Duplicating a frame is useful when you want objects to reappear in another part of the animation To reorder frames Drag the frames one by one to a new location in the list To delete the selecte...

Страница 316: ...the Layers panel to share the layer across frames When a layer is shared across frames all objects on that layer are visible in every frame You can edit objects on shared layers from any frame those...

Страница 317: ...and following the currently selected frame You can smoothly animate objects without having to flip back and forth through them The term onion skinning comes from a traditional animation technique of...

Страница 318: ...frames in between In Fireworks tweening blends two or more instances of the same symbol creating interim instances with interpolated attributes Tweening is a manual process useful for more sophistica...

Страница 319: ...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 To preview an animation in...

Страница 320: ...he number of times to repeat the animation after the first time If you select 4 for example the animation plays five times in all Forever repeats the animation continuously Setting transparency As par...

Страница 321: ...clip art and cartoonlike graphics For information about exporting animated GIFs see Exporting an animation on page 355 You can export the animation as a Flash SWF file and then import it into Macromed...

Страница 322: ...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 When you open an animat...

Страница 323: ...ad based on several existing graphics by opening each graphic and placing it in a separate frame in the same document To open multiple files as an animation 1 Select File Open 2 Shift click to select...

Страница 324: ...324 Chapter 13 Creating Animation...

Страница 325: ...The wizard guides you through the export process and suggests settings It also displays the Image Preview where you can optimize a document as part of the export process If you are comfortable with th...

Страница 326: ...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 imag...

Страница 327: ...ving see Saving documents in other formats on page 27 To export a document using the Export Wizard 1 Select File Export Wizard 2 Answer any questions that appear and click Continue in each panel Firew...

Страница 328: ...ge Preview To edit optimization settings click the Options tab For information about the options available on this tab see the following procedures To edit the size and area of the exported image clic...

Страница 329: ...tings 6 In the Export dialog box type a name for the file select a destination set any other options if desired and click Save For more information about the options in the Export dialog box see Expor...

Страница 330: ...export area Drag the dotted border that appears around the preview until it encloses the desired export area Drag inside the preview to move hidden areas into view Enter pixel coordinates for the bou...

Страница 331: ...ing graphics for use on the web is a two step process optimizing then exporting or in some cases simply saving Optimizing graphics ensures they possess the right mix of color compression and quality A...

Страница 332: ...When you select an option from the Default export options pop up menu in the Property inspector the rest of the options in the Optimize panel are automatically set for you You can further adjust each...

Страница 333: ...mize panel select an option from the Export File Format pop up menu 2 Set format specific options such as color depth dither and quality 3 Select other optimization settings from the Optimize panel Op...

Страница 334: ...it would take to download all the document s slices and frames on a 56K modem The 2 Up and 4 Up views display additional information that varies depending on the file type selected You can use the Opt...

Страница 335: ...from 2 Up or 4 Up view 1 Select an optimized view 2 Select Original No Preview from the Preview pop up menu at the bottom of the preview window To switch the Original view to an optimized view from 2...

Страница 336: ...ons WBMP or Wireless Bitmap is a graphic format created for mobile computing devices such as cell phones and PDAs This format is used on Wireless Application Protocol WAP pages WBMP is a 1 bit format...

Страница 337: ...close to websafe colors are converted to the closest websafe color Websafe colors are those that come from the Web 216 palette Web 216 is a palette of the 216 colors common to both Windows and Macinto...

Страница 338: ...es smaller by reducing the number of colors they use Reducing color depth discards some colors in the image beginning with those used least Pixels containing discarded colors convert to the closest co...

Страница 339: ...lend to create the appearance of the missing color Dithering is especially helpful when exporting images with complex blends or gradients or when exporting photographic images to an 8 bit graphic file...

Страница 340: ...ols appear on some color swatches indicating certain characteristics of individual colors as follows If you edit the document the color table may no longer show all the colors in the document When thi...

Страница 341: ...he pixels that contain the selected swatch temporarily change to another highlight color until you release the mouse button Locking colors in a palette You can lock individual colors so that you canno...

Страница 342: ...the replaced color in the preview area Using websafe colors Websafe colors are colors that are common to both Macintosh and Windows platforms These colors are not dithered when viewed in a web browse...

Страница 343: ...Optimize panel Options menu 2 Type a name for the palette and select a destination folder 3 Click Save You can load the saved palette file into the Swatches panel or Optimize panel for use when export...

Страница 344: ...t it and most web browsers do not support PNG format Alpha transparency is often used in exported graphics that contain gradient transparency and semi opaque pixels Alpha transparency is also useful f...

Страница 345: ...r 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 2 In the Optimize panel click the Add Color to Transparency or Remove Color from Transp...

Страница 346: ...G by editing its color palette The color table is empty when a JPEG image is selected As you experiment with different optimization settings you can use the 2 Up and 4 Up buttons to test and compare a...

Страница 347: ...tting maintains image quality but compresses less producing larger files A low percentage setting yields a small file but produces a lower quality image Selectively compressing areas of a JPEG Selecti...

Страница 348: ...All text items will automatically be exported at a higher level regardless of the Selective Quality value 8 Select Preserve Button Quality All button symbols will automatically be exported at a highe...

Страница 349: ...an object into the background on which it is placed For example if the object is black and the page on which it rests is white anti aliasing adds several shades of gray to the pixels surrounding the...

Страница 350: ...alos in native Fireworks PNG files and imported Photoshop files do one of the following Set the Canvas Color in the Property inspector or the Matte Color in the Optimize panel to the color of the targ...

Страница 351: ...enu in the Optimize panel and in the Property inspector They are available in all subsequent documents The preset file is saved in the Export Settings folder in your user specific Fireworks configurat...

Страница 352: ...erence which is defined if you ve ever exported the document and then saved the PNG 2 The current export save location which is defined anytime you browse away from the default location presented in a...

Страница 353: ...ML Setup dialog box For more information see Setting HTML export options on page 367 To export a sliced Fireworks document 1 Select File Export 2 Navigate to the desired folder on your hard drive 3 Se...

Страница 354: ...ort only the slices you selected before export select Selected Slices Only and ensure that the Include Areas Without Slices option is not selected 6 Click Export Each slice is exported using its optim...

Страница 355: ...porting to multiple files see Exporting frames or layers on page 356 For information about exporting animations as Flash SWF files see Working with Macromedia Flash on page 392 To export an animation...

Страница 356: ...estination and click Export Exporting frames or layers Fireworks can export each layer or frame in a document as a separate image file using the optimization settings specified in the Optimize panel T...

Страница 357: ...Export 6 In the Export dialog box type a filename and select a destination folder 7 In the Export pop up menu select Images Only 8 Click Export Exporting HTML Unless you specify otherwise when you exp...

Страница 358: ...e standard for displaying web pages on the Internet An HTML file is a text file that contains these elements Text that will appear on the web page HTML tags that define the formatting and structure of...

Страница 359: ...nt contains pop up menus and you export those pop up menus the following files are exported mm_css_menu js and a css file containing the CSS pop up menu code If your pop up menus contain submenus an a...

Страница 360: ...hoosing Export HTML generates an HTML file and the associated image files in the location you specify 7 Select Export Slices from the Slices pop up menu if your document contains slices 8 Select Put I...

Страница 361: ...ther than Dreamweaver or Microsoft FrontPage JavaScript code associated with buttons behaviors and rollover images is copied but may not function correctly If these issues pose a problem for you use t...

Страница 362: ...he same location in which you exported your images 2 View the HTML code and place the insertion point in the desired location between the BODY tags NO T E Optionally if you are exporting to Dreamweave...

Страница 363: ...necessary code and copy it to the Clipboard 3 Open an existing HTML document or create a new one 4 Paste the code from the Clipboard at the desired location in the new HTML file You do not have to cop...

Страница 364: ...he end of the document 5 If Fireworks generated HTML is found select one of the following and click OK Replace Images and Their HTML replaces the previous Fireworks HTML Update Images Only overwrites...

Страница 365: ...In the not too distant future XHTML is expected to replace HTML as the standard for displaying web content Not only is XHTML backward compatible meaning that most current web browsers can view it but...

Страница 366: ...splay different character sets on the same HTML page Fireworks allows you to export HTML with UTF 8 encoding In Fireworks UTF 8 encoding is turned on by default so that any HTML document you export ca...

Страница 367: ...ctive elements export differently from Fireworks depending on the selected HTML style To export your document using the XHTML standard select the appropriate XHTML style from the pop up menu For more...

Страница 368: ...e of all images while they are downloading from the web and in place of any images that fail to download In some browsers it may also appear as a tooltip when the pointer passes over the image This is...

Страница 369: ...ML to the Clipboard You can export a Flash SWF file or copy selected objects as vectors You can even use the Quick Export button to start other applications as well as preview Fireworks documents in a...

Страница 370: ...le in the Optimize panel To send a document as an e mail attachment using your default e mail client 1 Select File Send to E mail 2 Select one of the following options Fireworks PNG attaches the curre...

Страница 371: ...opies the local version of the file to the remote site overwriting the remote file with the local copy Check In checks the local file in overwriting the remote file with the local copy Check In is ena...

Страница 372: ...372 Chapter 14 Optimizing and Exporting...

Страница 373: ...amweaver and Fireworks share a tight integration known as Roundtrip HTML Roundtrip HTML allows you to make changes in one application and have those changes seamlessly reflected in the other Dreamweav...

Страница 374: ...an open the Fireworks Export Preview dialog box from the Dreamweaver Property inspector and enter updated settings In either case updates are made to the placed files in Dreamweaver as well as to the...

Страница 375: ...of Fireworks and Dreamweaver by allowing you to experiment with various web page layouts before creating the final artwork for your page Image placeholders allow you to specify the size and position o...

Страница 376: ...Click the Images Image pop up menu in the Common category of the Insert bar and choose Image Placeholder The Image Placeholder dialog box appears 3 Enter the name dimensions color and alternate text f...

Страница 377: ...works Help 7 Specify a name for the exported image file or files in the Export dialog box These are the image files that are displayed in Dreamweaver 8 Specify a location for the exported image file o...

Страница 378: ...the location you specify You then place the HTML code into Dreamweaver using the Insert Fireworks HTML feature To export Fireworks HTML Export your document to HTML format For more information see Fir...

Страница 379: ...nt is copied into the Dreamweaver document images are exported to a location you specify and Dreamweaver updates the HTML with document relative links to those images To copy Fireworks HTML to the Cli...

Страница 380: ...orted HTML code and image files placed in a Dreamweaver document This command lets you update Dreamweaver files even when Dreamweaver is not running To update Fireworks HTML placed in Dreamweaver 1 Ma...

Страница 381: ...e process of editing and updating frequently used website components such as company logos or other graphics that appear on every page of a site A library item is a portion of an HTML file located in...

Страница 382: ...not exist use the Select Folder dialog box to create or locate the folder The folder must be named Library the case is important because Dreamweaver is case sensitive 3 In the Export dialog box type...

Страница 383: ...pector in Dreamweaver helps you identify Fireworks generated images table slices and tables in a document Although Fireworks supports most types of Dreamweaver edits radical changes made to a table s...

Страница 384: ...ver Dreamweaver recognizes and preserves all edits applied to the image in Fireworks 5 When you have finished editing the image click Done in the Document window The image is exported using the curren...

Страница 385: ...Property inspector Select an image in the table then click Edit in the Property inspector Control double click Windows or Command double click Macintosh the image you want to edit Right click Windows...

Страница 386: ...desired and the behavior will still be intact when you return to Dreamweaver When you work with Roundtrip HTML from Dreamweaver Fireworks supports server side file formats such as CFM and PHP Dreamwe...

Страница 387: ...ed image A dialog box opens Although the title bar doesn t display this name this is actually the Fireworks Export Preview dialog box 3 Make the desired edits in the Export Preview dialog box To edit...

Страница 388: ...nimations placed in Dreamweaver on page 386 and Using Export Preview in Fireworks Help Setting launch and edit options To use Roundtrip HTML effectively you should perform some preliminary tasks such...

Страница 389: ...orks 2 does not support opening and editing source PNG files for placed images To set Fireworks as the primary external image editor for Dreamweaver 1 In Dreamweaver choose Edit Preferences and then c...

Страница 390: ...aring the site can locate the source PNG when starting Fireworks from within Dreamweaver Specifying launch and edit preferences for Fireworks source files The Fireworks launch and edit preferences let...

Страница 391: ...ccess to file transport commands You can use the File Management button if your document resides in a Dreamweaver site folder and if the site has access to a remote server Fireworks recognizes your fo...

Страница 392: ...you can also import JPEG GIF PNG and SWF files that have been exported from Fireworks Importing Fireworks PNG files into Flash You can import Fireworks PNG source files directly into Flash without hav...

Страница 393: ...iles see Fireworks Help 2 Switch to an open document in Flash 3 Optional Click the keyframe and layer onto which you want to import the Fireworks content This is necessary only if you plan to import t...

Страница 394: ...map image Keep all Text Editable preserves the editability of all text If text objects contain special fills strokes or effects that Flash does not support those properties are lost 9 Select the Impor...

Страница 395: ...ations as SWF files Fireworks graphics and animations can be exported as Flash SWF files You can make several choices about how objects are exported Some formatting is lost unless you choose Maintain...

Страница 396: ...g are lost Maintain Appearance converts vector objects to bitmap objects as needed and preserves the appearance of applied strokes and fills Editability is lost 6 In the Text section choose one of the...

Страница 397: ...Select PNG 8 as the Export file format and Alpha Transparency from the Transparency pop up menu 3 Select File Export 4 Select Images Only from the Save as Type pop up menu Name the file then click Sa...

Страница 398: ...Control click Macintosh the graphic file in the Library panel 2 Select Edit with Fireworks from the pop up menu 3 Click Yes in the Find Source box if you want to locate the original PNG file for your...

Страница 399: ...later graphics Importing FreeHand graphics into Fireworks Fireworks can import vector graphics that were created in FreeHand You can set the following options when importing a FreeHand graphic Scale...

Страница 400: ...le bitmap object in a Fireworks document Enter a number in the text box to determine how many objects a group blend or tiled fill can contain before it is rasterized during import To import vector gra...

Страница 401: ...that were created in Fireworks Depending on the options you select when importing or opening FreeHand can import Fireworks layers frames vectors text bitmaps and some effects that are shared by both a...

Страница 402: ...o uneditable bitmap images Only objects with effects strokes and fills not shared by FreeHand are converted Keep All Paths Editable lets you edit all imported vector objects Some objects might appear...

Страница 403: ...opy in Fireworks 2 Select Edit Copy or click the Quick Export button and choose Copy from the FreeHand pop up menu 3 Switch to an open document in FreeHand 4 Select Edit Paste The Fireworks PNG Import...

Страница 404: ...from the Save As pop up menu 4 Click the Options button 5 In the Illustrator Export Options dialog box choose one of the following Export Current Frame Only preserves layer names and exports only the...

Страница 405: ...aphic editors including Macromedia FreeHand do not support the following Fireworks features Live Filters Blending modes Textures pattern fills web dither fills and gradient fills Slice objects and ima...

Страница 406: ...g layered and sliced content to Director By exporting Fireworks slices to Director you can export sliced and interactive content such as buttons and rollover images By exporting layers to Director you...

Страница 407: ...ttened images that you have exported from Fireworks such as JPEG GIF and 32 bit PNG images Or you can import Fireworks layers slices and interactive elements by inserting Fireworks HTML To import a fl...

Страница 408: ...f they contain transparency choose 32 bit color Registration allows you to set the registration point for the imported graphics Import Rollover Behaviors as Lingo converts Fireworks behaviors to Lingo...

Страница 409: ...ember 1 In Director right click Windows or Control click Macintosh the graphic in the Cast window 2 Select Launch External Editor from the pop up menu The file opens in Fireworks and the Document wind...

Страница 410: ...asy But even more important Fireworks and HomeSite share a powerful integration that allows you to start Fireworks from HomeSite to edit web graphics Placing Fireworks images in HomeSite You can inser...

Страница 411: ...e 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 Ho...

Страница 412: ...ages in HomeSite You can use launch and edit integration to edit images in a HomeSite document HomeSite automatically starts Fireworks letting you make the desired edits to the image When you exit Fir...

Страница 413: ...g native Photoshop PSD files with options for retaining many aspects of the imported files including layers masks and editable text As a result you can bring Photoshop images into Fireworks for furthe...

Страница 414: ...ireworks 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...

Страница 415: ...ctual text that may differ in appearance from the original text The original font data is stored in the PNG file so that if the file is on a system that does have the fonts you can choose to use those...

Страница 416: ...m the original Text Maintain Appearance converts text in the Photoshop file to a bitmap object in Fireworks This option maintains the original appearance of the text but does not allow you to edit it...

Страница 417: ...third party filters and plug ins using the Live Filters window 1 Select any vector object bitmap object or text block on the canvas and click the Add Effects button in the Property inspector 2 Select...

Страница 418: ...ns for objects effects and text in the Fireworks file Individual export options are described in detail in Customizing files for export to Photoshop on page 419 Maintain Editability over Appearance co...

Страница 419: ...ent in Photoshop If the effects do not exist in Photoshop they are discarded Render Effects flattens effects into their objects When you choose this option you preserve the appearance of the effects a...

Страница 420: ...ure allowing you to open and edit most any HTML document within Fireworks For more information see Fireworks Help About extending Fireworks If you are proficient in JavaScript and Fireworks you can us...

Страница 421: ...Process can apply custom optimization settings to groups of files You can also resize a group of files making Batch Process an ideal tool for creating thumbnails Using the History panel you can create...

Страница 422: ...rch 1 Open the document 2 Do one of the following to open the Find panel Select Window Find Select Edit Find Press Control F Windows or Command F Macintosh 3 From the Search pop up menu select a sourc...

Страница 423: ...a found element with the contents of the Change To option Replace All finds and replaces every occurrence of a found element throughout the search range Setting options for finding and replacing in m...

Страница 424: ...es folder and the next higher number is added to its filename For example for a file named Drawing png the first time you find and replace the backup file is named Drawing 1 png The second time you fi...

Страница 425: ...Select an item from the Apply To pop up menu to determine how the colors found are applied Fills Strokes finds and replaces both fill and stroke colors All Properties finds and replaces fill stroke an...

Страница 426: ...Select Find Non Web216 from the Find pop up menu of the Find panel Batch processing Batch processing is a convenient way to automatically convert a group of graphic files These are the batch processi...

Страница 427: ...Batch processing 427 You also have the option of not selecting any files at all while using the wizard if you only want to save the batch process script for later use...

Страница 428: ...ves selected files from the list of files to batch process 3 Select Include Current Open Files to add all currently open files These files do not appear in the list of files to batch process but they...

Страница 429: ...lenames with a batch process on page 433 For more information on adding commands see Performing commands with a batch process on page 434 To reorder the list select the task in the Include in Batch li...

Страница 430: ...the batch process output location on page 435 10 Click Save Script if you want to save the batch process settings for future use For more information see Saving batch processes as scripts on page 436...

Страница 431: ...example when you batch process a folder of GIFs and JPEGs the resulting files remain GIFs and JPEGs and Fireworks uses the original palette and compression settings when exporting each file Select Cus...

Страница 432: ...you can also choose to scale only those documents that are currently larger than the target size To do so select the Only Scale Documents Currently Larger Than Target Size option 4 Click Next to cont...

Страница 433: ...box To set naming options for batch processed files 1 Select Rename from the Batch Options list and click Add 2 Specify Rename options at the bottom of the Batch Process dialog box Replace with lets...

Страница 434: ...iangle Macintosh beside the Commands option in the Batch Options list to view the available commands 2 Select a command and click Add to add it to the Include in Batch list 3 Click Next to continue th...

Страница 435: ...ackups to set your backup options 3 Select how you want to back up the files Overwrite Existing Backups overwrites the previous backup file Incremental Backups keeps copies of all the backup files Whe...

Страница 436: ...tside Fireworks double click the script filename on your hard disk 2 Select a script and click Open 3 Select the files to process with the script Current Open Files processes all open documents Custom...

Страница 437: ...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 Flash SWF movies as custo...

Страница 438: ...er see About user configuration files on page 452 To open the Extension Manager from within Fireworks do one of the following Select Commands Manage Extensions Select Help Manage Extensions For more i...

Страница 439: ...left of the History panel To change the number of steps the History panel remembers 1 Select Edit Preferences Windows or Fireworks Preferences Macintosh 2 Change Undo Steps to the number of steps you...

Страница 440: ...dit Paste To repeat the last step Select Edit Repeat Command Script About scripting with JavaScript You can reduce the tedium of some repetitive tasks by writing your own JavaScript in a text editor t...

Страница 441: ...that you created do one of the following In Fireworks select Commands Manage Saved Commands Then select the command and click Delete On your hard disk delete the JSF file for the command from the Comm...

Страница 442: ...directly into the Commands folder as well as those saved in the History panel appear in the Commands menu as soon as you save them so restarting Fireworks is not necessary However commands saved in th...

Страница 443: ...r hard disk the movie will appear as a panel in the Fireworks Window menu For more information about using Flash SWFs as Fireworks panels see Extending Fireworks NO TE The exact location of this folde...

Страница 444: ...444 Chapter 16 Automating Repetitive Tasks...

Страница 445: ...preferences 445 Changing keyboard shortcut sets 449 Working with configuration files 451 About reinstalling Fireworks 453 Viewing package contents Macintosh only 453 Setting preferences Fireworks has...

Страница 446: ...as sharp as Bicubic Soft interpolation which was used in Fireworks 1 gives a soft blur and eliminates sharp details This method is useful when others produce unwanted artifacts Nearest Neighbor interp...

Страница 447: ...p to Guides is turned on Snap Distance can be between 1 and 10 pixels Launch and Edit preferences By setting launch and edit preferences you can control how external applications such as Macromedia Fl...

Страница 448: ...s in the Property inspector For more information about textures and patterns see Adding texture to a fill on page 191 Photoshop Import preferences The preferences in the Import tab let you manage Phot...

Страница 449: ...ands 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 FreeHand Illustrator Photosh...

Страница 450: ...cular category appear in the Commands scroll list 5 Select the command whose shortcut you want to modify from the Commands list If a shortcut exists it is displayed in the Shortcuts list 6 Click in th...

Страница 451: ...guration files This lets you customize features in Fireworks such as styles keyboard shortcuts commands and so forth without affecting the configuration of Fireworks for other users Fireworks creates...

Страница 452: ...e access to all files if they are on multiuser systems Users with administrator level access can customize features for all users by modifying the master configuration files in the Fireworks applicati...

Страница 453: ...This is a feature from Apple that allows applications to be installed in a self contained package The application package is where the Fireworks application file is stored along with all default confi...

Страница 454: ...454 Chapter 17 Preferences and Keyboard Shortcuts...

Страница 455: ...1 frames 310 inserting frames 314 looping 320 managing frames 313 movement 310 moving objects to another frame 315 multiframe editing 318 naming frames 314 onion skinning 317 opacity 311 opening 322 o...

Страница 456: ...ing with tools 30 Display Striped Border preference 447 switching to 80 bitmaps adjusting brightness and contrast 100 adjusting color and tone 93 adjusting hue and saturation 101 blurring and sharpeni...

Страница 457: ...bsafe 175 fills 101 finding and replacing 425 finding and replacing non websafe 426 gradient fills 185 inverting values 103 picking from color bar 173 pop up window 176 removing unused 339 replacing a...

Страница 458: ...138 copying all selected objects on a layer 207 bitmaps 67 frames 315 HTML 361 object attributes 239 objects 68 pixels 55 copying and pasting Fireworks HTML 361 362 symbol instances 245 copying and p...

Страница 459: ...canvas drop shadows 197 198 duplicating by dragging 68 selected objects 68 E e mail 370 edges beveled 196 showing and hiding 54 Edit Gradient dialog box 186 Edit Stroke dialog box 179 editing actions...

Страница 460: ...le size reducing quality 347 setting loss to reduce size 343 filenames changing in a batch process 433 files unlocking 371 391 Fill Color box 84 Fill Color Live Filter 233 fills adding texture to 191...

Страница 461: ...ewing current and adjacent 318 viewing next 318 Frames panel 33 313 freeform paths 123 FrontPage 369 Full Screen with Menus mode 40 G Gaussian Blur filter 105 GIF file format choosing 336 choosing a c...

Страница 462: ...ting 277 images exporting 352 Image Editing panel 82 painting 83 saving 352 selecting 55 selecting pixels 55 images as fills See Paste Inside command import text 161 ASCII text 162 Photoshop files 162...

Страница 463: ...cts 195 creating 201 editing 200 enabling or disabling 195 Fill Color 233 in buttons 285 Photoshop plug ins 198 removing 200 renaming 201 reordering 200 locked files 371 391 locking layers 208 M Macro...

Страница 464: ...matching Clipboard size 18 new features 9 newsgroup Fireworks 12 Numeric Transform command 73 O object oriented graphics 16 objects converting to animation 309 creating bitmaps 80 distorting 73 groupi...

Страница 465: ...djacent segments 131 changing adjacent segments 130 changing shape 130 converting straight to curved 129 copying and pasting 403 creating custom strokes 179 cropping 139 editing strokes 177 pulling 13...

Страница 466: ...g appearance 298 editing 304 entering menu text 295 296 exporting 305 setting position 303 Precise Cursors preference 446 preferences 445 color defaults 446 default 449 editing options 446 folder opti...

Страница 467: ...tool 71 scaling graphics 431 interpolation options 446 objects 71 scripting 440 editing scripts 442 Flash SWF files 440 scrolling the canvas See also panning searching 422 See also finding and replaci...

Страница 468: ...59 showing or hiding slice overlay 335 text 254 updating 354 using nested tables 273 using spacer 273 slicing definition 252 for interactivity 252 Smart Polygon tool 115 Smooth command 63 Smudge tool...

Страница 469: ...uirements for Fireworks 7 T text alignment 153 attributes saving 157 checking spelling 163 color 148 direction of 152 editing 147 entering 144 expanding or contracting character width 156 finding and...

Страница 470: ...See also opacity transparent areas 344 trimming the canvas 45 Turn off Hide Edges preference 447 Tween Instances command 318 tweening characteristics 318 defined 318 objects 318 typefaces See fonts U...

Страница 471: ...files 20 exporting to 336 opening from Fireworks 20 saving 28 Web Layer 210 websafe colors 342 Windows system colors as a swatch group 169 work environment 29 workflow in Fireworks 14 X XHTML 365 Z Z...

Страница 472: ...472 Index...

Отзывы:

Нет отзывов