Now that I’ve got the color palette more or less figured out, it’s time to move on to another important part of web design: The fonts. Once again I knew nothing about fonts and stuff and once again I turned to the internet experts for help. This time I even read an article on the subject and among the things I learned was that it’s not called “fonts and stuff”, it’s called “web typography”. Fascinating.

The article I read was written by Jason Santa Maria, a graphic designer whose web site I’ve visited before. It used to have a rather wide color palette, now he is down to three main colors. That makes me think, like I’ve mentioned, that I’m moving in the wrong direction in terms of colors; from simplistic to complicated. But hey, only dead fish go with the flow, right? Besides, this entry is about web typography, not colors. See, I’m already using my new found knowledge to sound like I know what the hell I’m talking about. I’m not, though.

Jason Santa Maria mentions two very interesting things in his article. The first is the most excellent @font-face CSS property. While web designers used to be limited to the fonts available on the end users computer, they can now play around with whatever fonts they want to use without resorting to tricks like images, flash and the likes. Of course, this feature is only available in moderns browsers, but there are always fall back options for the users who for some reason stick to the oldies, like Internet Explorer 6. For some reason, many of you still do. If you stop it, you’ll make a lot of web designers very, very happy.

The second thing he mentions is that it’s rarely any good reasons to use more than two different typefaces, and only one might be enough if it has enough versions to choose from. Another point related to this was a quote by Zuzana Licko:

We read best what we read most.

This is something to keep in mind when choosing typefaces; no reason to go nuts even if @font-face makes that possible.

I know I want to use a readable font for the bulk of the text, but something a bit more classy for the headlines. Previously, I’ve used Georgia a lot for headlines because it looks great and it’s easy on the eyes. It’s also part of Microsoft’s core fonts for the Web package, meaning that it’s preinstalled on all Macintosh and Windows based computers. For the main part of the text, I’ve mostly resorted to Arial, Verdana or Times New Roman, all fonts that are part of the same package.

All these typefaces are thus accessible, well-known and familiar to the end user. All good things. But Jason Santa Maria writes something else that I find very interesting: Some typefaces are made to be paired, for instance in a serif and a sans-serif version. Using a serif and a sans-serif pairing quickly creates a balance. Or, typefaces from the same designer tend to work well together and create the same balance. He also mentions a few examples, but they all cost a small fortune and they probably all have different and complicated licensing terms I need to understand.

I had originally planned to chose my two fonts now, but I’ve realized that it will take a little more time than I thought. I’m not too surprised. Since I will have to go for a free font, finding two that work well together and have enough glyphs (that’s web typography speak for “characters”) to cover my needs, will require some effort. Right now I don’t have time for that, so the hunt for suitable fonts has to continue another day.