Case Study: Screen Reader Accessibility

My Contributions

  • Direct project with backend development team and an accessibility consultant
  • Research into current HTML5 and WAI-ARIA standards
  • UI Design
  • UX Design for screen reader technology
  • Update OCW to HTML5 and WAI-ARIA standards


In February 2015, The National Association of the Deaf filed a lawsuit against MIT and Harvard University over their lack of closed captioning in content. MIT OCW leadership responded by committing to caption all video retroactively and moving forward, and to improve the experience for people with low-vision accessibility requirements.

The Problem

Someone visiting OCW using screen reader software would be given a sub-par experience: the screen reader would announce the site header, top navigation menu, and then, the footer menu, skipping the main content of a course, or its sub-section navigation. While there were ways to get to the content, they were not easy or user-friendly. Due to the nature of the site layout, changes to the visual design would be necessary, but it could not appear any different after the project ended.

The Solution

I worked with an accessibility consultant to look over each site section and identify areas where improvements would be necessary. I researched current HTML5 and WAI-ARIA specifications and identified how they could be consistently applied to the entire site.

After a planning period that looked at the site structure as a whole, I rewrote each of the 25+ templates to include HTML5 elements and ARIA specifications – primarily grouping navigation sections and calling out main content. It became apparent that our prior efforts at accessibility, while well intended, were extremely verbose when being read aloud. I worked with our accessibility consultant (who happens to be vision-impaired) to improve the UX by rewriting alt-text and labels, and hiding anything that did not contribute to the experience while using a screen reader.

Changing the menu and footer navigation required a complete rewrite of the menu HTML and CSS, something I accomplished without affecting the visual design.

With these changes in place, I worked with the accessibility consultant and the backend dev team to publish the new accessible site after performing thorough QA on the changes.


OCW content is now accessible to people with low vision needs, keeping with the promise that OCW is free and open to all.