31

I'm not a UX expert, but in my experience, visited links are usually styled with a "more dull" color. With this new dark mode, it seems to be quite the opposite.

In the CSS,

  • --theme-link-color is var(--blue-600) (#33a7ff)
  • --theme-link-color-visited is var(--blue-700) (#81c5f8)

Here are some examples:

Home Page:

Home Page

Sidebar:

Sidebar

Profile Activity (Votes, Responses, All actions):*

Profile Activity tabs

In all the examples above, it's always the "brighter color" that is used to indicate visited links and the "more dull" color is used to indicate non-visited links. That seems counterintuitive to me and I'm mistaking them all the time. I think it's more obvious in the second and third examples. I used to immediately spot newly featured Meta posts that I haven't visited. Well, not anymore.


(Feel free to skip this part)

For comparison, this is how it looked like with a Chrome extension that I used before the SO Dark Mode was released:

Home Page using a Chrome extension

..and this is how Reddit, for example, handles visited links in dark mode:

Reddit


* There's also the inconsistency issue with this one. It uses this styling only for the last 3 tabs (under Profile > Activity). The remaining tabs use the same styling that's used for the Home Page.

5
  • 1
    Even in light mode it’s really difficult to tell visited links apart from non-visited ones, and to interpret which is which, especially on MSE. Commented Apr 19, 2020 at 18:59
  • 8
    I'm voting to reopen this question because the announcement post has been locked for a long time and we've been encouraged to post related FRs and bug reports as separate questions.
    – 41686d6564
    Commented Jul 21, 2021 at 5:48
  • 1
    Using light mode, I just realized reading this question and the first comment that there are different colors for visited and non-visited. It's very subtle to say the least Commented Jul 21, 2021 at 8:57
  • @Sleepwalker Haven't used light mode in a very long time but if I remember correctly, there used to be a distinction between visited and non-visited links. It still exists here, on meta (though, not so obvious). Edit: apparently, it's still there on the main site too (light mode) but it's very difficult to notice (making it useless). Maybe this is caused by the recent change to fonts.
    – 41686d6564
    Commented Jul 21, 2021 at 10:25
  • 1
    Workaround: Override the unvisited and visited link colours locally (at least Firefox and Chrome). I use a:visited { color:OrangeRed!important; } (and don't override the unvisited one) - it works fine for both dark mode and other sites than Stack Overflow. (Yes, it is the opposite effect, but you get the point.) Commented Jul 21, 2021 at 15:20

1 Answer 1

3

This has been fixed with changes that went out as described on this answer for MSE. For visited links we improved the visual distinction, visited links will be change from blue to purple-500 (and purple-600 when visited and hovering

For text links with adjacent static text will require an underline in addition to being blue. Finding and updating all links within a paragraph is no small task and will take time. We’re pushed out a change to our Stacks Design System that should catch a large amount of these links. Links within a paragraph that have the .s-link class applied will automatically get an underline.

You must log in to answer this question.

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