Adaptable Accessibility Features for Mathematics on the Web
Davide Cervone, Volker Sorge · 2019 · Proceedings of the 16th International Web for All Conference (W4A) · doi:10.1145/3315002.3317567
Summary
This paper presents the accessibility features in MathJax version 3, the widely-used JavaScript library for rendering mathematics on the web. The fundamental challenge is that standard mathematical markup formats (LaTeX, ASCIIMath, presentation MathML) lack the semantic information needed for adequate accessibility support — they describe visual layout rather than mathematical meaning. MathJax addresses this through a semantic enrichment process powered by the Speech Rule Engine (SRE), which rewrites flat mathematical expressions into semantic tree structures that capture the relationships between operators, operands, and mathematical constructs. These semantic trees are embedded as HTML5 data attributes in the rendered DOM elements, preserving the visual presentation while adding an orthogonal semantic layer. This approach works across all of MathJax's rendering outputs (HTML/CSS, SVG, custom HTML5 elements) and ensures consistent accessibility behavior regardless of the visual renderer used. The system provides multiple assistive technology modalities: speech output using ARIA labels and live regions that work with any modern screen reader; Nemeth Braille output using Unicode Braille symbols pushed to refreshable Braille displays via a dedicated live region; visual aids including high-contrast colorization, progressive sub-expression highlighting, structural abstraction (collapsing complex expressions into expandable summaries), formula coloring using semantically-aware contrasting colors, and magnification with lens-style zoom restricted to specific sub-expressions.
Key findings
MathJax v3 introduces several significant advances in math accessibility personalization. The "pick and mix" approach allows users to flexibly combine assistive features — for example, simultaneous speech and Braille output, or magnification combined with highlighting and exploration, each in different contrasting colors. Two alternative speech rule sets are supported: MathSpeak, which uses explicit disambiguating language ("StartFraction... Over... EndFraction"), and ClearSpeak, which provides more natural phrasing ("the fraction with numerator... and denominator..."). Users can switch between these during interaction, gaining multiple perspectives on the same expression. A key innovation is domain-specific semantic interpretation for fields like Physics, Chemistry, and Logic. For example, the bra-ket notation expression in quantum mechanics would be incorrectly read by default MathSpeak as "left angle bracket phi StartAbsoluteValue upper A EndAbsoluteValue psi right angle bracket" but with physics heuristics enabled produces "the linear operator A acting on bra phi and on ket psi." These domain-specific heuristics can be triggered automatically when MathJax detects semantically meaningful LaTeX packages (like physics or braket) or manually selected by the user. Interactive exploration lets users walk the semantic tree structure using cursor keys, with synchronized speech, highlighting, and magnification updating for each sub-expression — and the navigation follows mathematical structure rather than linear left-to-right order.
Relevance
MathJax is one of the most impactful accessibility tools on the web, used by thousands of websites, publishers, and learning platforms to render mathematics. The accessibility features described here directly affect how millions of users — including screen reader users, Braille readers, people with dyslexia, and low-vision users — experience mathematical content online. For accessibility practitioners, this paper demonstrates several important principles. First, semantic enrichment is essential for meaningful accessibility — visual markup alone cannot produce good speech or Braille output. Second, personalization matters deeply: different users need different combinations of speech rules, visual aids, and interaction modes depending on their disability, expertise level, and subject area. Third, the approach of embedding accessibility information as HTML5 data attributes alongside visual rendering shows how to add robust accessibility support without altering the visual experience. The domain-specific speech generation is particularly significant for STEM accessibility, as mathematical notation is heavily context-dependent and reading the same symbols differently in physics versus pure mathematics is not a minor detail but essential for comprehension. The structural abstraction feature also addresses a real problem: complex mathematical expressions can be overwhelming to parse, whether visually or aurally, and progressive disclosure of structure reduces cognitive load for all users.
Tags: mathematics accessibility · MathJax · STEM accessibility · screen reader · Braille · speech output · dyslexia · low vision · personalization · web accessibility · MathML · semantic enrichment
Standards referenced: WAI-ARIA · HTML5 · MathML