Whatever works for you ...

Home page

Web text
Don’t irritate
Your grid

Web typography hardly exists yet. But the basics still work.

F YOU NEED information about typography on the Web, no doubt you want it clearly set out. You don’t have be tempted with gadgets and contraptions. But if you couldn’t care less about typography on the Web, a stripper and a brass band won’t keep you reading.

Keep it simple
Think of your home page as a magazine cover. Put a list of contents on it, and a picture if you like.

Big pictures are a beginner’s mistake. A face the size of half a thumbnail is often large enough.

Headlines in very large type are another beginner’s mistake. You don’t see many of those in good mail-order catalogues. That’s where typographic variations come closest to scientific testing.

HE WEB DOESN'T give you much command over your own pages. People can read them in whatever typeface and size they like. The last line of a paragraph may only have two or three characters in it. Not much can be done about that. And be careful about specifying type. Helvetica and Times exist in many renderings. What your readers see may not look much like the version you have in mind.

Pointers help. (This one is 6670 bytes, much bigger than you need.)

The Web gives you crude control of type size. And your control of baseline shift is even more primitive. You can’t even kern. You can help the eye along, however, with intials and subheadings. In moderation, arrows and pointing fingers have their place. Bullets have of late been overused. Think twice before you add more.

Unfortunately, the Web wasn’t made for typography. The few tools we’ve got at the moment are awkward. Just look at initials.

Handle with care
On average, 13% people more read advertisements with drop-intials. They’re useful. A word or two in capitals help bridge the gap between large initials and the main text.

But remember that the letters A and L can be more trouble than they’re worth. They have a built-in white space, which can cause a misunderstanding. Here’s an example.


GAIN! WE LOST AGAIN, even more than last time. The new method has been a disaster. We’re ruined! 


  GAIN! WE GAINED even more than last time. The new method has been a roaring success. We’re rich!

In the example on the left, the shape of the letter A creates a gap that looks like a wordspace. The word "Again" may well be misunderstood. On the right, the two words "A gain" probably won't.

There are ways to fill in the gap of the letter A. One is to frame it with ornament or a dark background. Another is to slant the letter. This example does both.

GAIN! WE LOST AGAIN, even more than last time. The new method has been a disaster. We’re ruined!


  GAIN! WE GAINED even more than last time. The new method has been a roaring success. We’re rich!


The best way, at the moment, is avoid altogether using the letters A and L for drop-cap initials.

You can use decoration to fill the gap in the letter L.

This works, and has worked for centuries.

A backward leap
Typography has come a long way. For five hundred years, men used adjustable moulds to cast metal letters, one piece at a time. They inked up small bits of metal and, when circumstances were right, created masterpieces of printing.

HESE CLASSICS were founded on traditions of manuscripts and inscriptions that go back to the origins of European civilization. The wordspace was abandoned for a while and taken up again. Lower case letters were added. Traditions of arranging text were thought up and polished. On the Internet, you'll have to manage without most of them.

At the moment, you can't do much with the Web. But you can rely on techniques that have been tried and tested. The basics still work. You're safe with the parts of them that work on recent browsers and download quickly.

This too will pass
All this will change. With fast connections, you can have pictures, animation, and applets riding piggyback on one another. Much of what I’ve said here will then be out of date, if it isn’t already.

The purpose of typography is to help the reader. Meanwhile, we’ll have to do what we can with the little we’ve got.

These notes were a contribution to Computers and Typography II, edited by Rosemary Sassoon and published by Intellect Books in 2002. They had already been published in Portugese translation in the Brazilian journal Designe, volume 2, in 2000. A Danish summary was published in web.design.sådan! in 2001.