coding beacon

[programming & visualization]

The Dark Side of Visualization: Choosing the Best Programming Fonts

When one tries to compare fonts, sometimes visualization does not help. There are too many font features to spread one’s attention over. In other words, using some standard text for comparing fonts is counterproductive when you need some very specific features (such as in a programming environment). So visualization just makes font comparison more difficult.

A couple of days ago I spent some time struggling through code with a variable name that had “1” (digit “one”) instead of “l” (lowercase “ell”). Who could’ve thought Consolas could play such a trick on me? So I set out to choose a better font. Again. Among the first webpages with font comparisons I found this one, which is quite good: http://www.codeproject.com/Articles/30040/Font-Survey-of-the-Best-Monospaced-Programming. However, to choose the best font for a particular use case quickly and efficiently, a different presentation approach is required. Since each letter is a picture, comparing even several fonts is the same as comparing hundreds of tiny pictures. Yet, most, if not all, attempts to solve the issue of finding the best programming font, use graphics. The commonly suggested way is to look at the sequence “Illegal1 = O0” and see how unambiguous the symbols are. However, comparison gets more tricky when you start using both regular and bold faces of the same font to highlight syntax, and then you decide that some punctuation marks are too thin, or you need underlined formatting for some cases. And then the whole comparison process gets messy and you give up having settled on some font you felt was ‘kinda ok’, never being completely sure.

I came up with the following solution. Below is a table of mono-spaced font configurations. The set of fonts used has been compiled based on a range of web-sites with font ratings and suggestions. I chose font sizes such that letter sizes look approximately the same across all font configurations. The best way to use the table is to copy its contents into a spreadsheet and filter out all the inferior configurations, adding fields with other properties, if necessary.

# font font size vct / bmp lines fit small size bold bold vs regular width zero glyph ‘ell’ vs ‘one’ merg. u-line under- score
~ ~ {*} {+} {1} {2} {3} {4} {5} {6} {7}
0 Andale Mono 8 vct 50 yes diff dot clear no bebsl
1 Anonymous Pro 8(9) vct 54(46) yes same slash ambig no bebsl
2 Bitstream Vera Sans Mono 8 vct 46 yes same dot clear no bebsl
3 BP Mono 9 vct 43 yes same slash ambig no jabsl
4 CamingoCode 8 vct 40 yes same slash clear no bebsl
5 Consolas 8 vct 46 yes same slash ambig no bebsl
6 Crystal 9 vct 50 yes diff slash clear no bebsl
7 DejaVu Sans Mono 8 vct 46 yes diff dot clear no bebsl
8 Dina 6 bmp 46 yes same slash clear yes bebsl
9 Dina 8 bmp 46 yes same slash clear yes bebsl
10 Droid Sans Mono Slashed 8 vct 46 yes diff slash ambig no bebsl
11 Envy Code R 8 vct 42.5 yes same slash clear no bebsl
12 Fantasque Sans Mono 9 vct 50 yes diff slash clear no bebsl
13 Fira Mono 8 vct 35 yes same dot clear no bebsl
14 Frasto 9 bmp 50 yes diff slash clear yes bebsl
15 GohuFont-11 11 bmp 54.3 yes diff slash clear no bebsl
16 Inconsolata 9 vct 50 yes diff slash ambig no bebsl
17 Lava Mono 8 bmp 43 yes diff slash clear yes jabsl
18 Liberation Mono 8 vct 50 yes same dot ambig no bebsl
19 M+ 1m 8 vct 37.2 yes diff slash clear no bebsl
20 Monaco 8 vct 37 yes diff slash clear no bebsl
21 Monofur 10 vct 46 yes diff dot clear no jabsl
22 MonteCarlo 10 bmp 54.2 yes same slash clear yes bebsl
23 Nu Sans Mono Demo 8 vct 54 yes diff slash clear no bebsl
24 Onuava 8 vct 42.6 yes diff slash clear no bebsl
25 Panic Sans Mono n/a vct n/a n/a n/a dot n/a n/a n/a
26 Pragmata Pro 8 vct 50 yes same dot ambig no bebsl
27 ProFont 9 bmp 50 yes diff slash ambig yes bebsl
28 ProggyCleanTTSZ 11 vct 50 yes diff slash clear yes bebsl
29 PT Mono 8 vct 46 yes diff slash clear no bebsl
30 Share-TechMono 8 vct 46 yes diff slash clear no bebsl
31 Sheldon 9 bmp 46 yes diff slash clear var bebsl
32 Source Code Pro 8 vct 42.5 yes same dot clear no bebsl
33 Tamsyn5x9 5×9 bmp 66.5 yes same [Oh] ambig yes bebsl
34 Tamsyn6x12 8 bmp 50 yes same slash ambig no bebsl
35 Tamsyn7x13 8 bmp 46 yes same slash ambig no bebsl
36 Tamsyn7x14 8 bmp 43 yes same slash ambig yes bebsl
37 Terminus 9 bmp 50 no same slash clear yes bebsl
38 Ubuntu Mono 9 vct 40 yes diff dot clear no bebsl
39 ZenonFixed 11 bmp 43 yes same slash ambig yes jabsl
40 Meslo LG M 8 8 vct 40 yes same slash ambig no bebsl
{*} For bitmap fonts, this field might occasionally be irrelevant.
{+} Alternatives: “vct” — vector font; “bmp” — bitmap font.
{1} lines in window — height set to fit 50 lines of code in “Terminus 9” (6×12 pixel size) as a benchmark window size.
{2} Whether small size bold variant of a font exists.
{3} Whether the width of bold characters is different from characters printed in regular font.
{4} Alternatives: “slash” — for slashed, “dot” — for dotted, and “[Oh] dear…”
{5} Some might disagree as to the description of some fonts as ‘ambiguous.’ My argument is this: both parts — top and bottom — of lowercase letter “ell” and digit “one” must be different. If “ell” had a full serif line at the bottom (as the glyph for “one” had), I would consider such a font as confusing. Note: font “Terminus” is distributed with a patcher to fix this feature.
{6} Alternatives: “yes” — when underlining is used, the line merges with the letters above; “no” — there is at least one-pixel-sized margin b/n the line and letters; “var” (varies) — some syntax highlighting rules might glitch and occasionally merge and occasionally leave space b/n glyphs and underlining in the same editing window. (Note: font Sheldon had that glitch in my case).
{7} Alternatives: “bebsl” (below baseline) — for cases when the underscore glyph is placed just below the baseline (look up terminology in the links section below [1]) or way below baseline (less often), “jabsl” (just above baseline) — for fonts whose underscore glyph’s lowest edge is in line with the baseline.
Environment used for testing: Eclipse platform v.4.3.2. Kepler (IDE); StatET for R v.3.3.2 (code editor plugin for Eclipse).

If you decide to improve this table, please send me a link to your version in the comment section below. Feel free to leave your comments there as well.

Conclusions

Every time I switch a work environment, the issue of customization re-emerges. Having done this several times over the past two years, I find this method most efficient. Finding the best font configuration is actually getting the confidence that a better alternative does not exist. Table filtering provides that kind of confidence.

The Winners: In my particular case, “Dina” is the best for R and “CamingoCode” for C as “Dina” has some problems with underlining and I do need underlining for syntax highlighting in C. The honorable mention goes to the font “Terminus,” whose author was kind enough to allow for character variants via included font patches (see here: http://terminus-font.sourceforge.net/). Another font worthy of notice is “Tamsyn.” It is being currently actively developed and the author welcomes any comments and suggestions. The distinction of this raster font is a wide range of sizes, including a perfectly legible unique 5×9 set including bold face as well. It is available for Windows and Linux (see here: http://www.fial.com/~scott/tamsyn-font/).

Possible Improvements: If anyone decides to compile a comprehensive table, it would make sense to state font version along with the name.

Fonts Omitted

…due to ambiguous “ell” glyph: Adaptive Code, Akkurat Mono, AnonymousTT, Inconsolata, Inconsolata-dz, Leros, Liberation Mono, ModeNine, Nanum Gothic Coding, AnonymousPro, AnonymousProMinus, Cousine Regular, Oxygen Mono, TI92PlusPC, WhiteRabbit

…due to ambiguous zero: Asap, Audimat Mono, Eichante, Elronmonospace, Emerson Mono, F25 blank printer, Futurist Fixed-width, Larabie Font, Liberation Mono (alternative), Lekton04, Luxi Mono, Monospace Typewriter, MonoSpatial, Phaisarn Fixed, Phaisarn Mono, Newport Gothic, SV Basic Manual, Triskweline, TT KP, Century Schoolbook Monospace BT, NormaFixed Tryout, Oloron Tryout, Pseudo APL, saxMono, Secret Code, Selectric, SmallTypeWriting

…due to other reasons: a large number of other fonts did not get listed here for various reasons. Among those are very wide letter spacing and lack of aesthetic appeal. However, I may have missed something worthy of attention. So your comments are very welcome.

Selected Links

[1] https://en.wikipedia.org/wiki/Typeface#Font_metrics
[2] http://www.google.com/fonts
[3] http://www.donationcoder.com/forum/index.php?topic=2499.0
[4] http://www.slant.co/topics/67/~what-are-the-best-programming-fonts
[5] http://camstudio.org/…/programming-fonts-…for…-programmers/p1
[6] https://en.wikipedia.org/wiki/Samples_of_monospaced_typefaces
[7] http://www.1001freefonts.com/bitmap-pixel-fonts.php
[8] http://www.lowing.org/fonts/

Unexplored Links

[1] http://vim.wikia.com/wiki/The_perfect_programming_font
[2] http://www.stackprinter.com/export?service=stackoverflow&question=4689
[3] https://code.google.com/p/i3project/wiki/Fonts

Updates

Recently I had to start using GohuFont with R in RStudio due to misaligned folded code icon “<->” of RStudio and Dina’s bracket glyphs “{}”.
Dina vs GohuFont (in this order):

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: