19

Since I haven't had success posting in the appropriate thread of Academia's meta, I've decided to try here. It's an appropriate place for this issue anyway since, although it's not quite as bad, I have the same issue with Meta.

Here is a copy of my post at academia.meta:

Accessibility issue: I'm wearing glasses but have generally very good eye-sight with them. However, since recently I'm finding it hard to read the titles in the list of questions on the front page. I can only imagine how bad it is for people with poor eye-sight. The blue seems to be an even lighter color than on the Stack Overflow front page.

You should change this to something with more contrast to the background as soon as possible.

I would appreciate to at least get a reaction, even if it's just "we don't care about accessibility".

PS: I know that I could change this client-side, but I shouldn't have to and not everyone is able to.

2
  • Here is a way to change the link color for better contrast: meta.stackexchange.com/q/315249/400527
    – John Locke
    Commented Nov 8, 2018 at 11:36
  • I don't have eye-sight issues, however, when I visited the site I felt my eyes straining. On the plus side, it does make a good joke.
    – Danny
    Commented Dec 10, 2018 at 15:13

1 Answer 1

16

It's not just you. The headings of Academia fail one of the WCAG 2.1 level AA criteria requiring a minimum contrast level for text:

The visual presentation of text and images of text has a contrast ratio of at least 4.5:1, except for the following:

  • Large Text: Large-scale text and images of large-scale text have a contrast ratio of at least 3:1
  • [other exceptions not relevant]

The definition of large-scale text is text that is at least 18 points, or 14 points and bold. Academia headings have a font size of 16 pixels and are not bold, therefore not large scale. This means WCAG recommends a contrast ratio of 4.5:1. (How pixels relate to points varies based on display, 1px is usually less than 1pt.)

Academia titles have a contrast ratio of 2.68:1 which is quite poor and not even enough for large-scale text. Many people with poor vision will have trouble distinguishing and reading question titles.

In fact, since this is the standard link color, people with poor vision will struggle to read links in general anywhere across the site. The link underline will help them locate the links, but the letters will be hard to distinguish.

Now, whether SO, Inc wants to meet this criteria is another thing. From what I understand in interactions over several accessibility bug fixes to date, SO Inc does care about accessibility, so it should probably aim for level AA, which is for those sites that want to go above and beyond the bare minimum. (It may be recent that it cares about accessibility, but it does now.)

I recommend SO, Inc should also add a small unit test suite to its LESS to check for things like link color contrast ratio for each site theme it compiles. Automated testing can only catch an extremely limited range of accessibility issues, but it can catch some obvious things like this.

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .