#2 Add Support for Web Fonts


Over the past year or so many browsers, including Firefox, Opera, Chrome and Safari have got support for web fonts using the @font-face CSS property. This allows for a new font face to be defined, e.g;
font-family: "jsMath-cmex10";
src: url("fonts/jsMath-cmex10.ttf") format("truetype");

There are two major formats, TrueType and WOFF (Web open font format). WOFF is newer and currently only supported by FF 3.6 -- however Microsoft have expressed interest in the format and it is likely to become a web standard. Converting a TrueType/OpenType font => WOFF is a trivial procedure (it is just a compressed version) and the $ sfnt2woff utility can be used to perform this. It is possible to include both in a single @font-face definition (.ttf and .woff that is).

It would be nice if jsMath shipped with both the required fonts (jsMath-cm???10 and friends) and the CSS styles. Other than this very little extra logic should be required -- if the browser supports web fonts or the user already has the jsMath fonts installed the effect is the same.

See: http://en.wikipedia.org/wiki/Web_typography and http://webfonts.info/wiki/index.php?title=%40font-face_browser_support for more information.


  • Davide P. Cervone

    • status: open --> closed
  • Davide P. Cervone

    Yes, I have been following the @font-face developments, and it would be nice include it in jsmath, but it is not as trivial as you indicate. For most browsers, the web fonts load asynchronously, and the browser uses a default font and then fills in the font later when it is available. That will not work with jsMath, which must measure the dimensions of the mathematics carefully in order to line things up properly. If the font is not available when it does that, and the characters change later, the positions will be off. So jsMath would need to be modified to wait for the font to arrive before going on with its typesetting. That can certainly be done, but it is not a minor change, and there are a number of issues to consider (including timeout for when the font fails to show up from the server, and so on). The internal structure of jsMath is not conducive to this.

    You might want to check out the [url=http://www.mathjax.org]MathJax project[/url], which is in some ways the "next generation" of jsMath. It does use web-based fonts, when possible. It also can use MathML as input and can produce MathML as output, in addition to TeX input and HTML-CSS output.



Get latest updates about Open Source Projects, Conferences and News.

Sign up for the SourceForge newsletter:

No, thanks