Accessibility

Digital accessibility guide for web authors

Welcome to version 1 of Chicago's digital accessibility guide. This guide is meant to serve as an easy introduction to accessibility for anyone creating apps or web content for the city. It isn't comprehensive, and following all the information presented here will not guarantee that your content is accessible. Use the guide as a starting point for accessibility, and think of these guidelines as the baseline for our web and app content.

 

What is digital accessibility?

In day-to-day life, we interact with many things that could be considered accessibility features. Ramps, elevators, curb cutouts, and kneeling buses all make locations and services more usable for people with disabilities.

Digital accessibility means extending the same idea to our digital services so our sites and apps work for everyone in the city.

More about accessibility

 

Our web standards

When we put content online, it needs to conform to the Web Content Accessibility Guidelines (WCAG). The WCAG provides guidance for making sites easier to use.

The full WCAG is available at W3C, but we've provided a short overview here:

WCAG overview

 

Write descriptive links

Screen reader users often jump straight to links, so we can't expect that they'll get context from nearby words or images. It's important to write descriptive links so everyone knows where they lead.

How to write descriptive links

 

Use accessible text formatting

It's important to use colors and fonts that are easy to read.

Some text formatting might seem okay to a fully-sighted person even if it's impossible to read for someone with a low vision. That's why we use objective color contrast tests.

How to make sure text is accessible

 

Structure your page with headings

Headings make your page easier to read by adding structure to text. What you might not know is that they also provide landmarks that screen readers can jump directly to, making the page easier to navigate for blind and low-vision users.

How to use headings

 

Add alt text to images

Screen readers use text to speech to describe the contents on a page. They can handle plain text, but they can't tell what's in an image, even if the image has text on it.

We add alt text to fill that gap and describe visual content. The text is announced to screen reader users once they get to the image.

How to write alt text for images

 

Considerations for audio and video

For audio content like podcasts, we need to provide transcripts for deaf and hard-of-hearing users. Videos with audio tracks need captions.

If a video's visual component is important to understanding the video, you will also need an additional audio track called an audio description. Audio descriptions speak visual content so blind and low-vision users don't miss it.

How to make video and audio accessible