Unicode Font Comparison: Arial Unicode MS vs DejaVu Sans

Perm url with updates: http://xahlee.org/js/unicode_font_comparison.html

Unicode Font Comparison: Arial Unicode MS vs DejaVu Sans

Xah Lee, 2011-05-19

This page is a comparison of 2 unicode fonts: Arial Unicode MS vs DejaVu Sans.

Arial Unicode is from Microsoft and is bundled with Microsoft Office. It is also bundled with Mac OS X (since 10.5).

DejaVu Sans is a open source font and is bundled in many Linuxes (e.g. Ubuntu, OpenSUSE, Mandriva).

Both support wide number of characters in Unicode. (For info about them, see: Best Fonts for Unicode.)

My website uses unicode extensively. (See: Xah's Unicode Tutorial.) Almost all latest versions of major browsers today will show all most unicode chars, except Firefox 4, released recently, took a step backward in this department. (See: Web Browsers Unicode Support; Firefox 4 Sucks.) Firefox is a very popular browser, with close to 50% market share.

So, this means, you are forced to use CSS to specify a unicode font. Not a good solution, because there's not a unicode font that's common to all Windows, Mac, Linux, by default. But also, specifying a font is not a good solution because you may not wish your text to change appearance (you only wish the unicode chars don't get displayed as blank squares). Also, linux users and Windows/Mac users will get slightly different experience of your site's UI due to which font they have installed.

(font size spec is font specific, adding the pain. e.g. 16 point of font A is very different size than 16 point of font B. If you use absolute css unit such as cm (center meter), that's also a problem because due to display density (so-called DPI) variation and the fact that this DPI info is NOT guaranteed to be available to browsers. Specifying sizes by absolute values such as cm, is itself not desirable because display sizes varies from cinema-sized screens to palm-sized smart phones. In a similar way, size by pixel also isn't a ideal solution. So, that means, you'll have a hard time to control widths if your site design is based on fixed-layout. (See: Web Design: Fixed-Layout vs Flowed-Layout.))

Among the font choices, it comes down to Arial Unicode and DejaVu. So, this page shows common text displayed in them, for comparison of how they look, feel, when reading long texts.

CSS to Specify Font

Here's how to use CSS to specify font, if you don't know already.

body {font-family:"DejaVu Sans","Arial Unicode MS",sans-serif}

The above code means, if the user has “DejaVu Sans” installed, the browser will use that, else use “Arial Unicode MS”, otherwise use default sans-serif font.

The following are the texts using the 2 fonts. (you'll need to have both of these fonts installed, otherwise what you see may not be the font.)

Arial Unicode MS

We have n things, represented by numbers 1 to n. Some of these are identical. We want to partition the range of numbers 1 to n so that identical ones are grouped together.

To begin comparison, we generate a list of pairings that's all possible parings of numbers 1 to n. (of course order does not matter, and the pairing does not contain repetitions) This is the first argument to reduce.

Now suppose we know that 2 and 4 are identical, then we want to reduce the pairings so that we don't have to do extra comparison. For example, if the pairing list contains (2,3) and (4,3), one of them can be deleted because now 2 and 4 have been determined identical.

(We do this because we expect the comparison will be expensive.)

reduce( $pairings, $a_pair) returns a reduced $pairings knowing that $a_pair are identical.

The first argument $pairings must be in the form of a hash like this:

{'1,5' => [1,5],'3,5' => [3,5],'2,4' => [2,4],'4,5' => [4,5],'1,3' => [1,3],'2,5' => [2,5],'1,2' => [1,2],'3,4' => [3,4],'2,3' => [2,3],'1,4' => [1,4]}

(Note that keys are strings of the pairs separated by a comma.)

$a_pair is a reference to a list of the form [$a,$b].

The return value is a reference to a hash.

DejaVu Sans

We have n things, represented by numbers 1 to n. Some of these are identical. We want to partition the range of numbers 1 to n so that identical ones are grouped together.

To begin comparison, we generate a list of pairings that's all possible parings of numbers 1 to n. (of course order does not matter, and the pairing does not contain repetitions) This is the first argument to reduce.

Now suppose we know that 2 and 4 are identical, then we want to reduce the pairings so that we don't have to do extra comparison. For example, if the pairing list contains (2,3) and (4,3), one of them can be deleted because now 2 and 4 have been determined identical.

(We do this because we expect the comparison will be expensive.)

reduce( $pairings, $a_pair) returns a reduced $pairings knowing that $a_pair are identical.

The first argument $pairings must be in the form of a hash like this:

{'1,5' => [1,5],'3,5' => [3,5],'2,4' => [2,4],'4,5' => [4,5],'1,3' => [1,3],'2,5' => [2,5],'1,2' => [1,2],'3,4' => [3,4],'2,3' => [2,3],'1,4' => [1,4]}

(Note that keys are strings of the pairs separated by a comma.)

$a_pair is a reference to a list of the form [$a,$b].

The return value is a reference to a hash.

Popular posts from this blog

11 Years of Writing About Emacs

does md5 creates more randomness?

Google Code shutting down, future of ErgoEmacs