If you took a close look at this page, you’ll find that it allows you your default text size, and that you can open the page as wide or shrink the page as thin as you might want.
This is accessibility. You can view this page on a tiny cellphone screen, a smallish old CRT monitor, or the newest 50″ 1080p plasma TV.
(Admittedly, I should give the page a maximum width, but that’s another matter.)
Most pages today, especially if they’re well designed, are fit to a permanent 960-pixel grid. The more over-designed of those also set your text-size for you, in case it was only by accident that you’ve made the text appear larger on your monitor.
When you visit those sites on a screen smaller than 960 pixels wide—plus browser window, plus scrollbar, which makes the total width more like 984px—our good friend Horizontal Scrollbar comes out. Except that he’s not a good friend, and we all hate him.
With newer browsers, you can at least zoom out to shrink the 960px width to a more-manageable 600px. If they’ve set the text to 12px, though, you just can’t zoom out without having the entire page’s text turn into an ill-defined mass of faded grey squiggles.
There are lessons to be learned in all of this: While a great number of people use a screen greater than 960px in width, a fair number have screens of much smaller size. This includes cellphones, iPhones, iPod Touches, very old computers, browsers with side-panels, and extremely large monitors divided into sections.
While many can’t fit 960 pixels on their screens, every one of them can fit 100 percents. Therefore, try to make fluid 100% grids instead of fixed-width 960px grids, and always, always let your users set their font size.
Tags: Accessibility, design