How do you choose a font for extremely limited space, i.e. will fit the most READABLE text in the smallest space?

I often have very limited space when creating reports and dashboards for users. I usually use Arial, or Arial Narrow, but UI isn't my area of expertise, so I want to know, how do you determine an optimal font for fitting the most readable text in the smallest space?

Here is an example: Keep in mind this is just an example, as there are many times that space is limited, such as when you need to squeeze a million columns into a report, etc.

Answer

It really depends on a lot of factors such as what is the frequency of certain characters that you expect and what fonts are available to you.

I did a rudimentary by creating a program that iterated through all of the available fonts I had installed on my Windows box at the time and printed a line containing each printable ascii character on to the screen in each of these font's. I repeated the test as well with different font sizes.

The results as I recall them were that Segoe UI and Tahoma were the best with respect to space utilization and readability for UI purposes at 10pt and 9pt sizes. In the short term we settled on Tahoma since Segoe UI isn't freely available for operating systems below Windows Vista. If you don't need to support Windows XP or older an Windows OS or other a non Windows OS then I would definitely go with Segoe UI otherwise I would go with Tahoma if it's available and if all else fails try Verdana. See this list for a lineup of available Windows fonts as well as information about the best of use of each.

Keep in mind as well that starting with Windows Vista I believe, Microsoft now recommends using a 9pt font instead of a 10pt font for UI elements since the Sego UI font displays much clearer than other fonts at low resolutions especially on flat panel displays.

Depending on what platform you are developing for, you may also want to look at modifying font metrics if possible. In .NET with WPF I recall there being quite a bit of ways to modify how the text is rendered to allow for condensing the space between characters and to make the individual characters more narrow. Using this type of technique you can stick with whatever font you like and just tweak it's rendering to get the results you need.

With regard to your specific example graph that you provided: for this particular graph I would recommend pivoting it so the text most likely to be read is horizontal for more natural reading. I would also place the number so that it is inside the each bar of the bar graph when it will fit with a color that stands out against whatever background color is there thus increasing the space for other things such as the labels. Laying out the bar graph as rows would make it easier to read and also to print on multiple pages if necessary. If a row layout is not possible then creating a separate key for each item in the graph would probably be reasonable and that way each bar could be place closer together as well to save space. The key would allow each bar to be labeled such as A, B, C... or 01, 02, 03... for example and the key (layed out in rows somewhere else) would give more detailed information about each.

Remember, a chart or diagram is mainly useful for getting quick visual information. If it becomes too much of a burden to the user/reader your probably best off simplifying it, consolidating some of the details of the chart, or just provide more raw data in a more tabular form.

Here is a simple listing showing Arial, Segoe UI, and Tahoma fonts at various sizes. Notice that the relative space taken up by each font is different at different point sizes.

Update: I've added another comparison below which shows a more complete listing of common characters including capital and lower case letters in each of the previously mentioned fonts with the addition of Verdana and MS Sans Serif (default UI font in Windows prior to Windows 2000). Unfortunately and in response to bobsoap's recommendation for using Verdana, it is pretty clear that Verdana is about the worst compared to the other fonts at 9pt although keep in mind that this may not hold true for other point sizes. Also size isn't necessarily always the most important detail, sometimes it's more important that a font is readable at small sizes than whether it is more compact relative to another font.