Readability Factors and Black Websites
You read black text in newspapers, books, magazines and online. The text is black and the page is white, not gray.
High contrast is good for readability. Grey text on a grey background is not so good for readability.
Black is Cool
But you want to be different and cool. Black is cool. More black is cooler.
Great idea, let’s make the website black. Cool.
Black text on a white background is easy to read.
Well, the black font is now invisible on the black website. Woops!
No problem, we can change the font to white. Now it is highly visible and there is lots of contrast.
Problem Not solved.
Black Background and White Text is not Cool
Here is where I disagree with those who love white text on a black background. Readability just took a huge nose dive.
Don’t believe me?
See is believing.
See the images above, but for a more immersive experience visit the link below and read the text all the way down to the bottom of the page. And then click the “this link” link in the text. Here is the website to make a quick visit to and them come back. http://www.ironicsans.com/owmyeyes/
I suggest that your eyes will send out a sigh of relief after switching from the black background to the white background.
One Effective Solution
If you really want a dark website, produce a dark design. But create a main body text box and place the dark text on a white or even light gray background.
Readability: The ease with which most people can read text.
Readability Factors:
Contrast – difference in brightness and color between the font and the background. Black font on white is best
Line Height – the space between lines of text. Too close and it is hard to read.
Letter Spacing – the space between the letters. Too much and too little makes it harder to read.
Line Length – Number of words on a line. Very common error. Best is 10 to 14 words per line.
Formatting – The position of text relative to surrounding text. Related text near. Unrelated text further away.
To improve the readability of your website consider the benefits of black text on a white background and review your line height, letter spacing, line length and formatting for the best readability possible.
Are you a fan of black websites or do you find them hard to read?
I’ve never had trouble reading white text on black backgrounds. In fact, as someone who’s on the internet constantly, I find it a lot less straining to the eyes. It’s always a relief coming to a black site (especially when using the internet at night).
I think the best solution, personally, is to have two themes that the viewer can toggle: dark on light, light on dark. That way they get the best that fits them.