Experimenting with fractions for the web

I just got back from a week in San Jose at the AIM workshop on web accessibility of mathematics. It was an intense week for me and there's a ton to write about.

This morning I came back to something I had drafted after Joanmarie Diggs proposed a session on a particular hack (but the group didn't end up focusing on this in the unconference-style workshop setting).

That's not a fraction. That's a fraction!

One of my go-to examples when explaining that Presentation MathML is devoid of semantics is the <mfrac> element. While it clearly hints at being a fraction, the spec itself clearly states that it is not, semantically, a fraction but that it may be used for completely different things that visually look like fractions, e.g., binomial coefficients or the Legendre symbol; in fact, you can find many even less fraction-like examples (such as logical deductions) in the wild because a vertical stack with a properly aligned line is simply a neat layout feature.

Since Presentation MathML never specifies semantics, let's look how Content MathML encodes fractions. The spec would have you write something like <cn type="rational">22<sep/>7</cn>. It's a terribly good example for how Content MathML is a bit too strong in its abstraction for human communication (also, check the transcription to Presentation MathML). As an aside, if you need more examples of why <mfrac> is not meaningful, just search that section.

Hacking tips for accessibility experiments

Anyway, at the workshop Joanie had proposed the following. It turns out, Firefox is too lazy ahem too performance-oriented to sanitize invalid ARIA roles. This allows you to experiment with made-up properties fairly easily (assuming you can modify your screenreader of choice).

So for example, you could slap an aria-math attribute to your markup and this would show up in OS-level accessibility inspectors such as aViewer or accerciser. What Joanie had in mind (I believe) is that we could have tried to expose additional information this way so that Joanie could hack something into ORCA and then get Mick and Reef to modify NVDA or David to modify ChromeVox (and maybe even hear what Glen thinks of it from a JAWS perspective). And yes, all these incredible people were actually there in person.

To fractinity, and beyond!

Since an idea that I had proposed to the group (exploring web components for mathematical documents) also didn't stick, I thought I'd combine the two when I get the chance. Luckily, I had a long flight home.

Et voilà, a custom element fraction that adds aria-math roles to itself magically (using fraction, numerator, denominator andfraction-line).

See the Pen AIM Workshop custom element: fraction by Peter Krautzberger (@pkra) on CodePen.

It's not much and not really a "document"-level element as I was thinking about (then again, Joanie had hoped for improving an <mfrac> directly) but it's a nice (non-functional) concept, and perhaps helpful when thinking about ARIA role-description.