A Font for Programming

18 August 2004

When coding in a scripting or programming language, every character counts. Typing a single character wrong can cause a program not to compile or run, or worse can go unnoticed but cause a slight malfunction creating a ticking time-bomb. Because of this, a large proportion of development time is spent in the routine and iterative debugging process that irons out the typos, miss-paired brackets and zero-I-think-I-meant-O moments that are commonplace for us all.

Unfortunately, for commercial projects time is money and time-scales are finite, and therefore every moment spent on fixing stupid typos is a moment the project won’t get back. This is particularly true for web projects where time-scales are condensed and therefore the problem is intensified. So what can we do to help reduce the number of typos made when coding? Should we all run off and learn Dvorak?

Here’s a better idea. Use a font in your development tool which is designed for coding. One which is highly readable at small sizes (more code on screen). One which differentiates between a lowercase L and the number 1, and an uppercase O and zero. One which super-sizes the brackets so pairings are easy to spot at a glance. One which helps you see the typos as they occur, and therefore reduce the required debugging time.

One such font, the one I use, is ProFont. It’s available for Windows, Mac and *nix, so you’ve got no excuse not to try it. Give it a go – you might be pleasantly surprised.

About Drew McLellan

Drew McLellan (@drewm) has been hacking on the web since around 1996 following an unfortunate incident with a margarine tub. Since then he’s spread himself between both front- and back-end development projects, and now is Director and Senior Web Developer at edgeofmyseat.com in Maidenhead, UK (GEO: 51.5217, -0.7177). Prior to this, Drew was a Web Developer for Yahoo!, and before that primarily worked as a technical lead within design and branding agencies for clients such as Nissan, Goodyear Dunlop, Siemens/Bosch, Cadburys, ICI Dulux and Virgin.net. Somewhere along the way, Drew managed to get himself embroiled with Dreamweaver and was made an early Macromedia Evangelist for that product. This lead to book deals, public appearances, fame, glory, and his eventual downfall.

Picking himself up again, Drew is now a strong advocate for best practises, and stood as Group Lead for The Web Standards Project 2006-08. He has had articles published by A List Apart, Adobe, and O’Reilly Media’s XML.com, mostly due to mistaken identity. Drew is a proponent of the lower-case semantic web, and is currently expending energies in the direction of the microformats movement, with particular interests in making parsers an off-the-shelf commodity and developing simple UI conventions. He writes here at all in the head and, with a little help from his friends, at 24 ways.

Comments

§ Hans: Hmm… I personally use Proggy and it’s many variants, but I’ve never heard of ProFont. ProFont looks like a polished version of Proggy… Off to download it now.
§ Hans: Excuse me for the double comment, but I’d like to add that Proggy is similar to Arial, while ProFont is similar to Verdana (high and skinny vs. low and wide).

ProFont wins. Awesome.
§ Drew McLellan: Yes, the height in ProFont is used to good effect too. The uppercase letters are considerably taller than the lowercase variants, making textInCamelCase really easy to read.
§ Chris: Did you read Fonts for Programmers (with superb comments) on typographi.ca?
§ Drew McLellan: I hadn’t seen that post, Chris, but it certainly offers a good list of options. Thanks.
§ Mary: I’d always just used Andale Mono because I prefered it over Courier, and couldn’t find anything else.

Much thanks on sharing, Drew. :)
§ Mike: Whoa, what a difference this makes in Dreamweaver! I’m so used to the default font, courier, that this may take a while to get used to. But, you’re dead on with regards code readablity improvement.
§ Martin: ..except that these fonts support only English characters. So I guess other nationalities are stuck with the Courier.
§ Marcus Tucker: I downloaded Proggy a while ago, but never got around to playing with it. Like Mike, I’ve just downloaded ProFont (tweaked) and configured DW to use it – a definite improvement! :)
§ Jason: I personally use Bitstream Vera Sans Mono for everything fixed-width, coding or not. It looks good with or without font-smoothing, and good character differentiation (O/0, l/1, )/})
§ gaston: http://keithdevens.com/wiki/ProgrammerFonts. Another list of programming fonts. Just in case.
§ Mark Boszko: Hm. Looks like the ProFont link is down. Anywhere else I can get that?
§ Drew McLellan: Try this site.
§ Mary: Re: comment #8, Martin:
ProggyClean does support non-english characters, I just checked it with charmap.I don’t know if any are missing, but I see quite a few there.
§ Sam Ryan: Looks exactly like 9pt Monaco to me.
§ Dominic Winsor: I prefer ProggyClean: It seems more open than ProFont, and works well with code highlighting in dw, homesite, textpad, visual studio etc. It may of course just be familiarity, I’ve been using ProggyClean for most of this year.
§ Seb Frost: I much prefer Sheldon Narrow to ProFont. Just my 1.1p :)
§ Fraser Redmond: Hmmm… I’ve been using ProggyClean for several months now too, and think I’ll stick with it.

However if I had higher resolution on my screen I might go for ProFont, but with my setup as it is now, it just doesn’t quite give me enough code on my screen.
§ Ed Ribachonek: The HVRASTER.FON from http://www.procon.com.au/Fonts.htm
looks like the best coding font around. I tried several others but nothing beats this for clarity and width flexibility.

All in the <head>