Accessible Equations

\[ \int_0^R \frac{2x\,dx}{1+x^2} = \log(1+R^2).\]

There is an old joke that there are \(10^2\) types of people. Those who understand binary and those who don't.

If we look at equations, we might say that there are \(100^2\) types of publishers:

\(01^2\)
Those who know how to write accessible equations.
\(10^2\)
Those who know how to write equations, but don't know how to make them accessible.
\(11^2\)
Those who don't know how to write equations, but know how to make them accessible.
\(100^2\)
Those who don't know how to write equations and have no interest in making them accessible.

If you are in the last category, this article probably isn't for you. Everyone else, read on!

Disciplines such as physics, engineering, chemistry, geology, biology, social sciences, and economics all use mathematical symbols to quickly and accurately convey complex ideas.

Apart from their meaning, there is also a real beauty to these symbols. For example:

  • Greek letters: \(\mu\),  \(\pi\) and  \(\Sigma\)
  • Relation operators: \(\cong\),  \(\preceq\) and  \(\notin\)
  • Binary operators: \(\pm\),  \(\div\) and  \(\star\)
  • Logic notation: \(\Leftarrow\),  \(\Leftrightarrow\) and  \(\implies\)
  • Geometry: \(\triangle\),  \(\sim\) and  \(\measuredangle\)
  • Other symbols: \(\infty\),  \(\Updownarrow\) and  \(\cos\)

Naturally, publishers want to create expressions and equations that are scientific and yet retain an element of artistry. But problems arise when artistry is maintained at the expense of meaning.

MathML and Screen Readers

  • Reading equations properly is a skill. It is difficult to hold a complete equation in your mind, without working through it.
  • Screen readers read one line at a time, making it difficult to access information presented in two dimensions, such as subexpressions and subscripts.
  • To overcome these difficulties Mathematical Markup Language, or MathML, was designed to give semantic structure to equations when presented on the web and in some popular desktop programs, such as MS Word.
  • For example, the equation \( A=\left[\begin{array}{cc} x & y \\ z & w \end{array}\right]\) would appear as follows:
    <mrow>
  <mi>A</mi>
  <mo>=</mo>
  <mfenced open="[" close="]">
    <mtable>
      <mtr>
         <mtd><mi>x</mi></mtd>
         <mtd><mi>y</mi></mtd>
      </mtr>
      <mtr>
         <mtd><mi>z</mi></mtd>
         <mtd><mi>w</mi></mtd>
      </mtr>
    </mtable>
  </mfenced>
</mrow>
  • Popular screen reading programs, such as JAWS, have an inbuilt math viewer that will recognize math content and allow users to inspect it.
  • JAWS keystrokes:
    • In Word, pressing Insert + Spacebar + = will invoke the maths content feature.
    • The Esc key closes the math viewer in Word.
    • On the web, users need to just hit Enter when they encounter 'Math Content'.
    • Right and left arrows moves focus from one expression to another.
    • The Down arrow allows users to move into a sub-element of an expression, like an enumerator or square root.
    • The Up arrow moves focus back up to the equation as a whole.
  • The JAWS math viewer allows users to navigate through equations and hear them just as a teacher would say them.
  • The JAWS math viewer also has a visual indicator , so that teachers can follow which part of the equation students are inspecting.

Math Content and Braille

Student using a braille display
A refreshable braille display allows a user to move in and out of subexpressions and subscripts
  • Braille displays can seem like mysterious objects that output random information that only an expert user can understand.
  • In actual fact, braille displays are ingenious devices that allow information to be displayed in a variety of ways including foreign languages and musical notation.
  • Nemeth Braille is a type of braille notation that is designed specifically for math and science notation. It allows users to go through each component of the equation.
  • Using the JAWS braille math editor, users can insert equations in Word.

MathML and MathJax

  • MathJax is a Javascript library that enables MathML content to be rendered on web pages.
  • MathJax works with popular browsers such as Chrome, Safari, Firefox and Internet Explorer.
  • MathJax is popular with academics because instead of having to learn a whole new presentation language, they can simply insert a LaTeX equation and have MathJax convert it to MathML.

MathJax and Canvas

  • If you have made it this far and you produce education content in Canvas, then I have some good news for you.
  • MathJax is built into Canvas. All you need to do is insert LaTeX code and Canvas will do the rest.

To insert a LaTex equation:

  1. Navigate to the Canvas page where you want to insert math.
  2. Click on Edit.
  3. Place the cursor where you want to insert the equation.
  4. Click on Insert and then Equation.
  5. Insert the LaTeX code.
    • Tip: If you want the math to be on its own line, put \[ and \] on either side. For example, \[ \sum_{n=1}^\infty {1\over n^2} = {\pi^2\over 6} \]
    • Tip: If you want the math to be inline, put \( and \) on either side. For example, \( \sum_{n=1}^\infty {1\over n^2} = {\pi^2\over 6} \)
  6. Save.
  7. That's it. You should now see the LaTeX rendered visually as \[ \sum_{n=1}^\infty {1\over n^2} = {\pi^2\over 6} \]
  8. And screen reader users will be able to access a MathML version.

MathJax and Web Pages

  • The MathJax Javascript library can be added to regular web pages by inserting the following code:
    <script type="text/x-mathjax-config"> MathJax.Hub.Config({ tex2jax: {inlineMath: [['$','$'], ['\\(','\\)']]} }); </script> <script type="text/javascript" async src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.7/latest.js?config=TeX-MML-AM_CHTML"> </script>

Additional Information