We recommend setting text size using a relative size scheme (such as percentages or em values) instead of fixed type sizes. For example, don't specify that a headline should appear in 14-point type. Say that it should be 140 percent of the size of the body text. Then if users enlarge the text, the headline will still look bigger than the rest of the text. A liquid design allows text to be scaled relative to the viewer's browser settings and screen resolution while still letting designers dictate the structure of the page.
In poorly conceived attempts to control how a Web page looks, many designers use absolute units of measurements to set the size of text. Absolute text properties make it almost impossible for users to change text size. This is a big problem for viewers, especially users with impaired vision.
Trying to control what users see by using the "one size fits all" approach usually backfires. People resent sites that appear prescriptive, preventing them from making the necessary adjustments to use the site comfortably. It's like owning a car and not being able to adjust the seats. It's their screenlet them control what they see.
Even if there is a way to disable cascading style sheets (CSS), the average user doesn't know about this or how to do it. To make matters worse, Microsoft has removed the resize button from the Internet Explorer, version 6 toolbar. Technically, people can put it back, but the option is so hidden that most users wouldn't even know it's there.
Designing for Vision-Impaired Users
If your site caters to senior citizens and people with low vision, provide an obvious way for them to adjust the text size. Don't count on people using the preference settings in their browser; most people are afraid to mess with browser settings. Have a visible resize button within your pages so that people can easily adjust the text size.
We don't recommend having a resize text button on all mainstream Web sites, as it increases development and interface complexity with insufficient payoff. In most cases, it is sufficient to use a carefully chosen typeface that displays well but is also scalable by end-users.
The Social Security site caters to a mature audience and appropriately uses large font sizes and allows readers to adjust the text size.
(Facing page, top) Unfortunately, changing the text size on the Social Security site isn't straightforward. Instead of providing onscreen controls, the site requires that users change text size from the browser menu, which is too complex for many elderly people to understand.
(Facing page, bottom) Old design: This site provides text-resizing options, but the icons are so small and obscure that many people in our study didn't notice them. It's better to offer a more comfortable default font size than to require people to make adjustments. The preferred icons for text resizing contain the letter "A" in different sizes (for example, a smaller A for making text smaller and a bigger A for making text larger).
New design: The default font size on the redesigned Nestlé site is an improvement over the previous version. The larger size text is much easier to read.
(Facing page, top) This Web site caters to a broad audience by using relative fonts. Even though the text size is appropriately set for general users, the site offers an additional text resizing option for those who need larger text. Note the use of progressively larger A's as the resize controls. This notation works well for most users.
(Facing page, bottom) This site uses typefaces that are appropriate for its main target audience. The legible text works not only for senior citizens but also for users of all ages. The site even has contrast and speech options for people with special needs.