CSS3 font-face property test for mathematical usage

I was looking for Latin-Greek-Cyrillic (LGC) serif typeface for a chemistry course which takes place on olunet. There are a lot of free fonts. Only few of them are easily readable from screen, simply elegant, and contain reqired UTF  characters.

Firstly, a css3 @font-face property test was made on fonts.olunet.org in order to compare different typeface candidates. Namely, DejaVu, FreeFont, Libertine, Liberation ans STIX were compared to Times New Roman.

Pangram screenshot made on Windows in Firefox 3.5

DejaVu looks wide on Windows. Thus, it was narrowed. STIX and FreeFont seem to be very nice, but both are hardly readable from screen. Liberation and DejaVu are bit prim. Libertine is good – it looks lightweight, readable, and elegant. The slope in italic variant is pleasant. I do like some characters of Libertine very much, for example “k”, “p” and “z”. However, Libertine is really heavy font weighting approximately 1 Mb.

Name Vesrion or date Font format Reg. var.
DejaVuSerif 2.29 ttf 321 kb
FreeSerif 09.01.04 otf 1.86 Mb
Liberation Regular 1.05 ttf 149 kb
Libertine Regular 4.4.1 otf 1.04 Mb
STIXGeneral beta ttf* 325 kb

* I was not able to get otf format files for STIX font work properly, thus ttf version was used.

Second test was aimed to compare different fonts for mathematical equations. Mathematical Browser Test was taken as a basis. I must warn, that the approach presented is not ideal. STIX font installed gives better result, than when it is downloaded via css3 font-face property. On the whole, this test demonstrates how this property may be used successfully.

NB! This post is a draft, which would be rewritten sometime later.

Tags: , ,

What is olunet about?

Firstly, olunet is an abbreviation for olympic network. Actually, in Estonian olympiad = olümpiaad, that is why oly is replaced by olu, as well as for simplicity. However olunet is not a network (yet), but just an idea.

Shortly, in keywords, olunet is about chemistry competitions and e-education. We are trying to use pure web-technologies to deal with chemistry on the web. You may see our first attempts on www.olunet.org. On whole, it is possible via hypertext (HTML), mathematical language (MathML) and scalable vector graphics (SVG) to create, manipulate, change, and save, etc. chemical formulas.  So the purpose is to develop  aforementioned approach available and easy for everyone fond on chemistry.

The most interesting example is workbooks – it shows a way (rough at present time) of how you may make a workbook of problems you like. Page tests contains chemical test with formulas and graphics displayed in a native way (for browser).

Tags:

MathML test pages

Beautiful examples

eyeasme.com/Joe/MathML/MathML_browser_test.html

www.mozilla.org/projects/mathml/demo/texvsmml.xhtml

Tags: