Should a website provide configurable accessibility options to users?

Update about the used example in this post

Today (17th of June 2021) I stumbled upon a CSS Tricks article which states that you CAN detect if a user has their colours inverted system wide. Kicking over the whole foundation of the examples I provide in this post. The original problem that I had is thus solved (use the @media (inverted-colors) media query). If you still want to read the original post, let’s get going.

Today I did an interview for my accessibility research (in Dutch, Chrome translates it well). The person I spoke with used the system setting to invert all colours, due to hyper sensitivity to light. The result was that images were also inverted and thus became negative:

Screenshot of a Google Images search for cats. Split in half where the first half is normal. In the second half, the colours are inverted

Here you can compare how inverted colours look on macOS. The left side shows a Google Images search without inverted colours. In the right side the colours are inverted. The images then become negatives. Making them really hard to interpret.

She uses social media on a regular basis. Seeing all images and videos in their negative form, takes the fun out of using it. When an image or video contains crucial information, it becomes a bigger problem.

On iOS there is the option to “smart invert” the colours. Meaning, all colours are inverted, except for images and video. That is the golden solution in this scenario, but I did not find similar “smart” colour invert options in macOS, Android or Windows.

As a developer, I can provide an option to invert the colours of an image first, and when the operating system inverts all the colours on screen, my inverted image is again inverted, making it appear normal again. Like this:

The same screenshot as before, only this time, the colour of the images on the page are inverted. This results in the second half, where all colours are inverted except for the images

This time, an invert() filter is applied within the website itself. Again, the left side shows a ‘normal’ view but with inverted colours. The right side shows the inverted version. But because the images were already inverted, they appear normal again.

You can’t (rightfully) detect if accessibility features are enabled

The developer of a website can not find out if certain accessibility features are turned on or not. Not only are these settings handled system wide, from a privacy perspective a user might have good reasons not to disclose to every website they required these options.

If I want to allow the users to browse the site with inverted images, so that the operating system can reinvent them, I need to provide a UI for that. A accessibility settings menu if you will. That in turn requires the user to a) find it, and b) actively turn it on.

Questions to answer

All this considered, I have a couple of questions to answer:

Do users want this level of customisation?

I get fed up with all the cookie consent notices for every single website. I can imagine someone does not want to search for settings on every single website they visit.

But for an app or a site you use every day, you might want to go through that trouble.

How does a user distinguish between this menu and other bad actors?

Looking at the Overlay Factsheet, other attempts to ‘fix accessibility’ are not that well received. Although I don’t think this menu is comparable to these tools, It is vital that a user understands that as well.

How do I make sure that this does not become a tracking data point?

You don’t want to reapply the same setting every time you visit a site or app. Persisting the setting for the user is important. But that will (potentially) allow others to find out these settings have been set. Which violates the users privacy.

Do you have any answers?

Did I overlook important details? Are there existing solutions out there? Do you have an other opinion? I like to know about it!


I use WebMentions via the IndieWeb. Do you have a comment?
Reply on Twitter under this tweet. Respond on Mastodon under this toot.
Or respond via a post from your site!

Likes and Reposts

11 Replies

  • Stéphane Deschamps Stéphane Deschamps Posted on
    @petergoes Q: Do users want this level of customisation? A: From what I gather, having worked with disabled people for a long time, they're neither more expert than average users, nor more prone to all this cookie dance. So I'd wager not. Doing something for dark mode, thought, may be a good start as it is automatic. We can't provision for all system configurations, although the more we strive for accessibility and standards, the easier people can cope with our websites.
  • Peter Goes Peter Goes Posted on
    @accessiblestef No, I think you are right. I have the same observations about digital literacy. I updated the post just now. I stumbled upon a solution for the specific problem I faced. So there's that...
  • Stéphane Deschamps Stéphane Deschamps Posted on
    @petergoes Q: How does a user distinguish between this menu and other bad actors? A: It depends how it's presented. First and foremost, don't promise more than you want to achieve 😉 If you promise “more comfort” in this-or-that situation, it's up to the user to decide whether they want to engage with the menu options or not. —Side note: I'm not sure users care about good/bad actors. When/if they see something, they either want to test it or not.
  • Peter Goes Peter Goes Posted on
    I just stumbled upon the solution for the specific problem I was facing 🎉. Use `@media (inverted-colors)` does allow you to detect if a user inverted their colours!
  • Lien Rag Lien Rag Posted on
    @accessiblestefWhy do you oppose a default for regular users and a customisation menu somewhere (maybe deep into the options if you believe not many users will want it) ?@petergoes
  • Stéphane Deschamps Stéphane Deschamps Posted on
    @lienrag If you're reacting to “I'd wager not.”, in my experience the majority of people don't. You and I being geeks is a minority, I guess ;) @petergoes
  • Lien Rag Lien Rag Posted on
    @accessiblestef Obviously, but there's a big difference between "dont put it in the face of people that are not interested in it" and "screw the ones that would want it, they're a minority anyway". The question was "should I provide configuration options to user", not "will everybody use it". So the answers are "yes" to the first and "no" to the second, that's not contradictory.@petergoes
  • Stéphane Deschamps Stéphane Deschamps Posted on
    @lienrag Did I say “screw them”? I was in the hypothesis of prioritization and was constrained by 500 characters.So here goes: s/I'd wager not/I'd wager most don't/Happy, friend? @petergoes
  • Lien Rag Lien Rag Posted on
    @accessiblestef Indeed, if it's a question of priortirization, your answer is reasonable - and you're certainly more knowledgeable on the topic than me.@petergoes
  • Code 🐒 get up get ☕ Code 🐒 get up get ☕ Posted on
    @petergoes only thing I can think of is colorblind and high contrast mode, which can be backend settings on a web app.Only reason these would be settings is they can royally screw up the intended design whereas other #a11y optimizations generally don't. a11y