Home / Developer Center / Fireworks Developer Center /

Great-Looking Text: All You Ever Wanted to Know About Anti-Aliasing

Macromedia

Before I get into the details of creating great looking text graphics with the improved text anti-aliasing capabilities in Macromedia Fireworks MX 2004, I wanted to first define anti-aliasing. A quick search on dictionary.com brings up the following:

• an•ti: Opposed to; against.
• a•li•as•ing: The appearance of jagged distortions in curves and diagonal lines in computer graphics because the resolution is limited or diminished.

Requirements

Macromedia Fireworks

• Try
• Buy

Anti-Aliasing Capabilities

Figure 1. Font: Arial; Size: 30; Alias: None

In short, anti-aliasing, when done properly, will make your text graphics more readable by substituting shades of the font color around the lines and curves which would otherwise appear to be broken or craggy from pixel to pixel.

Figure 2. Font: Arial; Size: 30; Alias: Strong

While anti-aliasing capabilities have existed in Fireworks for quite some time, Fireworks MX 2004 has built upon its existing four anti-alising options (None, Crisp, Strong, and Smooth) with the addition of "System" (Quartz on Macintosh) and "Custom" anti-aliasing features.

The addition of these new anti-aliasing capabilities in Fireworks MX 2004 gives you a complete toolbox of "sandpaper" to quickly and efficiently smooth the edges of any text you are working on.

Let's look at what each anti-aaliasing option does:

1. No Anti-Alias disables text smoothing.
2. Crisp Anti-Alias creates a sharp transition between the edges of the text and the background.
3. Strong Anti-Alias creates a very abrupt transition between the edges of the text and the background, preserving the shapes of the text characters and enhancing detailed areas of the characters.
4. Smooth Anti-Alias creates a soft transition between the edges of the text and the background.
5. System Anti-Alias uses the text smoothing method provided by Windows XP or Mac OS X.

6. Custom Anti-Alias provides the following expert-level controls over anti-aliasing:

   • Oversampling determines the amount of detail used for creating the transition between the text edges and the background.
   • Sharpness determines the smoothness of the transition between the text edges and the background.
   • Strength determines how much the text edges blend into the background.

You can apply text anti-aliasing options through the Property inspector or the Text Editor when you have selected any text object.

Figure 3. The anti-alias options in the Property inspector

Figure 4. The anti-alias options in the Text Editor

Anti-Aliasing Options

The following guidelines will help you maximize using Fireworks MX 2004's anti-aliasing options:

Anti-aliasing is most useful with larger font sizes.

Never anti-alias a bitmapped font.

Never export anti-aliased text as a GIF with the Web 216 palette because the colors that will be used to properly anti-alias your text do not exist in the Web 216 palette.

Figure 11. Font: Arial; Size: 30; Alias: None; Palette: Exact

Figure 12. Font: Arial; Size: 30; Alias: Strong; Palette: Web 216

Text that is anti-aliased, exported as a transparent GIF, and placed in a web page with a background color will actually appear to be more aliased than text that is aliased and exported as a transparent GIF and placed in a web page with a background color.

Always try one of the Fireworks MX 2004 pre-set anti-aliasing options (None, Crisp, Strong, Smooth, System) first to achieve your desired appearance. If you are not able to achieve your desired result, then try using the Custom Anti-Alias option.