Seeking opinions from colorblind Rustaceans! Coloring in rustdoc code blocks

1

A sort of under-appreciate feature in rustdoc is the colors it uses to denote what types of things it's linking to. For example, an important distinction can be made between std::io::Result and the regular std::result::Result - the former is a type alias, and is rendered in orange, but the latter is an enum, and rendered in green.


std::fs::File::open, returning io::Result, noted in orange

956×124 11.7 KB

std::str::FromStr::from_str, returning std::result::Result, noted in green

A couple of times when I've seen these two Results confused in #rust-beginners, I've noted that you could tell io::Result was different due to its color. But it got me wondering, how are the colors used in rustdoc perceived by colorblind people?

I chatted with the docs team about it today, and I wanted to see what the wider community thought. If you or someone you know is colorblind, please take a look at the examples below and let us know if any of them are hard to distinguish from each other.


The f32s in this example are primitives, rendered in light blue.


Function names, rendered in a dusky pink.


Option, an enum, rendered in green.


IntoIterator, PartialEq, and PartialOrd, traits, and both sets of Items, associated types, rendered in purple.


Box, a struct, rendered in red.


This Result, returned by std::io::copy, is a type alias, rendered in orange.

(If I've missed any significant examples of things that get hyperlinked, let me know and I can add them to this post. I'd like to not include the syntax highlighting in full code blocks, just the elements in function/struct/enum/trait references that get hyperlinked, as they confer semantic information above just the name of the item being referenced.)

10 Likes
2

I have mild red/green colorblindness. I can't pass the tests with the circles of dots, but it has almost no impact on my life. Its so unimpactful that at first I was like "This seems like a good idea," and then I remembered that I am colorblind.

I can tell all of the colors used in the docs apart from one another. It hadn't really occurred to me that the different colors of Result indicated one was an alias; I've always judged that from the fact that the alias'd result only has one parameter.

Even though I can tell all the colors apart, from your descriptions I've discovered there are several colors that I am not making out the same way as everyone else.

To me this is a medium gray. Perhaps it is not as well-highlighted for me as its intended?

I thought it was blue, but looking closely I can see that its purple. They're well highlighted for me though.

10 Likes
3

fwiw I agree with both of your comments despite not being colorblind. I'd describe the function names as "gray lavendar" rather than pink, and the traits/items seem a lot more blue than purple.

2 Likes
4

The coloring on this is really subtle to me, so it's not that surprising that it wouldn't show up that well. The coloring of function names seems like it's not intended to be that strong of a signal, maybe just enough to register that it's a hyperlink or that it's syntax highlighting.

Thanks so much for chiming in; knowing that the colors are distinct for you is really what I wanted to know here.

5

As a related question, is there a key to the colour-coding anywhere in the docs?

4 Likes
6

Made an account for this one because I too am colorblind (moderate red/green).

I would have to agree with the others above about the "dusky pink" of the function names being more of a gray to my eyes.

The traits and associated items which are listed as purple just look like a darker/deeper blue than the primitives to me (honestly the primitives almost look like a light purple instead of a light blue to me). Sadly, I'm having a hard time describing what color the type aliases look like to me. I wouldn't have called it orange before I saw this post, but I can see now how it's supposed to be orange (obviously for the non-colorblind it is orange).

With all of that said, I can (if I'm looking for it) tell the difference between these colors fairly easily, and since that's the point (not whether it's blue/pink/purple/whatever) I don't think there's anything to adjust here (at least not for my particular brand/degree of colorblindness).

3 Likes
7

Same as others have commented, I have a mild red/green colour vision deficiency which does not affect my daily life much, other than that it often makes reading coloured line graphs difficult.

Without getting into what the individual colours look like to me, on my current screen the orange of type aliases and the red of structs could be a bit more pronounced. Similarly I can tell the difference between function names and primitives, but it doesn't stand out to me. That said, I can see the difference between structs and type aliases and enums no problem.

I think using more saturated colours (not sure if it's the right term, the red and purple in this theme work well for me) would be good. Make the colours stand out a little more. See for example: colorblind-syntax All the colours on that webpage are easy to differentiate for me

3 Likes
8

Wow, I can't really see a difference between the color of the Results, I must be more color blind than I thought :stuck_out_tongue:

Perhaps adding a light underline, dotted underline, or italics in addition to changing colors would make differences more recognizable for everyone, not just color blind folks? That's the usual design suggestion that I've heard before: don't rely on color to differentiate alone, also have a symbol or something. It's worth pointing out that there are many kinds of color blindness which affect completely different sets of colors, so tweaking the color set will likely only end up serving one kind of color blindness.

5 Likes
9

Ooh, thanks for the link! This could be a really nice reference if we decide to tweak the colors.

Very good point. Though, another way around it would be to suggest to people not to rely on module paths to differentiate type names if you expect them to mingle in the same position. >_> I could see adding italics to type aliases, but I wouldn't know another good decoration to use to distinguish enums from structs, since they both also can appear in the same position. Using something like underlining to distinguish could get a little noisy for something that even full-color-vision people have missed. (Technically we could consider decorations for primitives, but since they're limited to a much smaller set I think we can let them remain undecorated or share a decoration with one of the other sets.)

@ everyone discussing the name of the color for function names: I admit I spent a moment bikeshedding that color name before posting this. I probably also spoiled the effect by going into the browser inspector and pulling the color out by itself to see what hue it actually had. I'll agree that in context of everything else it's definitely not as strong a color as the other examples here.

10

The color scheme used by Rustdoc uses some very desaturated colors in spots. I'm not even colorblind, and I have trouble deciding which word to assign some of them (the best description I have for function names is "clay colored"; it looks more brown than pink).

3 Likes
11

Feel like I'm rehashing things that have already been said but here goes!

I have moderate to severe colour blindness (red/green) that progressively gets worse with age. It was much less severe when I was younger so I do have colour references in my head of what it kind of should look like and vaguely remember. I already had a night time driving restriction but it has gotten to the point I've had to change a lot of things that are rather benign (e.g. my Rubik's cube) so it has an impact on my life.

Solid grey.

Blue. Definitely feels weird as I kind of recall purple and not seeing that is a bit weird.

They're distinguishable but it's kind of like with me attempting to solve a cube that isn't configured for me: I'm constantly double checking to make sure the shade is slightly lighter or darker than the rest (and oftentimes it looks exactly the same).

I think an issue a lot of folks have when designing for colourblind folks in general is that they go straight for blues/purples thinking that's the safest route not realising it can be confused (especially 'lavender'). High contrasting colours is the best option when using multiple colours.

Looking at the overall colours here you can differentiate them but if you're learning and have only been exposed to one (e.g. the Results) and then only see the second example separately that would make sense to the confusion. For that example specifically I'd definitely err on the side of caution and use different colours for the two different results.

It has already been said but relying on just colour isn't preferable but yups!

5 Likes
12

https://github.com/rust-lang/rust/pull/39697

4 Likes
13

I'd like to emphasize this more.

There are many different types of color-blindness. People probably already know that the human eye has 3 kinds of cones: Red, Green & Blue.

Well, color-blind people (such as myself), simply have one or more kind of code that is either not working properly (to varying degrees) or not working at all.

In extreme cases, I personally know someone who is completely color-blind, as in none of the 3 kinds of cones work at all in his eyes. He sees life in nuances of grey (night vision mode).

So what to do?

  1. Stop relying entirely on color, and use other decorations on top, a mix of different styles of underlining could work for example (dotted, slashed, dot+slash alternating)
  2. Provide the full type definition "preview" without having to click through; beyond color-blind people, some just have impaired visions and use screen-readers: any style information is lost to them. I was wondering if abusing the <abbr> tag could be useful here... (screen-readers may not support css tricks such as "cursor:help")
  3. Simply do not care.

Note that even though I am color-blind, I would not mind if option (3) was picked. I find knowing that a type is an enum and not a struct, or a type and not struct, of little value. If I only need to pass it around, then I don't care, and if I need to interact with it, I'll have to look-up what operations are available.

4 Likes
14

Generally speaking, I agree here. I'm trying to gather samples and opinions of people with the most common kind(s) of colorblindness, in case we should alter anything. I'm mainly working off a couple cases of confusion I've seen, where people didn't notice that a Result with one type parameter (io::Result) was different from the regular Result, with two (result::Result). Anything else is mainly decoration, but this specific precedent made me wonder about the ability to differentiate between the colors.

1 Like
15

This is the only case I care about differentiating between at a glance. Right now, I have to hover over the link and check the URL to double check which Result I am dealing with.

2 Likes
16

A friend of mine is colorblind (can't remember which kind specifically).

He can distinguish all of them. The hardest one is the "dusky pink" for function names (admittedly, it's not the best for me either). He described it as "dark grey".

2 Likes
17

I don't have color blindness, but the last two examples, Box and Result, the colors look essentially the same for me. Function name color, I would never describe it as pink, looks more like brown.

18

Just like @withoutboats I have mild red/green also. Everything within tons of red and green is difficult for me to identify. In summary the variations of green and red are different colors, example: light green is like yellow, as well as some tons of pink are sometimes grey. The light also has influence on the perception of the colors, it changes the colors significantly to me (I think that for all colorblind people).
Green and orange are not a good fit since orange has green in its composition. If you want to denote that something is very different from another I would avoid colors with this kind of mix since it would confuse some colorblind depending on its deficiency. (some people can't see tons of green alone, some red, some red and green and the proper colorblind can see only variants of grey tons).
On Coblis (Coblis — Color Blindness Simulator – Colblindor) you can have a hint of what is to be a clorblind. :slight_smile:
As you can see for the simulation that there's several types and categories to identify colorblindness.

Another example, the function names that is on dusky pink are grey to me. The Option, that is an enum, I can see that it is green because it is written on the label that it is green, otherwise I would shoot that it was orange or grey, as well as the Result, that is orange and seems pretty GREEN to me. (but since I colorblind for 33 years I have learned how to identify colors that I'm confused, generally I compare it with other colors, but it does not work with every color)

1 Like
19

Maybe you are colorblind and don't know. I discovered that I have color deficiency after working with a colorblind. I found out that I had difficulty to identifying the same colors that him. :slight_smile:
Some people have very light colorblindness and live their life without noticing. :slight_smile:

20

I think that is more common to see people with red deficiency than others, blue for example is very rare. I standard would be avoiding tons of red on the docs :stuck_out_tongue:

One think that the colorblinds are better (far better) is identifying camouflage, hunting and so on. On the army (at least on Brazil) all colorblinds have special positions since we can see the camouflage. The first homo-sapiens hunters are supposed to be colorblind, since it was easier to identify a prey or a predator among the trees and bushes then to identify the fresh fruits to be collected. :slight_smile:
(It is a real theory)