Displaying math in web pages

For many years, displaying good-looking mathematical formulas in a web page would require little short of a small rendering pipeline which would include for instance the LaTeX typesetting system and a rasteriser such as Ghostscript or dvipng. Then came the MathML language, an application of XML for describing mathematical expressions. The Gecko layout engine brought built-in MathML support to  gecko-based web browsers (including Netscape 7-9, Mozilla and Firefox), for the first time in 2002. However MathML content does not look always good  by default (especially square roots); one needs to install the STIX fonts first, which for some reason are not part of the Firefox package yet.

As of March 2009  few other browsers offer proper native MathML support. Microsoft Internet Explorer (at least up to version 8) requires the MathPlayer plugin to be able to display MathML. The Opera browser supports a restricted part of (presentational) MathML3 through CSS formatting since release 9.5 in 2008. The WebKit engine that powers Apple Safari does not have native MathML support, but some people have managed to display MathML in Safari and even on the iphone using the appropriate XSLT filter and css stylesheet (MathML profile for css). You may check the level of MathML support in your browser by visiting this page or this one.

Another problem is that MathML, like other XML-based languages, is not very human-readable; and typing a complex equation directly in MathML is not an enjoyable experience. Thus anyhow one must still rely on LaTeX and its clear, standardised syntax for entering equations in blogs or copying them straight from scientific paper LaTeX sources. There are several LaTeX to MathML translators out there, particularly itex2mml and TeX4ht, which can be used on the server side. The alternative road is to do the transcription job on the client side, using JavaScript. ASCIIMathML is a clever JavaScript code which makes tour browser automatically detect LaTeX-like expressions in the current web page and translate them into MathML. The nice thing with it is that one does not have to care about DOCTYPEs and Namespaces in the XHTML declaration; it can even be used with plain HTML documents. The main disadvantage is that it adds about 100kB of code to your webpage content (which will hopefully be cached the next time you access similar pages).

The AstrOmatic website uses a modified version of ASCIIMathML that offers fallback to generating PNG images for browsers that do not support MathML. Here is below the expression of polar shapelet basis vectors which should display nicely on all recent browsers:

$\psi_{n,m}(r,\theta) = \frac{(-1)^{\frac{n-|m|}{2}}}{\sigma}\sqrt{\frac{\frac{n-|m|}{2}!}{\pi\frac{n+|m|}{2}!}}L_{\frac{n-|m|}{2}}^{(|m|)}\left(\frac{r^2}{\sigma^2}\right)\times\left(\frac{r}{\sigma}\right)^{|m|}e^{-\frac{1}{2}\left(\frac{r}{\sigma}\right)^2 – im\theta}$