MathML inside!

Putting mathematics on the Web with MathML

This note explains how to include MathML in Web pages in a way that makes it possible to be viewed on a large number of browsers. It also shows how to configure browsers to make them able to display MathML. Currently the browsers that will render the pages using the conventions below are:

You can test your browser by viewing this simple Presentation MathML example, or this more complex Content MathML page (which may take some time to render).

It is intended for Web content authors who want to include mathematical formulas in Web pages, as well as people who want to read this content.

More technical details on the whys and hows can be found on the XSLT stylesheets for MathML

Including MathML in Web pages

In order to maximize the number of platforms it will be viewable on, a document should be written using the rules below. Note that if you use a W3C standards compliant editor such as amaya, all this is done automatically.

1. Create the page using XHTML with inlined MathML

The Web page should be written using XHTML with the MathML markup inlined, as in the following example:

<?xml version="1.0"?>
<html xmlns="http://www.w3.org/1999/xhtml">
  <head>...</head>
  <body>
    <h1>Example</h1>
    ....
    <math xmlns="http://www.w3.org/1998/Math/MathML">
      <mi>x</mi><mo>+</mo><mn>3</mn>
    </math>
  </body>
</html>

The MathML markup should not be in an <object> tag, or in a separate file linked to from an <embed> tag.

2. Add a stylesheet processing instruction

The following line (in bold characters) should be inserted at the beginning of the XHTML page, before the opening <html> tag but after the XML declaration <?xml...?> if it exists:

<?xml version="1.0"?>
<?xml-stylesheet type="text/xsl" href="http://www.w3.org/Math/XSL/mathml.xsl"?>
<html xmlns="http://www.w3.org/1999/xhtml">
...

This will work in most cases (but not on Internet Explorer: for security reasons IE will not execute an XSLT stylesheet that is not located on the same server as the XHTML+MathML document. In that case follow the 'off-line' instructions below. See also the bottom of this document for more information on IE security). However, there are alternatives:

And this should be it. Read on for more information

Specifying preferences

Since it can happen that a browser has more than one way to render MathML markup (for instance, IE with the techexplorer plug-in can also render equations using CSS rendering), a way to specify the preferred method is provided. This is achieved through the use of an attribute called renderer belonging to a special namespace. For example:

<?xml-stylesheet type="text/xsl" href="pmathml.xsl"?>

<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:pref="http://www.w3.org/2002/Math/preference"
      pref:renderer="css">
<head>...</head>
<body>...</body>
</html>

specifies that the CSS rendering method is preferred for rendering this page. Values for the renderer attributes are:

Microsoft Internet Explorer Security

By default, Internet Explorer does not allow XSLT stylesheets to be applied to a document if it is not located on the same server as the document. Therefore, using

<?xml-stylesheet type="text/xsl" href="http://www.w3.org/Math/XSL/mathml.xsl"?>

Will not work. Instead it is necessary to copy the stylesheets to the the same server as the document (as described above). Alternatively it is possible to change the security options in Internet Explorer, but we can not recommend this as it will affect all browsing, not just the use of this stylesheet.

MathML Conference Presentation

This stylesheet was presented at the 2nd International MathML Conference. The talk is a series of examples of the stylesheet designed to be viewed with the browser in "full screen" mode. During the presentation the bowsers IE6, Mozilla 1.0, Amaya 6.1, and Netscape 7.0PR1 were all used to display examples.

In addition to MathML, a small example extending this stylesheet to SVG is also demonstrated.


The W3C Math Working Group. Send comments, questions and fixes to www-math@w3.org

$Id: Overview.html,v 1.16 2002/06/30 14:04:28 davidc Exp $