CSS2: Font Management
|
More than any other feature of the Cascading Style Sheet specification, font management is probably the most important. Throughout the evolution of HTML, font control has become increasingly sophisticated and feature rich. Over the next few weeks, we’ll examine the latest set of advancements in font management brought forth by the CSS2 standard.
Font Specification and Selection
In the dark ages of the Web, you got to pick the size and the style (bold or italic, but not both) of your font. There was no support for specific fonts, and authors gave up trying to use different fonts for different parts of their documents.
Over time, HTML and CSS provided control over font selection, allowing authors to indicate the font they wish to use and to provide greater control over its appearance. Now if you want 22 point Verdana Oblique, you can certainly ask for it. The problem is that you may not get it, and what you do get will be a disaster.
CSS2 has refined the font management process into two separate components: specification, where authors specify the font they wish to use in their document, and selection, where the browser tries to meet their needs. This is a big advancement over previous versions of HTML and CSS, where the specification process was fairly well defined, but the selection process often left a lot to be desired.
Since the specification process is so mature, there are only a few changes to it in CSS2. We’ll address those first, and then finish with a discussion of the formal font selection process that CSS2 promotes.
Font Stretching
The first addition to the font specification model in CSS2 is the font-stretch property. You may recall that CSS1 supported an option, letter-spacing, which allowed you to control the spacing between letters in a word. Judicious use of letter-spacing let you stretch and shrink words to fit. Unfortunately, adjusting the space between letters did not change the letters themselves. The resulting changes were rarely attractive.
The font-stretch property, on the other hand, specifies a version of a font whose letters are appropriately stretched or squeezed. Using this version would presumably produce a wider or narrower word that is more attractive and consistent with the surrounding text.
When you specify the font-stretch property, you use one of nine values to determine the resulting font. These values, from narrowest to widest, are ultra-condensed, extra-condensed, condensed, semi-condensed, normal, semi-expanded, expanded, extra-expanded, and ultra-expanded. In addition to these absolute values, you can use the relative values narrower and wider to specify a font that is one step narrower or wider than the current font.
As with all font specification properties, you can ask for whatever your heart desires, but the browser will decide what you get. As we’ll see in coming weeks, this is getting a lot better, but just because you ask for Lucida Sans semi-expanded doesn’t mean you are going to get it. Even so, the addition of the font-stretch property to CSS2 gives authors one more tool to help make their pages appear exactly as they intended.
Next week, we’ll look at font size adjustment, a major new feature that should make many pages more readable across more platforms.
 |