Hacker News Reader

>Finally, we can choose colors which are not strictly grey. The HN background is a rather usable 244/244/235 - not far outside of light grey, but tan enough to provide more contrast than the pure brightness

The key for HN readability is that the foreground text color is #000 -- pure black. (Pressing F12 in the web browser shows css style ".c00 {color = #000000;}").

Like dredmorbius previously mentioned, shifting the background from pure white to a subtle shade of tan doesn't kill readability when you keep the text at #000. It's when designers make the text itself a light gray that makes it unreadable.

Largely agreed - my second bullet was about only ever shifting one of text/background. I'm not certain that darkening backgrounds is more readable than lightening text, but it wouldn't surprise me.

And in a broader design sense, darkening backgrounds is better for the sort of dark room reading Flux helps with, so it seems obviously preferable on that level.

I actually custom style HN just a little because I find the solid black text to be way to stark on the background. I use #222 instead and find the experience a lot more pleasant.

I think this is a preferences thing. For me, solid black text almost always looks jarring, and is almost universally a worse reading experience than a dark grey.

Shifting the background colour, slightly, tends to be vastly more readable than screwing with the foreground colour:

https://codepen.io/dredmorbius/full/KpMqqB/

It also far more closely approaches the appearance of print on somewhat aged paper:

https://archive.org/stream/commercialismjou00holtuoft#page/5...

This is a great point. I realized that changing both colors, like Apple did, was awful. I underestimated the degree to which changing background feels better than changing text.

Honestly, I don't think "too much contrast" is my biggest problem with black-on-white. It's the sea of #FFF that's unpleasant (with or without text), so something like HN's ~#EEE background feels way better to look at.

Actually, the link you showed has the colors

#16110b and #e3d2ae for text and background.

I might just use that in future websites.

The Codepen actually shows what I use and prefer. The IA book example was just to show a typical example. The yellowing there is a bit too strong IMO.

You might poke around and look at a number of books and see what particular shadings after actually having read content you prefer.

It's not aged paper, necessarily; look at any well-made book (excluding glossy picture books) and the paper will be stable and opaque but not bright.

I'm spending a lot of time going through Internet Archive books (the one indicated has relevance to the whole advertising-supported nature of the Internet as well, I submitted it as an HN article earlier today). So I'm somewhat attuned to the visual appearance.

Different paper ages differently, and I believe that much of the highly-yellowed paper is high-pulp content, as opposed to archival-quality, acid-free rag. The degree of yellowing can vary, and in some cases it's rather more than I'd prefer for comfortable reading. In modest amounts, it's not bad though.

Yes, my intent was to emphasize that lower-than-maximum contrast through paper (and not grey ink) is typical of most high-quality printing, to avoid giving the impression that it implies age, wear, or low quality (pulp/newsprint), which designers probably want to avoid.

(There was an 18th-century fad for extremely high contrast, but fortunately it passed. And current printer/copy paper is excessively bright (often even using fluorescent brighteners), but no one considers photocopies to be the height of good taste.)

From what I've gathered from some (admittedly not in depth) research, the effective contrast of ink on paper for books tends to be around 12:1, and for long form text that tends to be what I shoot for. I find the as-high-as-you-can go contrast of pure black on pure white to be a (tiny) bit of a strain when I'm reading a sufficiently long article.

I see these "all the text on the web is a sea of grey" articles come up every so often, and I agree that the kind of bananas low contrast sites that they point to are problematic. But when I look around, these honestly seem to be outliers. Sites like the New York Times, Washington Post, The AV Club, CNN, and so on tend to be in that 12:1 contrast range or even higher. There are exceptions--Vox is only around 7.5:1 contrast ratio (which surprised me, since I find it pretty readable, but they're using big text in a highly legible typeface). But the worst offenders I find often seem to be sites that I suspect are driven more by engineering departments than designers: Google App Engine and Apple's system documentation are the big examples in this article, for instance. (Apple's consumer-facing web sites tend toward noticeably higher contrast type than the linked fiasco.)

I find a white background (for commonly used black text) to be quite harsh on my eyes and don't like it much. So when I had to redesign the UI for an application, I went from a pure white background to a more grayish background (a bit further from #ffffff, in the #eX series), which had a good level of contrast with the text color (a very dark blue) while not appearing blinding.

Contrast is very important for all (and also from the accessibility point of view), and the article shows some really awful contrast levels in the screenshots.

> Subjective though it may be, there are a lot of people who find black-on-white unpleasant to look at

Like staring at a light-bulb. I prefer a light grey as a background.

if you find black on white unpleasant to look at that likely means your monitor is too bright.

I think it's more complex than that (although most monitors are too bright).

For pure black on pure white, my 'pleasant' brightness is somewhat lower than my 'easy to read' brightness. I'm reading in a space with high ambient light, and the contrast stays obnoxious until it becomes difficult to use. (I wish E-ink monitors were a thing.)

For something like HN's color scheme, or a strong Flux setting, I can find a comfortable middle ground of readable and relaxing. I'm not sure why, but adding a bit of tan/yellow to the background makes a huge difference for me.