reasonable-colors icon indicating copy to clipboard operation
reasonable-colors copied to clipboard

Consider APCA/Bridge-PCA instead of WCAG

Open clarfonthey opened this issue 2 years ago • 5 comments

There's a lovely project by Myndex here that aims to address a lot of problems with WCAG contrast: https://github.com/Myndex/SAPC-APCA

They also have a Bridge-PCA algorithm that will satisfy the requirements from both WCAG and APCA, but it's really only recommended for folks who have legal obligations to WCAG, and less those who just want to use the right combos.

Specifically, for APCA it does matter whether colours are a foreground or background colour, since our eyes perceive contrast differently if they're swapped.

I love the work you've done here and mostly wanted to share since I'm not sure you know about APCA, and would probably like to learn more.

clarfonthey avatar Apr 23 '22 13:04 clarfonthey

Thanks for suggesting this! I hadn't seen this project specifically, thank you.

I did spend some time considering trying to use WCAG 3 contrast recommendations, but eventually decided to use the (not perfect) WCAG 2 recommendations for the time being. WCAG 3 is still a working draft and the new requirements don't appear to be backwards compatible with the current requirements. It may actually be quite some time before it's ready to be used.

This article did a nice job of explaining some of the complexities of using the new algorithm: https://yatil.net/blog/wcag-3-is-not-ready-yet

When the situation changes, I'll likely update the project to meet the new guidelines.

matthewhowell avatar Apr 23 '22 15:04 matthewhowell

So, FWIW, there has been a fair bit of progress since that article was posted and while the actual algorithm isn't 100% stabilised, the actual amount your values will differ in future changes is pretty small. While the suggestions vary based upon fonts, the only time the ratings change is when the foreground and background are swapped. I think the suggestions here are pretty easy to understand: https://myndex.github.io/SAPC-APCA/WEBTOOLS/APCA/#general-guidelines-on-levels

Bridge-PCA, the other version I mentioned, is also a WCAG 2-compatible version of the algorithm which essentially ensures that 60% exceeds A, 75% exceeds AA, and 90% exceeds AAA, matching up approximately with the recommendations for the regular APCA. But it does seriously limit the design possibilities since it essentially requires combinations to match both criteria, which is relatively hard to do.

I didn't know too much about WCAG 3 before I was introduced to the actual research and the person behind it, which is in the repo I linked. They're actively responding to discussions about the algorithm and the resources surrounding it, so, if you're interested it might definitely be worth poking around. A lot of the focus of the existing resources is on extremely strict requirements since the most fiddly part of it is creating actual requirements that people can impose on things, but if you're just someone who wants to make sure a colour combination has the right contrast, I'd say that things are pretty usable as is.

clarfonthey avatar Apr 23 '22 17:04 clarfonthey

👍 Noted!

I will read more about this and consider it. Thank you so much for taking the time to explain all of that, it's much appreciated!

matthewhowell avatar Apr 23 '22 18:04 matthewhowell

Hi Clar, Hi Matthew @clarfonthey @matthewhowell

This article did a nice job of explaining some of the complexities of using the new algorithm:....wcag-3-is-not-ready-yet

The individual that wrote that article is welcome to his opinion, however, he is not involved with WCAG 3, and has never been a part of the Visual Contrast Subcommittee, nor the Low Vision Task Force. He is uninformed as to the status and scope of APCA, and therefore notwithstanding.

Timelines and Scope

While WCAG 3 is probably not going to be finalized until next year, APCA is developing both separately, and with W3C/AGWG oversight and guidance. The scope of WCAG 3 is "web based content".

The scope of APCA is "everything readable on self-illuminated monitors".

This year marks the third anniversary of the research and development project that underlies APCA (and it is significantly more extensive than just the APCA tool).

A few things I'd like to mention:

  • The Basic APCA math/algorithm is stable, and has not changed in over a year. This base algorithm is probably not going to change, however, there are more advanced versions that are separate and may be introduced due to the development of new display technologies, but that is not relevant to the Basic sRGB version that is donated to the W3C for use in guidelines.

  • I just published APCA W3 0.1.2, which includes some key new features, but nevertheless, the underlying basic APCA math itself is stable, and has not changed in over a year.

  • The new, added features include an integrated dynamic font lookup table, alpha blending, displayP3 support, and a "reverseAPCA" where you can specify a contrast value, and either the bg or text color, and it generates the missing color.

It is on npm, npm i apca-w3

It has one dependency, which I've also placed on npm: npm i colorparsley

  • Also, as Clar mentioned, Bridge-PCA is a drop-in replacement for WCAG 2's math. See that tool at https://www.myndex.com/BPCA/

Please let me know of any questions. Also, the main repo discussion area is open with active discussions on APCA and related technologies: https://github.com/Myndex/SAPC-APCA/discussions

Thank you!

Andy

Myndex avatar Apr 25 '22 05:04 Myndex

Another great response, thanks for this! The two of you have successfully converted me from using-WCAG 2-until-some-fuzzy-future-date to beginning-to-build-a-WCAG 3-version-today.

I don't know when (or even if) Reasonable Colors can be moved WCAG 3 and still meets its goals, I'll figure that out as I begin the work. The project's core idea (a set of 6 shades that can be used together in obvious, accessible ways) might not be possible with the new requirements. It might necessitate a bigger think.

But, it seems clear that that work to move to APAC (and eventually WCAG 3) can be started now without much downside.

Also, reverseAPCA sounds like a fantastic tool! Thanks for building something like this!

I'll leave this issue open to track progress and as a place for further discussion.

matthewhowell avatar Apr 25 '22 15:04 matthewhowell