Chapter 1. Flexible Text

Size text using keywords and percentages to allow user control and maximum flexibility.

Few Web design topics are as storied and controversial as sizing text for the Web. Historically, it's been known to confuse beginners, fuel arguments, and divide nations. Well, perhaps that's exaggerating things a bit, but it truly can be a sticky subject for many.

While I'm in no position to rid the world of its war on text sizing, in this chapter I share a single strategy for sizing text on the Web that is both flexible and easy to implementand at the same time allows you to maintain as much design control as possible.

The allowance for flexibility in sizing text is one of the keys that drive the rest of the examples in this bookthat by giving the user the ability to control the size of text on the page, we're increasing its readability for all the Web's citizens. The real challenge lies in enabling that flexibility, while still having the ingenuity to craft interesting design around it. And by the end of this book, you'll be well on your way to meeting that challenge, with a solid foundation of examples to guide you.

To understand how best to be flexible when sizing text, let's first look at a common example and why it's not flexible.