Hacker News Reader

Comment by brianwillis | Hacker News Reader

As a guy with a light-text-on-a-dark-background blog I've got to ask, is it really that bad? I've always thought that light on dark was easier on the eyes, not harder. This is especially true if you make the font size reasonable, which is something Daring Fireball isn't so great at.

Could those of you whose sight is starting to go comment on this?

View on HN

Overall, the typography on your blog is pretty good. I'd definitely increase the contrast of the text though. Your measure is a little on the long side. A good guideline is to keep it under 80 characters. You're stretching it a bit at 90-ish characters, but you've got plenty of leading, so you can get away with it. If you reduced your measure a bit, you could reduce your leading a bit so your paragraphs would have a more natural density and better vertical rhythm.

http://en.wikipedia.org/wiki/Measure_(typography)

http://en.wikipedia.org/wiki/Leading

Note: You'll notice that CSS line height is not the same as leading, but old habits die hard, and I'm used to referring to it as leading.

http://blog.8thlight.com/chris-peak/2012/12/30/vertical-rhyt...

Thanks for this. It's some pretty insightful stuff.

I'm not in a place where I can make changes right away, but I'll trim back the measure and fiddle with the line height until I find something I'm comfortable with.

I'm not sure about the contrast though. Getting that one right is tough. My first attempt was a burn-your-retinas-out white that was so bright it almost hurt to read. Perhaps I've dialed it down too far.

Contrast needs a boost. #aaa and #ccc text are good for dark backgrounds, #999 is imho too dark.

Seconded; with #999, I it irritates my eyes in a normal office environment. I quickly changed it in the browser, and anything from #AAA to #CCC looked fine.

Marketers like to stick to 65-70 characters for what its worth.

Do you count whitespace in the character count for the measure?

Yes. Measure is the total length of the line. Whitespace adds to the length, so you have to count it.

The problem with dark background sites is that almost every content oriented site that's popular use light backgrounds.

If you spend most of your time looking at a light background then switching to a dark background takes a little bit to adjust to.

It's more of an issue after you read a long article on a dark background, when you switch to a light background then things look weird for a noticeable amount of time.

Typography 101 says that light on dark requires a bigger font weight. It could be that people forget this in the cases where it bothers people.

It's almost an easter egg, but Daring Fireball also supports custom font sizes at the bottom of the site: http://daringfireball.net/preferences/.

Light text on a dark background is fuzzy for me and hurts my eyes due to constantly trying to focus. This guy has an interesting theory about black text absorbing surrounding light while light text reflects it causing blurriness: http://uxmovement.com/content/when-to-use-white-text-on-a-da...

I use f.lux to mitigate the brightness of light backgrounds system wide because it adjusts according to time of day.

My eyesight is pretty good and I still think you need greater contrast on your blog and perhaps a bigger font.

Agreed. I think also reducing the line-height from 175% at that width/font-size might make it a bit more readable ... thinking 125% looks easier on the eyes on my Mac @ 100% zoom + rgb(199, 199, 199)

The measure of his paragraphs is around 90 characters. At that length, 125% line-spacing is way to tight for good readability. I would go 150% at a minimum. The line spacing looks a little sparse at 175%, but it remains very readable.

A problem I found with dark-background sites is that majority of the website use light background with dark text. As a viewer, switching from a dark-background website to a light-background-text can be a little painful, especially after spending a long period of time on the darker page.

Everything being light on dark would fix that. It would be nice if at least everything was reliably switchable.

Depends on the typical and current conditions of the viewer--however few people realize it. Those that do use f.lux or one of the others.

For example, if the viewer sits in an office under 50 florescent lights, dark on light is best (e.g. Excel-jockies). This viewer "can't imagine any other way!" I often wonder how these people survived before Windows.

If instead they are a digital artist in dim lighting (for better color accuracy) then bright white pages will be blinding, "my eyes are bleeding". Ditto the late-night hacker.

Since I'm online day and night I make judicious use of the negative plugin in compiz (Super+N) and turn down screen brightness at night. When on Windows I use f.lux.

For the browser specifically, the invert-lightness bookmarklet is also helpful when a lot of images are involved: https://www.squarefree.com/bookmarklets/color.html

Personally I prefer dark backgrounds and light text and will switch eBook readers, etc, to that setting if they have one. But, not everyone is the same. I'd be interested to see what the most popular preference is.

For me it depends largely on the surrounding lighting conditions. During the day I prefer dark-on-light; in the evenings I prefer light-on-dark. If pressed to choose one I'd go for light-on-dark, because having your retinas exploded by a pure-white background is far worse than having to squint a little to read light-on-dark during the day.

Yeah I'm the same. I usually work in the dark, with the blinds shut and the lights off. Light colored backgrounds can really burn the eyes. I really love the Hacker Vision Chrome extension[1] which inverts the color-scheme of any site you go to and can be easy configured not to run on specific sites.

[1] https://chrome.google.com/webstore/detail/hacker-vision/fomm...

I spend the whole day staring at light on dark text, but generally I find it difficult to read websites that have that setup. It's partly for the reason others have mentioned - changing from one to the other requires some time for my eyes to adjust - but it's aggravated by many sites because there is so much contrast between the text and the background.

I use a variant of Tomorrow Night, and the pastels on moody darks works well, but as things approach white on black, it leaves me needing a lie down

My sight isn't starting to go, but I will say I find the blog much more readable before the custom font got loaded and it still used Verdana (I'm on Windows).

Light on dark can be really hard to read for anyone with a pronounced astigmatism.

The background color bleeds into text dramatically lowering the contrast. On computer displays, black on pure white can cause the same issue to a lesser effect. I find black on a pale color is optimal.

if the blog has good content I usually just copypaste the content in the notepad to read it.

Reply on news.ycombinator.com