40

I don't know if it's just me, but I've noticed that if a Hyperlink is posted in a question, it's extremely difficult to differentiate it from normal text, considering the blue is so close to the black color. Has anyone else noticed this? The following are two screenshots, one of a visited hyperlink, one of a non-visited hyperlink:

Non-Visited link:

Versus

A visited link:

enter image description here

7
  • 5
    I have also noticed this. It seems as a workaround a few people have taken to bolding links in their posts so they stand out more
    – Robotnik Mod
    Jul 7, 2016 at 1:21
  • 1
    It looks perfectly fine to me. Blue on black is the browser default anyway, and if anything SE's color scheme should offer a little more contrast than that.
    – Private Pansy
    Jul 7, 2016 at 2:02
  • 2
    @PrivatePansy - specifically, visited links for me are hard to differentiate from the black, because they are darker. @ David - can you include an example screenshot?
    – Robotnik Mod
    Jul 7, 2016 at 2:05
  • Agreed, visited links are terrible @Robotnik and yes, adding screenshot now
    – David
    Jul 7, 2016 at 2:37
  • 3
    Yeah, I have been bolding my links for a while because of the problem you mention. My main worry is that people won't realise a word actually links to useful background info.
    – user101016
    Jul 7, 2016 at 9:13
  • Related: Visited links are invisible on new profile and Visited-links are too low-contrast
    – user101016
    Jul 7, 2016 at 11:29
  • 1
    This has messed me up when writing an answer a few times. I look at the body and think I forgot to put the link in, since I've visited the page already, and visited links are almost indistinguishable from plain text.
    – DCShannon
    Jul 7, 2016 at 20:43

2 Answers 2

Reset to default
17

To demonstrate this, I inspected the source to get the hex codes for the colors. The visited link is #114475, and the plain text is #3b4045. If you run a contrast on these two colors you get a contrast difference of 1.05:1, which would fail WCAG 2.0 AA and AAA requirements if they were foreground and background colors for both normal and large text. WCAG 2.0 AA and AAA requirements can be seen here, and you can also test color contrasts there as well. This is a contrast test run on the two colors.

So, if you can barely tell what the difference is when it is foreground/background colors, I'm not sure how we are supposed to tell when it is two different texts next to each other. I think something like this would be much better, though the color (#7b14cf) could be different.

5
  • 1
    That's a little disingenuous. You can't just say that a choice in two foreground colours is bad because it would fail the AA requirements for foreground / background. As a(n admittedly contrived) example: this fails the test, but the two can be clearly distinguished when used as two separate foreground colours.
    – Schism
    Jul 9, 2016 at 2:51
  • 13
    @Schism to you they may look fine, but to others with color blindness it might not. Though it is a fair point that comparing foreground/background contrast is probably not the best method, but in my opinion all different colors used should be easily identifiable from each other. I am looking into more standards for accessibility
    – Dragonrage Mod
    Jul 9, 2016 at 2:56
  • I don't disagree about your intent; I'm just pointing out that those standards are great for foreground / background, but not necessarily foreground/foreground: foreground / background requires that you be able to read information, but foreground / foreground only requires you to be able to distinguish between them, so the required contrast doesn't need to be as high. tl;dr I think that using a contrast calculator is perfectly fine, but I don't think two foreground colours need to adhere to WCAG requirements for foreground / background contrast.
    – Schism
    Jul 9, 2016 at 22:33
  • @Schism fwiw, in the second example, I had to look hard to be able to distinguish the colours. To me they don't offer much contrast.
    – Tim Malone
    Jul 19, 2016 at 23:06
  • @TimMalone Acknowledged. I did run the image through a few colour-blindness simulators, and it seemed fine to me, but I guess it just highlights the inadequacy of software simulations.
    – Schism
    Jul 20, 2016 at 6:54
6

Update (Aug 2020): Given the recent addition of by a Stack Exchange Staff member - I guess SE considers the following change to be the official solution to this issue:

With the rollout of the new Stack Exchange Network-wide themes, hyperlinks now appear with underlines, making the links more visually distinctive:

Example of plain and visited links
Screenshot from How to determine whether Attack or Strength will train faster?, December 2018

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .