HTML & CSS: The Good Parts

Bitmapped Copy and Fahrner Image Replacement

Chapter 12 discusses the wilderness of letterforms at a minute level of detail. Two hazards of this wilderness are relevant to any discussion of background images: the narrow range of universally available typefaces for use on the Web, and the benefits gained by heavily anti-aliasing instances of large type.

Inline and background images guarantee designers’ access to attractive web typography, a state of affairs that has held true since web browsers began supporting inline images in 1993. In the first half of 2002, several CSS experts (myself included) independently worked out techniques that made it possible to move bitmapped type out of markup and into stylesheets. The application of the simplest of these techniques is summarized in Figure 9-5. Collectively these techniques are called Fahrner Image Replacement (FIR), in honor of Todd Fahrner, an early pioneer of applied CSS who was among the first to work out and publicize the underlying ideas.

Figure 9-5. The three steps from a plain heading to a FIR-enhanced heading, (1) shows the plain heading, (2) shows the heading with its new background image, and (3) shows the final result after a text-indent value has been applied

The basic point to FIR is that an image shouldn’t exist in the content layer of a site unless it’s actually content. How, then, does one retain the benefits of images, ...