Madison Ave. Collective

Checklist of Federal and State Requirements for Developing an Accessible Website in California

By Jeff Jimerson / April 6, 2023

Understanding accessibility

Designing a website that’s “accessible” means you’re providing an equivalent experience for all users, regardless of the physical or cognitive ability an individual user may or may not have. The World Wide Web Consortium (W3C) puts it this way: “Accessibility means that people with disabilities can perceive, understand, navigate, and interact” with your website without barriers.

Who is the W3C? They’re an international non-governmental association that develops technical specifications for HTML and CSS, as well as recommendations and best practices for security, online payments, and accessibility. The W3C’s international gold standard for website accessibility rules is called the Web Content Accessibility Guidelines (WCAG).

What federal law says

Section 508 of The Rehabilitation Act, first adopted in 1973 and amended by Congress in 1998, requires federal agencies to make their electronic information accessible to people with disabilities. The rules were originally established in the fairly early days of the Internet, but Section 508 was modernized in 2017 to align with WCAG.

What this means in practical terms is, adhering to Section 508 for website development is synonymous with WCAG compliance. And while these standards are merely best-practice “recommendations” according to the W3C, for all U.S. government agencies — as well as for businesses and organizations that receive federal funding — these accessibility standards are requirements under Section 508.

What’s the difference between ADA and Section 508?

The Americans with Disabilities Act (ADA), which became law in 1990, requires state and local governments, businesses, nonprofit organizations, and labor unions make “reasonable accommodations” for employees with disabilities. ADA is a broad law against disability discrimination that applies to agencies and organizations with 15 or more employees. While it doesn’t go into technical details about website development, Section 508, on the other hand, essentially tells employers how to comply with ADA. How so? By following the WCAG.

In addition to ADA and Section 508, there are other federal laws that touch on the subjects of website development and access to electronic information. The Connected Government Act of 2018, for example, requires all new and redesigned federal agency websites to be accessible using mobile devices.

What state law says

California’s Government Code directs that: “state governmental entities, in developing, procuring, maintaining, or using electronic or information technology, either indirectly or through the use of state funds by other entities, shall comply with the accessibility requirements of Section 508.”

Additionally, California mandates that all government websites must include a post on the home page linking to a signed certification from the agency’s director and chief information officer stating that the website is in compliance with WCAG 2.1 AA. This is required per California Assembly Bill No. 434 that went into effect in 2019. 

The following state agencies have developed resources to assist in accessibility compliance:

• California Department of Rehabilitation provides a toolkit to help you assess whether your website is in compliance with state accessibility law.
• California Web Standards provides a suite of tools and information to assist you in developing a “user-centered, accessible, and mobile-friendly” government website.

WCAG accessibility checklist

The Web Content Accessibility Guidelines (WCAG) are separated into three levels of conformance. These roughly translate into “basic stuff” (level A), “essential stuff” (level AA), and “shootin’ for the moon stuff” (level AAA). The W3C acknowledges that AAA may be impossible to achieve, so for the most part we’ve only included rules from the first two levels here. Also, for the sake of brevity — and to prevent eyes from going crossed — we’ve omitted highly technical and fine point recommendations. (If you care to dig deeper into the geeky details, W3C has more than 1,100 technical specs.)

Here’s our quick reference checklist for developing a website that conforms to WCAG and Section 508 standards.

1. Provide text alternatives for non-text content

• Captions are provided for video
• Transcripts are provided for podcasts and other audio-based content
• Alt tags are used to describe images, or set to null (i.e. alt=“ ”) when decorative images should be ignored by assistive technology
• Labels are used for buttons and form elements
• With the exception of logos, text is not placed within images

2. Make page layout and content adaptable

• CSS is used to control visual presentation of content
• The structure and relationships between elements are consistent on various screen sizes
• Content is presented in a correct, meaningful reading sequence on both desktop and mobile devices
• Content reflows without the use of both horizontal and vertical scrolling

3. Use color appropriately

• Body copy has a contrast ratio of at least 4.5:1 with the surrounding area
• Headlines and large text have a contrast ratio of at least 3:1 with the surrounding area
• Information conveyed using color is also available in text

4. Make text readable

• CSS is used to control the visual presentation of text
• Spacing between lines of text (known as line spacing, line height, or leading) is at least 1.5 times the font size
• Spacing between paragraphs is at least 2 times the font size
• Spacing between letters (known as letter spacing or tracking) is at least 0.12 times the font size

5. Provide keyboard and user controls

• Allow ability to pause, stop, or hide any moving, blinking, or scrolling information
• Allow ability to pause or stop audio
• Allow ability to resize text — up to 200% — either with on-screen controls or through a web browser’s zoom function
• If content is presented on hover, provide ability to dismiss/hide the content
• Tab order (in forms, for example) is correctly set

6. Avoid negative physical reactions (seizures)

• Nothing on the website flashes more than three times per second

7. Use page titles

• For HTML pages, the Title tag is used to describe each page’s topic or purpose
• For PDFs, the document Title is used

8. Make the website easy to navigate

• The user’s location is always visible within a set of pages. For example, this could be achieved with an indicator on a navigation bar (highlighting the active page), a breadcrumb trail, or by providing page numbers in a PDF.
• At least two ways are provided to locate each page within a website. For example, in addition to a standard navigation bar this could include a site map, a list of page links on the homepage, or a search box. An exception to this rule is for pages which are part of a step or process, e.g. a multi-page survey or shopping cart checkout.
• When navigational mechanisms are repeated on multiple pages (i.e. within a navigation bar), menu items display in the same order each time they are repeated.
• Link text describes the purpose of the link, including anchor links that jump within a page. (In other words, don’t use “click here.”)

While accessible website design isn’t rocket surgery, it does require an approach to planning that starts at the very beginning. Done right, accessibility is woven into all phases and stages of website development: content strategy and information architecture, user experience and visual design, and programming.

For over 15 years, MAC has been developing websites for public good — including for clients in community health, public services, and higher ed. Need help implementing these accessibility standards for your website? Contact Logan Hoffman at logan@madcollective.com or call 541.971.4113 ext. 711.

This article is also published on Medium.

• Websites
• Education
• Community Health
• Nonprofit
• Consumer Marketing