Adobe Fireworks CS3 Tutorials
Optimizing Images / Optimization Summary & Review
Visitors to VTC.com will be able to view all introductory videos for each training course.
Free Trial Members will gain access to first three chapters for each training course.
Full Access Members have full access to VTC.com�s entire library of video tutorials.
Learn More
Subtitles of the Movie (Adobe Fireworks CS3 / Optimizing Images / Optimization Summary & Review)
Summarizing what I've covered so far in this section of the tutorial, exporting graphics for use on the Web is a two-step process, optimizing and then exporting, or in some cases, simply saving the file. Optimizing graphics ensures that they possess the right mix of color, compression and image quality. After you finalize a graphic's optimization settings, the graphic is now ready for export. Earlier I demonstrated the use of the Export Wizard and the Image Preview in Fireworks CS3, but if you're comfortable optimizing and exporting graphics, Fireworks has an optimization and export tool in the workspace that gives you greater control over how files are exported. That would be the Optimize and Align panel. This panel contains the key controls for optimizing your images. Notice also for 8-bit images it contains a color table that displays the colors in the current export color palette. Notice that the colors will change depending on the image that I've selected here. Let me now review some of the more important settings here in the Optimize and Align panel. Let me start with this sample image of a flower. We have two drop downs here at the top. One is for choosing optimized file types, GIF, JPG, or Animated GIF. The second drop-down is for choosing any kind of file format, including GIF; Animated GIF, JPG; three varieties of PNG: 8-, 24-, and 32-bit; Windows BMP, three TIFs, 8-, 24-, and 32-bit; and then two bitmap file formats, 8- and 24-bit. Notice that for each of my selections I have different settings. For the BMP files I only have a mat color, but for TIF I've also got a color setting, a dither setting; dithering will blur the image to make it seem like it has more colors than 128, as well as, here, a palette: Adaptive, Web Adaptive, Web 216, Exact, Macintosh, Windows, Grayscale, Black and White, Uniform, and Custom. I'll talk more about palettes in a moment. For your PNG files, you have the most settings. You have a Mat setting, Number of Colors, a Dithering, as well as an Alpha Transparency, or an Index Transparency setting. This transparency setting will enable you to take one color and make it transparent, and then you have some tools down here for selecting which color will become transparent, as well as de-selecting the color using these eyedroppers. You also have transparency settings for the GIF file format. Again, Index, Alpha, or No Transparency with the selection tools here for choosing which color will become transparent. The JPG setting gives you a quality slider, which will allow you to indicate how much compression you want to apply to that image. Obviously the more compression the lower the quality setting, also the lower the file size. You also have a smoothing option for smoothing. When JPG images they get kind of blocky so you can counteract that by increasing the smoothing as you decrease the quality, or increase the compression. You can adjust that to remove that blockiness. You've also got a mat setting. Up here are your optimize files: GIF Web 216 will give you a GIF image with 216 colors. GIF Web Snap 256 will give you an image with 256 colors, and it will snap those colors to Web safe colors if possible. Web Snap 128 gives you 128 colors. Adaptive 256 will choose the very best 256 colors to make that image look it's best, and then you've got your two JPG settings: better quality or smaller file. Notice that I also have a section in the Optimize and Align panel here for palette information. I'm not showing any palette information for this JPG, but if I choose a GIF image, notice that this image has these six colors, and they're represented here in the palette area: All, Black, White, or Gray. Here's an image with more colors: all blues and grays. Now, I can adjust the color information here by choosing a different setting from the drop-down here in the Optimize file drop-down menu there, so there's GIF, Web Snap 256, Adaptive 256, and then I can change the number of colors here, and if I want to rebuild the palette, I click on the Rebuild button, and there are my original colors back. Likewise with this logo image, I can reduce the number of colors to two. Notice that there are only six colors there, so I definitely don't want to make this a 256 color image, but there is a section there for working with palette information, and then what I often find happens is my palette gets messed up as I experiment so I need to rebuild it, using the Rebuild button. For example, notice that it gave me the Web 216 palette there. Here's the Macintosh palette, but if I want to rebuild it to show the colors actually present in that image, just click on the Rebuild button. So there you have a quick summary review of some of the more important techniques for optimizing your images in Fireworks CS3. That'll conclude this section of the tutorial. In this section you've learned how to optimize images using the Export Wizard, how to optimize images in the workspace using the Two-up and Four-up views and the Optimize panel. You also learned how to use the optimized pre-sets as well as how to create your own custom presets. You've learned some specifics about optimizing GIFs, PNGs, TIFs, and BMPs, as well as JPGs, and then we had a nice summary review of optimizing in Fireworks. Let me now move on to the next section of this tutorial; another very important section, on Exporting Files out of Fireworks.
Tutorial Information
| Course: | Adobe Fireworks CS3 |
| Author: | James Gonzalez |
| SKU: | 33836 |
| ISBN: | 1-934743-42-9 |
| Release Date: | 2008-01-25 |
| Duration: | 8.5 hrs / 93 lessons |
| Work Files: |
Yes |
| Captions: | No |
| Compatibility: |
Vista/XP/2000, OS X, Linux QuickTime 7, Flash 8 |
VTC Sign up & Benefits
- Unlimited Access
- 81,350 Video Tutorials (14,200 free)
- Video Available as Flash or QuickTime
- Over 715 Courses
- $30 for One Month Access
- Multi-User Discounts Available
