Web design lacks contrast

[gunchleoc]

I just showed our homepage to a friend who is somewhat vision impaired. He could not read the green headers at all, and distinguishing between normal text and links was also a big problem for him.

---

Imported from Launchpad using lp2gh.

• date created: 2018-01-31T14:32:16Z
• owner: gunchleoc
• the launchpad url was https://bugs.launchpad.net/bugs/1746528

[gunchleoc]

(by gunchleoc)
I have attached a desaturated screenshot. Both the titles and the links (especially visited links) are indeed hard to distinguish.

How about the following:

1. Make the green brighter, while making sure that t's not oversaturated (=glaring)
2. Underline the links

[gunchleoc]

(by franku)
Yes, i encountered this also a few weeks ago by using the Web Accessibility Evaluation Tool (WAVE)

http://wave.webaim.org/report#/wl.widelands.org

I have WAVE also installed as a firefox add on. This tool is not very exact, imho, but better than nothing.

1. Make the green brighter, while making sure that t's not oversaturated (=glaring)

The problem with this is that the green header is used both on dark and bright background. So making it brighter will reduce contrast against the bright background. Making it darker is vice versa. For a solution we need to make different colors depending on the background.

2. Underline the links

I don't like that... but if it helps...

IMHO the general problem of the website is: Too many colors.

[gunchleoc]

(by gunchleoc)
I guess what really gets us into trouble here is that we have both dark and light backgrounds. I love dark backgrounds, but they are also very hard to pull off design-wise.

[gunchleoc]

(by franku)

I love dark backgrounds, but they are also very hard to pull off design-wise.

Not really. If there is consensus to have dark background only for bright text it makes things easier. Of course the other way around would fit also.

Sooner or later we may have to rethink the current design of the webpage. I am not sure if i am the right person for this :-)