As you may or may not know I'm a bit of a typography geek. I recently picked up and watched the documentary Helvetica, which talks about the history and use of the type face. But related to that I've been having a variety of conversations lately about type. One of these brought up the question:

What is the difference between Helvetica and Arial?

In trying to answer that question I ran across an awesome blog called ilovetypography which is a huge collection of stuff about fonts and typography. And in particular a post about Helvetica vs Arial. But even better... the creator of the page had created a little web application that allowed you to overlay Arial on Helvetica and compare the differences. Behold the Fontometer! [local copy]

So the next logical question from there is... How do other fonts compare with Helvetica (or Arial, or any other fonts)? Unfortunately the Fontometer makes use of pre-rendered images. But I'm a software engineer so I can do something about this. With a little bit of jQuery-ui and some other bits I found around the web... I've now got my own version of the Fontometer, but it allows for comparison of arbitrary fonts (though still not controllable by the user).

Fontometer 2

There are still some more things I plan to do with this. I think it would be awesome to hook it up to services like Google Web Fonts or Adobe TypeKit to allow it to dynamically load and compare between a larger set of fonts... though TypeKit costs money so I'm hesitant to go down that road.

Fontometer 2.5

I got inspired (and discovered that integration with Google Web Fonts wasn't terribly complicated) and went ahead and integrated the tools with Google Web Fonts as a proof of concept. It's only selecting fonts that contain " Sans" from the service and explicitly adds Helvetica and Arial for comparison purposes... since that was kind of the point of the tool in the first place. To make it really nice I'd need to build some sort of font selection UI.