It’s been a long while since I wrote a tech post. That is primarily because with a new job came a whole new host of skills. Over the last 78 months I’ve learned MathML and SASS and am currently learning Python, RDFa markup and LaTex. My InDesign and ePub skills have also recently come in to play flooding my brain with all kinds of information.
Needless to say I wasn’t quite sure what to write about! But I’ve finally settled on MathML. MathML is a markup language that allows you as a web developer to show gorgeous, fully functional math equations to your consumers. MathML itself is only supported by certain browsers (check out how your favorite browser stacks up here) but when paired with a program like MathJax, MathML becomes much more accessible. MathJax works by rendering your MathML as an .svg image, which nearly every browser supports.
First let’s start with some solid MathML resources:
 General MathML information
 Mozilla Developer Network – MathML (great place to learn about mathvariants)
 W3C MathML validator
 W3C MathML Specs
 MathJax
For those interested MathML in EPUB:
 MathJax EPUB readers Page
 IDPF on MATHML
 Food for thought: eventually using the EPUB switch element to provide MATHML and image fallbacks
Visual Appearance:
<math xmlns="http://www.w3.org/1998/Math/MathML"> <mi>π<! π ></mi> <mo><! ⁢ ></mo> <msup> <mi>r</mi> <mn>2</mn> </msup> </math>
And will render something like: πr^{2} — Rendered in HTML to ensure your ability to view it.
Tips:
 MathML equations open with a tag and a connection to the MathML standard being used.
 Each tag has a different meaning, let’s look at the basics (for a more complete list, view this MathML Element Reference):
 <math> – Toplevel MathML tag, you can’t have one tag inside another
 <mtext> – For arbitrary text or words in a math equation
 <mo> – Math operator, This can be wrapped around operators such as multiplication bullets or even just parentheses.
 <mi> – Math identifier, this should be wrapped around variables, function names and symbolic constants. Note: a single character in an <mi> will appear italic, multiple characters will not.
 <mn> – Math number, is wrapped around either a literal string of digits or a word that connotes a numeric meaning such as “twentyfive”
 Elements such as <msup> which make a MathML element superscripted must be wrapped around the superscripted character and the character receiving the superscript. For instance in the code above:
<msup> <mi>r</mi> <mn>2</mn> </msup>
The <msup> is around both the r and the 2 resulting in r^{2}
 Font styles and weights should be applied using variants:

<mi mathvariant="bold"></mi>
<mtext mathvariant="italic"></mtext>
<mn mathvariant="sansserif"></mn>
<mo mathvariant="bolditalic"></mo>
 If interested you can find more variants on the individual element pages in the MDN Element Reference
 And for those looking to add this to epub, for validation purposes you’ll need to declare the MathML in the conten.opf on every .html page it occurs on. For a detailed version of this see this site.

<item href="sample.xhtml" properties="mathml" />
 If you’re also planning to use MathJax to include .svg images as fallbacks, you’ll need to properly declare the svg images as well.
Well that’s it for today! What else would you all like to know about MathML?