How to make Meteor.js accessible to e.g. blind people?

Question

There is no body, no markup, on a Meteor.js site, how can I make the site accessible to the blind, deaf etc.?

This is very similar to an answer I did for Angular: http://stackoverflow.com/questions/18853183/what-are-the-accessibility-implications-of-using-a-framework-like-angularjs/18861097#18861097 — AlastairC, Feb 26 '14 at 23:08

score 6 · Accepted Answer · answered Feb 26 '14 at 15:38

W3C has an accessibility initiative specifically designed for rich web applications. The concept is too big to summarize here, but consists of some best practices as well as tags and properties that revolve around what is known as ARIA

Also, Mozilla Development Network has a dedicated section and an FAQ to get you going.

The example simply puts it like this, a progress bar example in direct markup

<div id="percent-loaded" role="progressbar" aria-valuenow="75" aria-valuemin="0" aria-valuemax="100" />

or better yet, via javascript, since the app is expected to be a rich one, not static html:

// Find the progress bar <div> in the DOM.
var progressBar = document.getElementById("percent-loaded");

// Set its ARIA roles and states, so that assistive technologies know what kind of widget it is.
progressBar.setAttribute("role", "progressbar");
progressBar.setAttribute("aria-valuemin", 0);
progressBar.setAttribute("aria-valuemax", 100);

// Create a function that can be called at any time to update the value of the progress bar.
function updateProgress(percentComplete) {
  progressBar.setAttribute("aria-valuenow", percentComplete);
}

Regarding Meteor, well since it is a rich web application development framework, you can go crazy all you want with all the aria attributes.

How to make Meteor.js accessible to e.g. blind people?

1 Answers1