Concerning the usage of colors to indicate something (colorblind)

Dear all,

Could you maybe consider making the color-choices for the various indicators configurable? Or choose differently :smiley:

I for example am having a hard time discerning between covered and uncovered condition in SourceView here:

image

While searching for duplicate Forum-Entries i stumbled upon the Release of 7.5 (yay \o/) and in the closed Tickets for the Release 7.5 i spotted something concerning improvements related to colorblindness

In the comments there, it was mentioned that all Tickets concerning colorblindness share the tag “accessibility” and so i followed that and did not find many directly related to colorblindness.

But this made me aware that this topic is already kind of considered internally already, which is nice. If possible, letting me choose the colors would maybe be a (easier?) quick-fix for existing stumbling blocks? Of course i also like it, when there are letters or symbols used in conjunction to colors to indicate status, too :wink:

cheers
Daniel

2 Likes

Hi Daniel,

Thanks for your feedback :slightly_smiling_face:

Indeed the ticket you were probably looking for is this one, the “accessibility” tag was missing, I added it after seeing your message. So mea culpa here!

As you can see, the extensive usage we make of red and green colors are causing troubles that we’re aware of, and willing to solve!

Since you suggested to choose colors yourself, what kind of colors would you pick for those blocks that would make your life easier? I’m curious to know :slightly_smiling_face:

In the past I have used a Chrome extention such as https://chrome.google.com/webstore/detail/lets-get-color-blind/bkdgdianpkfahpkmphgehigalpighjck?hl=en to simulate what an interface might look like for a person with several types of colourblinedness. It is not perfect and the exact impact changes by individual but it helps give designers an idea of what information is lost.

I was advised that the best thing to do is use shape and position as well as colour to indicate status information. Traffic signals work both on colour and position. A fail being a red cross or a green tick adds a different shape. Something as simple as including the status word as well as a colour light indicator can help.

I do not have color blindness myself so any advice from someone who has would be more valuable. I just remembered some tools and advice I received to help make interfaces accessible. There are some steps to make pages usable by people with very limited vision or total blindness too; although this can obvious be a greater design challenge. I have not looking into full blind accessibility since HTML5 was released (I last did web stuff loooooonnnnggggg ago).

2 Likes

Hi @Laura

i am late to answer (sorry) and a bit humble concerning your question as there might be many better and scientifically proven results concerning the three main trains of visual impairment relating to colorblindness.

But as you asked and i like to give my personal opinion (even if it might be rather shallow) … i am fond of the (former?) default setup of Jenkins … they work with Blue / Yellow / Red as Job-Status-Indicators i guess.

In my experience i was able to work rather good with these main colors.

cheers
Daniel

P.S.: I noticed with delight that there are some colorblind improvements mentioned in @ganncamp s Announcement for SQ 7.6 here

Hi @daniel, good to hear from you :slightly_smiling_face:

Thanks for your input. Unfortunately we cannot implement your suggestion as the yellow and blue colors are standard for other things in our interface.

However, as you noticed we’re trying to leverage other visual tricks to make the interface more accessible. We recently reworked the contrast on the coverage indicators (the topic of your initial post!), or we try to pair colors with icons in other situations.

I can tell you that the User Experience team at SonarSource has made accessibility for partially sighted people one of its priorities for 2019 :slight_smile: So if you’re following our releases announcements you’re going to hear about this topic again soon!

We already have a backlog of things to improve, but if you notice other areas of improvements in the interface, feel free to ping us again in the future.

Hi, @Laura.
I’ve got here precisely because I’ve seen what I considered a configuration problem.
In a new version of SonarQube I’ve seen that partially covered and not covered are now red (both), although one of then has the diagonal pattern. It’s harder for me to distinguish them.
I wonder, can’t the previous orange be maintained, and just add the pattern to it? In fact, looking at the image from @daniel, the OP, I see the pattern is already there!

This is what I see, by the way:
imagen

Also, I miss the user name next to each modified block. I wonder if it’s a similar issue or different, though.