Why is this text, that fails WCAG accessibility guidelines, subjectively easier to read than text that passes?

A

The smaller text here passes WCAG 2.0 contrast accessibility AA guidelines.

A

B

The smaller text here fails WCAG 2.0 contrast accessibility AA guidelines.

B

In a usability study comparing the images above, 78% of participants found the white text (which fails the WCAG contrast test) to be more readable. The difference is 99% likely to be statistically significant. This means that you can be very confident that it is actually better, and not performing better due to random chance.

Here are the results of an accessibility colour test performed at contrastchecker.com:

enter image description here

enter image description here

You can clearly see that the black text is passing more WCAG tests than the white text (which is more readable to most people). The question is why? And to what extent can we rely on WCAG contrast tests when designing digital products?

Tags: