Websites and Applications / Minnesota IT Services

Web & Apps

Design websites and applications so they're accessible to everyone.

Overview
Requirements/Design
Development/Testing
Mobile
Resources

Overview
- Structural formatting like headings, tables, and lists that allow users to navigate the website or application.
- Descriptive text that explains pictures, charts, and graphs to users.
- Layout, design and color that makes the application and content accessible to use and understand.
The principal concepts of website or application accessibility will help you meet the State of Minnesota Accessibility standard. The instructions outlined in the Resource section relate specifically to websites and applications.

Did you know?

Accessibility standards not only help you meet a wider audience, but they also make your solutions:
- More searchable
- More interoperable with mobile devices
- More usable with voice recognition
Requirements/Design

An accessible website starts with gathering requirements and creating an accessible design. Building accessibility features into your website from the beginning saves time, effort and money. You must also have a general understanding of the users and how they will interact with your website or application. The following links provide tools that can help:
- Accessibility requirements tracking tool: (Excel document)
  This downloadable spreadsheet can be used in all phases of the SDLC process - from Requirements Elicitation to Programming to Quality Assurance testing.
- W3Cs Web Accessibility Initiative (WAI) http://www.w3.org/WAI/
  This website provides almost everything you need to know about developing and testing accessibility for websites and applications.
- UM's Web Accessibility Training http://accessibility.umn.edu/ The University of Minnesota developed this quick HTML-based introduction to the primary elements of building accessible sites and content.
- WebAIM, a non-profit web accessibility organization, provides excellent resources for web designers, including a cool infographic.
- DigitalGov's Usability Starter Kit provides tools and resources for the application/interface designer.
Development/Testing

Incorporate accessibility into all your System Development Life Cycle (SDLC) processes: requirements analysis, design, implement, test and deploy.

Building accessibility into web and application development
Understanding the Web Content Accessibility Guidelines (WCAG 2.0), why and when the guidelines are important, and how to apply them is addressed in the WCAG 2.0 Top Ten Check Points webinar. This webinar provides an introduction to WCAG 2.0 for web application developers and business analysts. (Audio Transcript PDF)
Validators and Testing Tools

Testing for accessibility along the way can help to identify problems early in the process. While there are many aspects to accessibility testing and validation, there are also many tools available.

The worldwide web consortium (W3C) has posted an open call to tools and resources for evaluating web accessibility. Keep in mind that anyone can post their tool and there is no review or feedback mechanism: W3C's Web Accessibility Evaluation Tools List.

Here is a shortlist of some tools that we've found helpful.

(Note: When using these tools, be sure to note carefully what standards (if any) a particular product follows such as WCAG 1.0 instead of the more recent 2.0. This list does not constitute endorsement of any particular product or service. All tools have free versions available.

General Testing:
- Accessibility Developer Tools (Chrome)
- AInspector Sidebar (Firefox)
- aXe (Chrome) (Firefox)
- WAVE Toolbar
Color and Contrast
- WebAIM color contrast checker provides quick feedback on a web page
- Paciello's Colour Contrast Analyzer (CCA) is an easy to use eyedropper tool
- Colorsafe.co is a useful designer's tool for finding compatible foreground or background colors
- Full-page Chrome Color Contrast Analyzer
- High Contrast extension (Chrome)
Captioning and Media
- YouTube captioning help center
Mobile

Accessible websites tend to work better in mobile environments. As agencies create more responsive sites and mobile apps, accessibility works hand in hand with good design and development practices.

Some quick resources:
- Accessibility Programming Guide for iOS
- Verifying App Accessibility on iOS
- Accessibility Google design principles
- Android accessibility scanner tool (Google Play)
- Making Applications Accessible | Android Developers
- Accessibility Testing Checklist | Android Developers
- When a pixel is not a pixel - guide to pixel density
BBC's mobile accessibility guidelines

DigitalGov's mobile application development program.
Resources

Online Training and References
- WebAIM's discussion archives is a trove of accessibility information for web designers and developers. We recommend subscribing in digest format.
- PaulJAdam's Modern Web Accessibility Demos
- The Accessibility Tree by a blind developer provides insights into APIs and other code essential to the accessible web.
- Web Accessibility Tutorial by Jim Thatcher.
- Understanding the Web Content Accessibility Guidelines (WCAG 2.0), why and when the guidelines are important, and how to apply them is addressed in the WCAG 2.0 Top Ten Check Points webinar. This webinar provides an introduction to WCAG 2.0 for web application developers and business analysts. (Audio Transcript PDF)
- Social Security Administration Accessibility resources for software developers and electronic content creators
Other Organizations in Minnesota
- MN STAR Program (System of Technology to Achieve Results) mn.gov/star
- MN State Services for the Blind
  http://www.positivelyminnesota.com/JobSeekers/Blind_or_Visually_Impaired
- Commission of Deaf, DeafBlind and Hard of Hearing Minnesotans http://mn.gov/deaf-commission/