What fonts are good and which ones should we avoid for our application's UI?

Question

What do you advise when it comes to selecting fonts for your User Interface?

Answer 1

Read this article on font legibility. At least look at this graph of on-screen reading times (shorter line = faster/better):

The differences aren't that large, but it's worth noting that Times (a serif font) came in second place.

For medium-large text consider ClearType (or whatever Apple's alternative for it is). For very small text (~<= size 10.5, in my experience), this can look blurry (contrary to its intention) -- see the WPF explanation on this. I'd generally agree with KahWee Teng's answer -- stick with the platform default for non-web apps unless there's a compelling reason not to.

Answer 2

In general for small type it is better (easier on the eyes) to use a sans-serif font. For larger type, more freedom of expression is "allowed" for different type faces because it is easier to read larger letters.

Answer 3

For smaller screens such as mobile device, it's better to use sans-serif fonts. Ultimately you should look at the platform UI guides to make your application feels native (unless you're creating a game).

Answer 4

From my point of view, and if applicable (domain and system), you should use the currently configured font. If the user chose some font for his system, who are you to tell him otherwise?
Of course his advice is void if you're doing a creative application, or on a system where the is no standard configuration.

Answer 5

For large bodies of text, sans-serif fonts (eg. Tahoma, Arial) tend to work well on screen, while serif fonts (eg. Times New Roman) work well in print.

Presuming you don't destroy user's your eyes with something curly and pink, the size of your font (14px+ on a big screen), line-spacing and good background contrast can have a bigger effect on legibility than font face, in my opinion.

Answer 6

There are a lot of factors here. What is the application? A website? A mobile app? Clean is the way to go. For small devices, apple uses Helvetica. While it's not my favorite font, it is clean and easy to read.

Answer 7

That article is a bit out of date (2005).

A more current article: http://www.vanseodesign.com/web-design/legible-readable-typography/

And linked from the article (which is not all that readable, honestly):

http://www.sitepoint.com/typography-readability-and-legibility-part-1/
http://www.sitepoint.com/typography-readability-legibility-part-2/

Answer 8

I wanted to add that no font is a magic bullet. While a bad font and lose the game, a great legible, readable font wont win it for you either.

Once you have a font you like and that fits with your voice, you need to make sure you still pay attention to how you use that font. A few things to ensure you consider are:

• Line Height - The amount of line height you use will vary depending on your body of text and your line length
• Line Length - You'll want to keep this under control. Too long and readers will get lost, too short and reading feels choppy and broken.
• Font Size - This is obvious, but you can also use it in as a way to help line lengths.
• Contrast - If you want it readable, you need enough contrast. Too
  much contrast and it starts to buzz and hurt. An example of what not to do is have a pure
  white page, with pure black text on top.
• Rhythm - Take care of the vertical spacing between blocks of text. Here's A

These princples and a ton more are covered by a great resource at http://webtypography.net/ in a resource called "The Elements of Typographic Style Applied to the Web".

It has a ton of great information, principles and techniques for ensuring your use of type is legible, readable, and enjoyable.