Web Typography, Fonts, CSS, oh my

Web typography aka CSS font-family relies on installed Fonts which are handled by the operating system. Boo. Even more distressing is the multi-platform diversity of fonts out there. To be more precise, it's not diversity that is the problem, but the lack of diversity.

For example, a recent linux/unix font family survey indicates a plethora of uncommon-to-Windows-and-Mac fonts which really provides insight into the very different visual brands which an enduser will experience. Things just look different, and for typographical reasons. This is Steve Jobs and the Mac story writ large.

View (3:00-5:00)

The Use and Abuse of Font-Family

The main goal of font-family is compatibility and graceful degradation of typography on websites, based on the fact not everyone has the zillion fonts stored in your computer, there being no equivalent automatic font download feature in browsers (fonts are handled by operating systems rather than browsers), and the best alternative options are either Flash-based and slow (sIFR) or a bit of work for the lazy developer (Cufon).

Linux, Windows, Mac installed fonts Survey

The combined font survey results for Windows, Mac and Linux is a great resource to view what sort of general support can be assumed for a given set of fonts.

Sans Serif Font support in Linux, Windows, Mac

See the post on the most common san serif fonts.

Verdana is the default with 59.87% of Unix, 95.36% of Mac and 99.25% of Windows machines in support. However, this font has been in my opinion highly overdone. Useful in situations like document support, for the web it is a bit, shall we say, bleh.

I say we go back to the roots and take another look at Arial, for example vs. Helvetica. Arial is supported by 98.9% of Windows, 96.45% of Macs and 65.83% of Unix boxes. That makes Arial both more interested and with greater support.

Note also that DejaVu Sans is pretty awesome but has little support on the main platforms.

Serif Font support in Linux, Windows, Mac

See the post on the most common serif fonts.

Georgia is a nice choice with 57.99% of Unix, 93.17% of Mac and 98.05% of Windows machines supporting it. There are quite a few others that could be of interest when doing branding work.

Fantasy Font support in Linux, Windows, MAC

See the post on the most common fantasy fonts, which really only has one item that is supported on a majority of all platforms, namely the Impact font. 57.99% of Unix, 89.89% of MAC and 98.35% of Windows boxes support this font.

Sadly the excellent Linux Libertine C is only on 12.5% of Unix and 0% of MAC and Windows systems.

There are quite a few interesting fantasy fonts on the list and it is worth perusing on a regular basis when considering typography for branding and communication.

Cursive Font support in Linux, Windows, Mac

See the post on the most common fantasy fonts shows rather wide divergence, except for the atrocious Comic Sans MS, which really only reminds one of the Peanuts Gang.

For my money an interesting cursive font is Monotype Corsiva. This font is supported on 21.38% of MACs and 82.36% of Windows machines. Apparently there is 0% support on Linux.

How to use Font-Family CSS

In this case the Wikipedia Article on Font-Family is not much help, apparently scribbed from the equally obtuse W3Schools. Learning by example, 24 Ways gives a nice, tidy, brief example and interesting suggestions on how to approach the font-family task.

Related posts:

1. 3 Fonts with good Thai and Roman character support One challenge for using Thai script on a computer is...
2. Social Media for Lead Generation How to Use Social Media for Lead GenerationView more documents...
3. Incubator 2.0: A Silicon Valley Success Story Incubator 2.0: A Silicon Valley Success StoryView more presentations from...

One challenge for using Thai script on a computer is that Thai characters are more vertical than roman alphabet characters. If one is mixing roman and Thai characters in a document, the Thai characters tend to be much smaller (and therefore illegible if the roman characters are optimized for space and legibility).

At this point I have found two fonts with excellent mixed-character set support. Another has reasonable support in a stylized font.

Linux Libertine

Linux Libertine, which continues to amaze as a one of the most successful open source truetype font projects has excellent Thai character support. Libertine is a Serif font.

Free Thailand Government Fonts

The Thailand Department of Intellectual Property website has a collection of free fonts to download. There are several which are quite interesting.

• For a Sans Serif font (with full roman character support), the Fah kwang font pdf sample is an excellent option.
• For a stylized font (without roman character support), Charmonman pdf sample is an excellent option. is a nice option.

Additional Thai Script (Font) resources

• University of Hawaii Thai Fonts
• Luc Devroye at McGill University has an amazing Thai Fonts resource page

Related posts:

1. CSS Font-Family and Installed Fonts in Linux, Windows and Mac Web Typography, Fonts, CSS, oh my Web typography aka CSS...
2. Social Media for Lead Generation How to Use Social Media for Lead GenerationView more documents...
3. Incubator 2.0: A Silicon Valley Success Story Incubator 2.0: A Silicon Valley Success StoryView more presentations from...