Accessibility, contrast, Chromium profiler

This came up in an email I had with the founder of SourceHut after reading an article on our wiki:

I have some visual impairments and I found this article very
difficult to read. You should increase contrast and consider using
the user’s default fonts. Out of curiosity, I ran it through Chromium’s
accessibility profiler, and found it scored only 53%. I recently did
some work to secure the last 7% in SourceHut’s score - now 100% - let me
know if you want some tips.

@mray and @msiep thoughts on this? I’d never heard of that profiler before. Seems a good tool we should make use of.

1 Like

It sounds like some of the font decisions we’ve made have been a case of everyone assuming somebody else was in charge. And now we still have lots of niggling issues. I would put it up for discussion that use these fonts for marketing material/images/headers, but just use defaults/no specifications otherwise.

Or maybe we should just take them up on their offer of tips. :slight_smile:

I think this is a case where the level of contrast from the color scheme is the bigger issue, but I’m not sure. I think start with checking what the Chromium profiler says and then discuss.

I’d be interested about what page we are talking here and what the nature of the problem is. Sounds like an interesting problem but at this point it is brought up rather nebulous.

What “score” is mentioned here? Accessibility is a big field, and I bet we have tons of space to improve. Not sure contrast is really an issue, though – given that we almost exclusively have a plain white background and dark text. Maybe the light cut of Nunito renders too “thin” for some people?

I mentioned a wiki page specifically, so all the wiki pages are roughly the same in these respects.

I ran the tests in Chromium, and the called-out stuff is the a links. Those are light green on white, and I agree they have much worse contrast than most of the rest of the text.

The rest of the report is actually meta stuff such as

<html> element does not have a [lang] attribute

and there’s a point about making sure text shows even prior to font-loading, https://web.dev/font-display/?utm_source=lighthouse&utm_medium=devtools

All in all, the developer tools “audits” in Chromium seem very useful for us to check. But the only design item I’m seeing is the low-contrast fro our green link color.

The page linked over at https://lists.sr.ht/~sircmpwn/sr.ht-discuss/<C03B4X6WE7XN.9NAXAORGDJ0B%40homura> is https://wiki.snowdrift.coop/about/free-libre-open.

This is, indeed not great in terms of readability even without any impairment. I don’t feel too strong about it as the wiki isn’t so important in my eyes.

image

I created an issue for that sake: https://gitlab.com/snowdrift/wiki/issues/24

1 Like

that said there is a nice feature in Firefox for problems like this:

…it is called “Toggle reader view” and can be toggled via ctrl+alt+r.

1 Like

Yup, I use reader mode all the time. It has a dark-mode too and control over line-length, spacing, font-size etc…