📝 CSS-Tricks 282: We shouldn’t treat accessibility like the cool new thing of the week

[Robin]: There’s a bit of drama in the accessibility world at the moment that’s worth taking a look at. It all hinges around a working draft of the WCAG 3. Here’s the gist: the Web Content Accessibility Guidelines (WCAG) are rules that tell us web developers how to make our websites accessible and it covers a ton of things, like how to use color in our interfaces:

Color is not used as the only visual means of conveying information, indicating an action, prompting a response, or distinguishing a visual element.

Lots of guidelines are like that. But! They’re not just here to boss us around—even if WCAG compliance is written into law in some cases. The ultimate goal here is to help us make better websites and the WCAG 2.1 (which is the current standard and recommendation) does just that. It provides us with ways to test our work, like with color.

Stacie Arellano wrote about all this a while back and how these color recommendations let us test to see if our websites are easy to read (think black text on white background good, yellow text on yellow background bad). The WCAG 2.1 has rules about how color ratios are calculated, like over on accessible-colors.com where they tell you if your text is readable and what you need to do to fix it.

These ratios in other tools like this one are directly from the WCAG 2.1 guidelines and tons of designers and developers use them to make the case to change the colors of things.

Onto the drama: the new WCAG 3.0 Working Draft has a new color contrast method called Advanced Perceptual Contrast Algorithm (woof!) which looks like it has a much improved method to figure out if our text is readable or not. That’s great! But Eric Eggert argues that WCAG 3 is not ready yet, and it won’t be for quite some time:

In general, web technologies are very good citizens to early adopters like me: They usually come with suitable fallbacks that allow you to use, for example, animations and transitions in 2009 with the fallback of no animation for browsers without support.

With guidelines like WCAG 2.1 and 2.2 (to be released later), the same approach is true. If you use WCAG 2.2 Success Criteria now, the Guidelines are built to be backwards compatible. So you will never break a 2.0 or 2.1 audit by using it. But WCAG 3 breaks backwards compatibility. This is a conscious move to better adapt the standard to serve different disabilities which WCAG 2 did not sufficiently cover, due to its structure.

Interesting! I hadn’t heard about any of this before and it looks like all of this works very differently to CSS or HTML or JavaScript where we’re encouraged to use the latest and greatest tools with progressive enhancement in mind.

Kilian Valkhof clarifies this argument really well here:

Whatever is currently written down as WCAG3, including APCA, is subject to change. This is great! It means developers still have a chance to submit feedback. If you like something, don’t like something, or have suggestions: now is the time.

It also means that whatever is written down as WCAG3 at the moment, is not something you should base your accessibility choices on. Worse, using these guidelines while they’re not ready might lead to you thinking you’re doing the right thing while not conforming to WCAG2, and you’ll have to change it.

So: don’t use APCA, and stick to the current WCAG 2.1 Guidelines when it comes to color. Got it. But I think there’s an important lesson from all this somewhat complicated terminology and drama. I think this proves we shouldn’t jump on the coolest, latest trend when it comes to accessibility because, on the web, accessibility is one of the slowest things to change. And there’s a good reason for that!

If we use the latest stuff too soon then it does the exact opposite of what accessibility best practices attempt to do in the first place and it leaves people behind. So let’s stick to the boring stuff.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s