10

Is our new font colour used for question titles in the questions list on ELL too light?

I am aware from teaching experience that light pastelly colours can be particularly difficult for readers with even very slight seeing difficulties to read easily. Any thoughts?

Please upvote if you agree. It may help in terms of leverage with a view to getting it changed.

11
  • 4
    It is. I also would like a different font so I could differentiate between |, l, and I more easily. The one on chem.SE is rather cool.
    – M.A.R.
    Feb 29, 2016 at 18:59
  • 3
    I would just say people with poor eyesight. There is no point bringing age into this.
    – user3169
    Mar 1, 2016 at 4:31
  • 1
    Perhaps we should have requested/should request a different typeface with thicker strokes and more distinct glyphs. Most SE sites use Helvetica Neue/Arial. Most with serif typefaces use Georgia. But there are exceptions like Ubuntu (Ubuntu), Sharepoint (Segoe UI), Unix/Linux (Liberation Serif), TeX (Lucida Grande), Magento and Android (Roboto), Code Review and Cryptography (Open Sans), SalesForce (PT Sans), and Christianity (Lusitana). I'm partial to Segoe UI. But I know that any typeface change would be far from trivial.
    – choster
    Mar 1, 2016 at 15:59
  • 2
    @choster I did mention the font when the design was first shown to us, but perhaps I didn't ask emphatically enough. EL&U is so much easier to read. As a developer, I'm somewhat annoyed that there wasn't some requirements gathering discussions with us before the site design was too far underway. We are stakeholders here as well as the folks running the Stake Exchange network.
    – ColleenV
    Mar 1, 2016 at 17:20
  • @ColleenV Have you upvoted, because I think this might be helpful in terms of getting it changed. Mar 1, 2016 at 17:56
  • I have up-voted, but I'm also concerned about the font being used as well as the color. Legibility is only part of readability.
    – ColleenV
    Mar 1, 2016 at 18:02
  • 1
    I think the font discussion is useful but should probably go in a separate meta post. Then we can talk about font details like making sure we have IPA support over there.
    – user230
    Mar 2, 2016 at 2:01
  • 1
    I found that the search results still have blue titles when I was looking for titles with certain words in them to check the legibility. They seem quite a bit easier to read.
    – ColleenV
    Mar 2, 2016 at 19:49
  • You don't need to have "poor" eyesight to have the color of a font be a problem. You need only have to spend your entire day in front of a computer monitor; subtle things like inadequate text-contrast and inadquate font-sharpness can have a negative synergetic effect and produce eye-strain. The sub-pixel font-rendering capabilities of modern operating systems work least well with pastels. Pastel-against-pastel is a double whammy. See the link to the Gibson Research website that I left in a comment to choster's answer below for some great info on this technology.
    – TimR
    Mar 9, 2016 at 19:40
  • 1
    I personally think the overall design is good, though, personally, I would be happier if the overall color is a bit darker...
    – user17814
    Mar 13, 2016 at 1:20
  • @KentaroTomono Yes, I agree, the design is very good. It's just a small (but important) problem for people with seeing difficulties Apr 6, 2016 at 23:13

1 Answer 1

5

For what it's worth, using the WebAIM Contrast Checker to compare #31aa9a (the unread question text title color) and the white background returns a contrast ratio of 2.86:1. This narrowly fails WCAG 2.0 level AA guidelines for headlines.

That said, darkening it to meet the standard of 3:1 doesn't change the color all that much: comparison of existing and darkened hyperlink colors

Moreover, this contrast ratio is comparable to that of various other sites; in fact, Bicycles is the site where I personally find the text most faded. I think the difference here is that the hyperlink color is so similar to the background color and image, and thus may wash out a bit.

Increasing the stroke width makes the text stand out more, but a standard bold weight of 700 is on the dramatic side— this may be why so few Stacks use bold for question titles, e.g. GameDev and Photography. It introduces an incongruity between the fatter letterforms of the headlines and the lower x-heights of the font reflected in the logo.

boldfaced hyperlink

As I noted in a comment, one might argue for using a different typeface with thicker strokes, though this would be a non-trivial change to the design. Here are a couple more samples using Roboto and Georgia, against the same image as above:

Roboto

Georgia

comparison of existing and darkened hyperlink colors

5
  • 1
    I'm not really thinking about font weight. I thought something serif would look nicer (and more professional?).
    – M.A.R.
    Mar 2, 2016 at 11:10
  • I can live with the fonts as-is, but, if we were going to make a change, I like that Roboto option.
    – J.R. Mod
    Mar 2, 2016 at 19:04
  • I find the bold weight of 700 dark enough against the background to avoid strain, and find the serif font of #2 above more legible than the sans-serif. When I look at the font magnified (Windows 7), it is comprised of a variety of colors. Microsoft's sub-pixel font rendering, invented elsewhere? grc.com/ct/ctwhat.htm
    – TimR
    Mar 9, 2016 at 15:53
  • Quoting Steve Gibson: "As we've seen, the success of sub-pixel rendering depends upon using part of an adjacent pixel to extend an existing pattern of sub-pixels which the eye perceives as a slightly larger white or black pixel. While this approach can also be employed with low-saturation (pastel) colors, it will always be most effective when displaying high contrast white and black images. Dark colored text on a white background will be effective, as would white text on a dark colored background. But black & white best shows off what this technology can do." [emphasis mine]
    – TimR
    Mar 9, 2016 at 15:56
  • Setting the contrast ratio to 4.5:1 improves the legibility considerably. Jun 26, 2018 at 19:37

You must log in to answer this question.

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