Rendering MathML In Browsers

Recently Dylan Just, one of our great engineering talents, was helping a client to get MathML rendering directly in browsers.  In general, the easiest way to do this is simply to configure EditLive! to convert the MathML equation to an image. This approach works well in all major browsers however it has the major disadvantage of being inaccessible to screen readers.

Getting MathML to render in browsers is unfortunately quite complex but there are a range of tools and articles to help you. Here’s a short list to help get you started:

FireFox

FireFox has MathML support built in, but you need to ensure that your document is being served in the right way. In particular, you need to use XHTML so make sure you have the outputXHTML attribute on the htmlFilter element set to true within your EditLive! configuration.

Internet Explorer

Internet Explorer doesn’t have support for MathML built in, but you can use the MathPlayer plugin from Design Science to enable support. Design Science also provide a range of articles to help you ensure that your pages are being served in the right way.

Also as Jacques Distler points out, Internet Explorer 7 has problems rendering MathML if you include a charset in the HTTP Content-Type header.

Safari

Currently MathML isn’t supported in Safari, however you can use CSS to render a useful subset of MathML, as described in this article on the Opera dev site.

Opera

Recent versions of Opera have built in support for MathML in XHTML documents. Following the Authoring MathML for Mozilla should also make the document work with Opera.

Other Resources

Opera provide a test page for MathML which is served in the right way and can be useful for testing that your browser is set up for MathML correctly.

Since many fonts don’t include characters to render mathematical symbols you may need to install the STIX fonts from Mozilla.