Accessibility/WebDev Recommendations

This is a set of recommendations for our web dev team implementing front-end sites and features to make sure they're most accessible to as many users as possible.

The WebAIM WCAG 2.0 check list is being used as reference point here. It is the best available technical check list, but we're reprioritizing it a bit to better suit Mozilla's needs. The following sections describe the priorities for each of the main sections described in the above linked to check list.

Helpful tools

• Excellent 20 minute tutorial from Deque on how to test with the free screen reader NVDA on Windows.
• http://wave.webaim.org/

Contrast

All web developers should become familiar with the concepts here (don't worry, it isn't verbose): http://contrastrebellion.com/

Note to reader

When referring to levels of conformance: A, AA, AAA. AAA includes AA which includes A.

Perceivable

Everything that is listed under 1.1, 1.3 and 1.4, and is marked "Level A" should be taken into account when developing Mozilla web pages.

Level A conformance should also be strived for if media is being created that is there to stay for a several month to years period. Not every promotional video that we create for smaller-sized instances needs to conform to the check list items listed under 1.2. But for longer-term media, we should strive to at least provide summaries of what the media (video, audio etc.) are presenting. Again, level AAA is a nice to have, level A should be strived for.

Operable

Guidelines 2.1, 2.2, and 2.3 should be met, in the case of 2.1 including the 2.1.3 guideline which is marked level AAA.

For guideline 2.4, in addition to the level A conformance criteria, I suggest to strive for the AAA item 2.4.10, too. I've seen this on several of our pages anyway, and most of our content makes sense to provide section headings for anyway.

Understandable

Guideline 3.1: Strive for A conformance. Esp 3.1.1 and 3.1.2 help screen readers a lot when reading our web pages. We already do that in many instances.

Guideline 3.2: It is best to strive for level AAA, where no changes are made dynamically (like changing a combobox item and immediately loading a new page when the new option item gains focus).

Guideline 3.3, strive for 3.3.1 and 3.3.2.

Robust

These guidelines should be met. That means: Always make the site identify itself as HTML5, because that's most likely what we'll produce in the future. Also, semantics are usually required to accomplish tasks, and if something rich has to be built, use WAI-ARIA in addition to HTML5.