Pattern Library



What is Section 508, W3C, WAI and WCAG?

Section 50 was made part of the Rehabilitation Act of 1973 in 1998. Its purpose is to “…require Federal agencies to make their electronic and information technology (EIT) accessible to people with disabilities.”

There are several laws related to Section 508, including laws that prohibit discrimination against individuals with disabilities. When talking about communications, the three most relevant related laws are:

World Wide Web Consortium (W3C) is an international community that develops open standards to ensure the long-term growth of the Web.

Web Accessibility Initiative (WAI) develops standards and support materials to help you understand and implement accessibility.

Web Content Accessibility Guidelines (WCAG) are a series of guidelines for improving web accessibility. Produced by the World Wide Web Consortium (W3C).

Who needs to be 508 compliant and why?

If you work with federal agencies, then you need to be 508 compliant. Being 508 compliant ensures that all of our readers have equal access to Seattle Times digital products.

How does it relate to the WCAG and our company?

In January 2017, the Access Board updated accessibility requirements for Web Content Accessibility Guidelines (WCAG) 2.0 AA standard for web content and information communication technology (ICT). The Americans with Disabilities Act (ADA) safeguards equal opportunities for individuals with disabilities, while Section 508 furthers that equality by requiring electronic and information technology to be made accessible to people with disabilities.

Accessibility is meeting all users wherever they are.

Following accessible best practices will benefit all users as people creatively adapt assistive tech to get things done – regardless if it’s due to a disability or situation. Here are a few examples:

Clear headings, lists, paragraphs, data tables, and form labels help both sighted and non-sighted users. Voiceover best practices apply to:

Keyboard navigation. From WebAIM’s keyboard guidelines, “Keyboard accessibility is one of the most important aspects of web accessibility. Many users with motor disabilities rely on a keyboard. Blind users also typically use a keyboard for navigation. Some people have tremors which don’t allow for fine muscle control…”

Alternative text. All images and icons must have an alt attribute assigned. Alt text is the copy that is input for the screen reader to read. This might be a brand logo on a button in place of a text label. Designers, include the alt text wording in your spec. If the image is not relevant to the content, spec the alt attribute to be blank [alt=””] so screen readers are not reading the image filename. WebAIM guide to alternative text.

Hover. Do not use hover states. Non-sighted users cannot get to the content.

Modals (pop up, flyout, etc.): Make sure the focus moves to the modal. Designers, include copy that explicity indicates to the user where they are going.

Language matters. Clear labeling is one of the most important aspects for voiceover users. Here are just a few of the things to be aware of:

Accessibility tools. Check your browser for extensions and plugin tools for testing. Here are a few: