home button

Back to the top

Johann Sparkling 96pt
Web Typography
html text

Or will you gain accessibility but lose your control?

The alternative is to use ‘live’ text, an approach which avoids all the problems inherent with GIF text work. It downloads faster, can fit dynamically into different window widths, prints cleanly, indexes well in search engines, and is far more accessible for those with disabilities. But what about how it looks: how well does HTML text formatting actually work in practise?

If you look at unformatted text in a Web page it will be shown in your Web browser’s default typeface: almost certainly good old Times New Roman. This may seem like a classic choice, but it really doesn’t work as body level text on computer displays.

Of course, you’re not stuck with this. After all, you can apply formatting instructions which tell the visitor's browser to show your words in a particular typeface. This allows any font to be used in place of Times. So why not pick your favourite font, or your client’s corporate font? (Right about now all the print designers will be rubbing their hands and Web-savvy readers will be grinning ironically.)

The reason this doesn’t work is simple: you may have all sorts of fonts to play with on your computer, but HTML formatting instructions simply ask the Web browser to use the specified font, if - and only if - it is available on the end user’s computer. If they don’t have it, the layout will default back to Times New Roman again and you’re back to square one - except that now the layout looks worse, because it wasn’t designed with that font in mind.

There is a surprisingly simple way you can try to avoid this problem. Instead of picking one font and crossing your fingers, you can set up a whole string of typeface names. If the first isn’t available the second might be, or the third, and so on. This shotgun approach can certainly help, but it doesn’t really solve the problem, and it means resigning yourself to layout compromises.

The oldest method for specifying fonts is the FONT tag. The biggest problem with FONT tags is their lack of serious control; they can affect the typeface, size, colour - and very little else. They're also very messy to use (at least from a code point of view) and dated. To gain anything approaching real control and finesse you have to move up to Cascading Style Sheets (CSS).