To illustrate a common method for text sizing, let's take a look at eyeglasses.comsurely its sight-impaired visitors would benefit from a Web site that values readability and user control (Figure 1.1). Figure 1.1. To demonstrate a common method for text sizing, we'll use the Web site eyeglasses.com (shown here as it appeared in December 2004).Eyeglasses.com makes good use of CSS for all of its design details and, like scores of other nicely designed sites on the Web, it uses the font-size property on the <body> element to declare a base size for the entire page in pixel units: note
body { font-size: 11px; } By setting a size (11px in this case) for text on the <body> element, the designers ensure that the entire page (unless overridden by a subsequent rule) will display text at 11 pixels. The upside to using pixel units is that they stand the best chance of looking the same in size, regardless of what browser or device is reading the text. It's because of this consistent, predictable size that using pixel units has become a rather popular choice for designers. Those who desire pixel-perfect precision over the size at which type appears on a Web page choose pixel units over all other options. There is, however, one little problem. WHY IT'S NOT BULLETPROOFSizing text with pixels gives the designer control over the size of type, yet poses a problem for users of the most popular Web browser out there (at the time of this writing): Internet Explorer for Windows (IE/Win). Browsers typically provide the user with a means to control the size of text on the page, overriding the size that is specified by the designer. This is great, and extremely useful for someone who is visually impaired. To increase readability, a user with poor vision can choose a larger font size via a browser menu (Figure 1.2). Figure 1.2. The Text Size menu in IE6/Win allows the user to adjust the size of text on the page in either direction.Sounds perfect, doesn't it? But there's a catch. Internet Explorer users on Windows won't be able to override the size of text specified by the designer when pixel units are used. So while using pixel units gives the designer the greatest precision in determining font size, it also eliminates the possibility for IE/Win users to adjust that size if they so desire. Ouch. Users of other browsers can safely adjust font size no matter how the fonts are specified. The ability to adjust text size is essential for people with poor vision, and those users who want to increase readability on Web pages that feature small text by default appreciate the option. As designers, it's our nature to want complete control over the appearance of an entire Web page. But in giving up just a smidgeon of that control related to text sizing, we're improving the experience and accessibility for everyone. note
As for IE/Win's reluctance to resize text set with pixel units, perhaps the developers stuck to the idea that a pixel is a pixelan infallible unit that should never change, even if users wish to supersede (which they should have every right to do). Regardless, all other browsers got it right, allowing text sized with pixel units to be overridden by user-defined controls. Life would be simple if designers could choose to declare a font size in pixels, and users could adjust however they wished, but because of the inability to scale that text in IE/Win, that's not optimal. So let's explore alternate methods for sizing text. Eventually, we'll settle on a strategy where we give up that exact precision that using pixel units offers but gain the important advantage of scalability in all browsers. |