Body
This article outlines Oakland University’s efforts to support digital accessibility through compliance with WCAG 2.0, Section 504/508, and ADA standards. It includes training resources, testing tools, and design best practices to help faculty and staff create accessible web content, documents, and multimedia.
Who is Eligible?
Active Faculty or Staff
Web Content Accessibility Guidelines (WCAG v2.0)
Websites and web site content must be developed and maintained with attention to accessibility standards and in compliance with Section 504 and 508 of the Rehabilitation Act, the Americans with Disabilities Act, and university non-discrimination policies. All websites to the extent feasible, must be made accessible to people with disabilities. If it is not feasible, alternative methods must be made available to complete the same tasks. Compliance with the WCAG Standard 2.0 Level AA (including Level A) standard is required.
Compliance requires more than just good HTML design. We need to additionally address contrast and color blind issues in the design of the web page. Also, navigational techniques must be considered.
University Technology Services is summarizing Current Efforts to create a culture of compliance.
Training
You may want to review training materials before you start. The training materials are listed in order of skill depth.
Basic Checklist
Start with the W3C Web Accessibility Initiative Tips on Designing for Web Accessibility, the W3C Web Accessibility Checklist, and the Siteimprove Web Accessibility Checklist.
As you review checklists, web sites, and content, address the following accessibility factors list first, using the tools identified throughout this document:
- Broken Links and Misspellings: Fixing broken links and misspellings improves usability for all your site visitors.
-
Avoid unnecessary stylistic differences and use style tags that can be handled by a screen reader. Specifically, avoid using italics, bold, ALL UPPER-CASE, and differently styled content to highlight important content or to differentiate headings. Review suggestions at WebAIM Fonts and WebAIM Using Headings for Content Structure.
-
Link Text and Appearance: Link text is useful if it is informative and useful. Review suggestions for handling link text at WebAIM Link Text and Appearance Tutorial.
-
Visual Text / Background Contrast: Review material at Siteimprove How To Navigate the Challenges of Color and Web Accessibility.
-
Headings: Review material for appropriate use of headings at W3C Web Accessibility Headings Tutorial.
-
Alternative Text / Images: Images require actions based on the information that is conveyed by the image. Review the tutorial at W3C Web Accessibility Images Tutorial. Best practices are simply described at Siteimprove Accessibility: Image Alt text best practices. A decision tree to help you decide the best image alt attribute is presented at W3C Web Accessibility An Alt Decision Tree.
-
List Styles: Lists present useful groups to organize materials, but lists require careful management to convey the context of groupings and organizations. Review the list tutorial presented at W3C Web Accessibility Content Structure - Lists Tutorial.
-
Multiple Avenues for Multimedia: Multimedia requires transcripts, captions, and descriptions. Several options are available for use at Oakland University described in the document Video Captioning Options. Consider minimizing the general use of multimedia and limiting use to those situations where multimedia adds value to the information and content. UTS and Communications and Marketing are ready to assist with decisions and can coordinate external services for the creation of captions or transcripts. Such services are funded by the department requesting multimedia use. Review tutorial information about multimedia presented by the tutorial WebAIM Captions, Transcripts and Audio Descriptions or the article W3C Web Accessibility Time-based Media Understanding Guideline 1.2. Communications and Marketing suggests review of the following list of best practices as a starting point:
-
Complex Images: Charts, graphs, tables, and maps are examples of complex images that require both information about the display and added context. Review presentation suggestions in the complex images material in the WebAIM Alternative Text Tutorial.
-
Keyboard Navigable Content: Accessibility compliance requires that all content be accessible with the keyboard alone. Navigation order is especially important for those who rely on keyboards for access. Review the tutorial WebAIM Keyboard Accessibility for information and design suggestions.
-
Documents in Accessible Formats: Documents must be presented in accessible formats. Review the suggested accessibility materials for the software used to create documents. In general, acceptable fonts include Times New Roman, Verdana, Arial, Tahoma, Helvetica, or Calibri. The smallest acceptable font is 12 pt. Color contrast ratio between foreground text and background color should be at least 4.5:1. The Section 508 PDF checklist covers details for PDF documents. W3C also presents WCAG 2.0 PDF Techniques for review.
Video Captioning
Core Centralized Web Site Validation Software
Chrome Browser Extensions
-
AxE: Validate and point out accessibility compliance failures in web pages.
-
ChromeVox: Chrome extension that is a screen reader, useful for understanding and troubleshooting accessibility issues.
-
WAVE: Visual tool to help highlight accessibility issues.
Firefox Browser Extensions
-
AxE: Firefox extension to validate and point out accessibility compliance failures in web pages.
-
Fangs: A Firefox plugin that will emulate what a screen reader comprehends and displays in plaintext to help speed up troubleshooting and checking.
-
Inspector Sidebar: A nice Firefox tool to quickly analysis multiple pages within a site
-
Tenon.io: Quick compliance validation tool.
-
Pa11y: Accessibility compliance validation tool. Pa11y has a command line, dashboard and automated scheduling component
-
AC Checker: Web site validation Tool
-
WAVE: Web site validation Tool
-
Functional Accessibility Evaluator: 2.0 spiders a website for WCAG 2.0 AA requirements and generates a summary report NOTE: You need to create an account to spider a website. One important feature you won’t find with commercial evaluation tools is a detailed list of the rules and rulesets used to evaluate accessibility.
-
ChromeVox: Chrome extension that is a screen reader, useful for understanding and troubleshooting accessibility issues.
-
Mac OS - Voiceover: Mac OS's screen reader is good with Safari (can be used with other browsers too). Additionally good for checking accessibility with PDFs, software and more. Deque University - VoiceOver Cheat Sheet
-
Windows - Narrator: Microsoft Windows built in screen reader. Good for checking accessibility on PDFs, software, office documents and more.
References and Resources
Upcoming Guidelines