x/pkgsite: Accessibility Color Contrast Problems

[feketegy]

Would it be possible to change the color contrast on the pkg.go.dev website so people with color blindness or other eye deficiencies could enjoy and use the website better?

I made a test with the a11y.com tool to see the contrast between various colors on the website and the colors highlighted in the screenshot were problematic, these colors are mainly used in links, titles, and code backgrounds.

Screenshot

What did you do?

1. Go to: https://color.a11y.com/Contrast/
2. Test a pkg.go.dev internal page, I tested: https://pkg.go.dev/encoding/json

[beoran]

In stead of relying on a tool which only simulates color blindness, you should ask people who have color blindness, like myself. Since the go website uses white as the background color, and black or blue as the foreground, the contrast is sufficient for me. Unlike, say the python docs which use green or yellow backgrounds... 😛

Of course, color blindness is very personal, so I would like to hear the opinion of a few other color blind people. But I can tell you that most tools like a11y are unhelpful since they do not and cannot describe what people like me actually see. For me the Go website is fine.

[feketegy]

@beoran Is there a tool that you would suggest that comes close to what you're experiencing and what the tool tells you?

I asked a couple of people with color impairments and they told me that the a11y is good.

[beoran]

@feketegy, That is the problem, I haven't found any particular tool that is correct for me, and I tried a dozen on so. As I said color blindness is very personal. I but the Go website is fine for me.

I think it would be best to try to ask the opinions of several color blind people before making any changes. If you make changes based on just a tool in stead of people, you risk making it worse for some people as well.

[jamalc]

Thanks for this feedback. Ensuring pkg.go.dev is accessible for all users is a top priority and we always take contrast into consideration when choosing colors to use on the site. Are there specific elements you can point to on this page that you find problematic? It's difficult to pick out exactly where the the issues are using the text alone.

[feketegy]

My test was done on a package doc page.

The main issues are the blue links don't have enough contrast:

Also, the code examples grey background against the text don't have enough contrast:

[beoran]

Personally don't see too much problems here, but if we really must increase the contrast a selectable high conrast theme could be the solution. The code examples could be white on black as in a terminal. The links could be underlined so they stand out better no matter what the color.

[gopherbot]

Timed out in state WaitingForInfo. Closing.

(I am just a bot, though. Please speak up if this is a mistake or you have the requested information.)