Access-IT California Getting Started Project Planning and Analysis Active Projects Existing Systems Resources And Tools



Design

Designing an accessibility-centric system is the critical step in the development lifecycle. When software is designed to be accessible, it will be usable by a larger segment of the population. Accounting for accessibility when designing a system will ensure a greater measure of success in releasing an IT system.

In addition to roles and responsibilities as defined in the system development life cycle (SDLC):

An analyst should:

  • Ensure the design submitted adheres to applicable accessibility standards. Web Content Accessibility Guidelines version 2.0, conformance level AA is required for California state organizations.

A developer should:

  • Apply software- and system- development best practices and standards to ensure the best experience to someone using assistive technologies. Common standards include Microsoft's Universal Windows Platform, Apple's Accessible Application Programming Interfaces, and Google's Developer's Guide to Accessibility.

 

Design | Build | Test | Implement

 

Analyst

Developer

What to do

How to do it

Apply appropriate software and system development standards and best practices to ensure the system is accessible and usable by everyone who needs to access and use it.

For example: The system will be implemented as an iOS application. Developers must adhere to Apple's UI Accessibility APIS while developing the system.

While WCAG 2.0 is a good base for development standards, there are many other resources, some of which may be applicable to a given system. Apply standards and guidelines appropriate for the technology being used

Ensure accessibility when using CAPTCHA to avoid input that has been generated by a computer or "bots".

  • Make CAPTCHA tests available in more than one modality e.g. as a visual test and an audio or textual test.

  • Ensure that all components within a CAPTCHA, such as buttons comply with all other accessibility requirements including keyboard accessibility and visible focus.

  • Ensure that the text alternative for CAPTCHA images identifies the type of task and what is required from the user to complete it.

  • Test with a range of people with different disabilities to ensure usability of the primary and alternative CAPTCHAs.

CAPTCHA Checklist for Developers

Strategically plan the use of colors and images on website to convey meaning or branding.

The objective is to demonstrate how a visual appearance may be enhanced via style sheets to provide visual feedback when an interactive element has focus or when a user hovers over it using a pointing device.

Use CSS to apply color focus

Content organization for optimum usability.

Provide a "skip to main content" element at the beginning of a web page for Assistive Technologies.

Example of Bootstrap "Skip to main content"

Use heading tags such as h1, h2, and h3 consistently to inform users and Assistive Technologies of importance of information

Examples of Heading use

Examples of Bootstrap Nested Headings

Provide text alternatives for all non-text content.

Provide short descriptions that serve the same purpose

Provide short descriptions with long description alternatives

When using tables, make sure to code them with accessibility-centric standards

Proper markup must be used to make a programmatic association between elements within the table. When the proper HTML markup is in place, users of screen readers can navigate through data tables one cell at a time, and they will hear the column and row headers spoken to them.

For example:

  • Make sure table captions are used effectively within the code
  • Identify row and column headers specifically
  • Associate the data cells with the appropriate headers
  • Use Proportional Sizing, Rather than Absolute Sizing

Creating Accessible Tables Guidelines

Ensure that all content can be accessed with the keyboard alone

Keyboard accessibility is one of the most important aspects of web accessibility. Users with visual, motor, or other physical impairments are dependent on a keyboard to navigate content on a site. It vital that a user can key through a site's contents as easily as a user who can click through. Therefore, be mindful of:

  • Navigation order - the progression by which the keyboard will move through the site's content.

  • Items that cannot receive keyboard focus - use the tabindex="0" to ensure an element can receive keyboard focus.

  • Inaccessible custom widgets - Complex menus, sliders, dialogs, tab panels, etc. must all be built to support keyboard accessibility.

  • Lengthy navigation - Tabbing through lengthy navigation may be particularly demanding for users with motor disabilities.

Keyboard Accessibility Best Practices Guide

Use WAI-ARIA states and properties to support platform accessibility APIs

Accessible Rich Internet Applications (WAI-ARIA) Guidelines

Frames leverage the content of at least two other separate web pages, which are combined in the same visual space.

Those using screen readers cannot quickly scan the contents of multiple pages; as a result, all the content is experienced in a linear fashion, one frame at a time. Frames are not inaccessible to modern screen readers, but they can be disorienting.

The use of frames is strongly discouraged - however if deemed necessary, developers should at minimum do the following:

  • Provide appropriate frame titles
  • Use correct document type
  • Provide "noframes" content

Using Frames in accessible website guidelines