Downloadable page: Lesson on Equations

The Standards

WCAG 2.0 Guidelines:

Guideline 1.3.1 "Info and Relationships: Information, structure, and relationships conveyed through presentation can be programmatically determined or are available in text. (Level A)" (W3C)

What do the Standards Mean?

The markup language HTML is what determines text formatting on the web. Unfortunately, html does not work for mathematical equations. For this reason, many equations on the web are simply images of text saved in formats such as JPEG, PNG, GIF, etc. Equations displayed as image files are not accessible to people who rely on screen readers because screen readers are designed to only read text formatted by markup language.

There are two primary methods to make equations on the web accessible to all users:

Add alt text if the equations are saved as image files. The alt text should spell out the names of each of the symbols in the equation. For example, for the equation 2(4y+1) = 3y the alt tag would state, “2 open paren 4 y plus 1 close paren equals 3 y.”
Instead of using image files, it is recommended that you use a software or an online tool that allows you to produce equations in accessible formats using mathematical markup language (e.g MathML).

To learn how to add alt text and long descriptions to images, review the lesson on images.

What is MathML?

MathML is a mathematical markup language. Merriam-Webster defines a markup language as, “a system (such as HTML or SGML) for marking or tagging a document that indicates its logical structure (as paragraphs) and gives instructions for its layout on the page especially for electronic transmission and display.” The markup language, MathML, is the accessible, W3C-approved way for displaying equations. Most web browsers support it either directly or with a plugin.

Example of Markup Language MathML
MathML Code	Text Display
<math xmlns="http://www.w3.org/1998/Math/MathML"><mn>2</mn><mo>(</mo><mn>4</mn><mi>y</mi><mo>+</mo><mn>1</mn><mo>)</mo><mo> </mo><mo>=</mo><mo> </mo><mn>3</mn><mi>y</mi></math>	2(4y+1)=3y

While adding descriptive alt text to equations that are displayed as images, the prefered method for making equations accessible is to use a software or a tool that will produce an equation using markup language such as MathML. If you are interested in learning about the technical aspects of MathML, review this W3C page on MathML Fundamentals.

How do you use MathML?

The easiest way to produce MathML is to use an equation tool that supports it. An example is the MathType integration for Microsoft Word. When this product is installed, the user can click a button in the toolbar in Microsoft Word to insert an accessible equation into a document.

Review this W3C wiki for a list of MathML supported tools for more information on this topic.

Resources

Information on this page is from the following resources about equations:

WebAIM. Retrieved December 30, 2015.

WebAIM is a non-profit organization associated with the Center for Persons with Disabilities at Utah State University. It is one of the leading resources for information on accessibility.

W3C MathML Fundamentals. Retrieved December 30, 2015.

This website, w3.org, is the website for The World Wide Web Consortium (W3C), which is a community of individuals who develop web standards. The guides on this website include extensive recommendations, examples, related resources and other helpful tools.

United States Access Board. Retrieved January 13, 2016, from

This page contains the Section 508 standards as of January, 2016. This does not contain the refreshed standards proposed in February 2015.

Quick Reference Guide to Section 508 Requirements and Standards. Section 508.gov. Retrieved January 23, 2016.

This page contains the Section 508 standards as of January, 2016. This does not contain the refreshed standards proposed in February 2015.

Penn State Math and STEM Content. Retrieved January 23, 2016.

Penn State has several thorough resources about making science and mathematics accessible. Check it out for more detailed information.

NCAM Guidelines for Describing STEM Images. Retrieved January 23, 2016.

This website has a list of guidelines about writing text descriptions for images common in science, mathematics and technology resources.

DO-IT What is MathML? Retrieved January 23, 2016.

This article from Disabilities, Opportunities, Interworking and Technology (DO-IT) is an in-depth article about the mathematical markup language MathML.

Estimated time: 7 minutes