In the early days of the internet, there was some real butt ugly websites floating around…
If you don’t know what I mean, just Google: ugly websites.
Go ahead. I’ll wait. Or here.
Click this link.
Now, I know you aren’t doing THAT. lol.
But only because Medium has built in constraints.
They won’t let us go full-on MySpace.
Trust me, without constraints, MySpace design skillz would rise from the dead to haunt us all.
By now you’ve probably noticed Medium has some new design options.
— We can add our own headers.
— Choose fonts.
— Even background colors.
Ahhh. Background colors!! Therein lies the problem.
Remember this optical illusion?
Humor me. Especially if you don’t know this one.
There are 4 dots in the middle of this image. Stare at the 4 dots and slowly count to 40. Then look at a white wall.
Got it? Okay. Now, stare at the 4 tiny dots and start counting.
1 banana, 2 banana, 3 banana… up to 40.
Sorry about that!
lol. Yes, it will go away. Just look away from the screen for a few minutes.
That’s kind of what you’re doing to your readers when you put white text on a dark background. They’re going to see reflections if they read you too long.
Not of Jesus, of course. But still.
It exhausts their eyes and brain.
Now let’s talk about colors on a screen…
Most people think it’s all about aesthetics. As in, what color do you like? Nope, that’s for t-shirts. Print medium, maybe even.
Once you’re talking screens, it helps to understand how color properties and light work with the human eye.
At least, if you want people to read your stuff.
Sunglasses in winter…
Ever noticed that people sometimes wear sunglasses in winter? That’s because when there is reflection on the color white, our irises don’t need to open as wide to absorb the white light that’s reflected.
When you use dark type on a light background, it’s easy to read. Know why? Because the dark text absorbs wavelengths instead of reflecting them.
White text on a dark background, or “dark mode,” makes the eye work harder. The iris needs to open wider. It has to strain.
But it’s even more than that. When you put a light color on a dark background, the white letters appear to bleed a little. They look a bit fuzzy around the edges after a while.
It’s called the halation effect. It causes eye strain if you stare at it too long.
Like a 7 minute read. Know what I’m saying?
Unless you write porn…
There is a time when white text on a dark background is easier to read.
In the dark.
So if you’re writing smut or porn that people are likely reading with the lights out, then go ahead and use white text on a dark background.
It’ll be real easy for them to read.
But otherwise? If you want people to do a fair amount of reading, like a 5 or 7 minute read or more? Stick to light mode.
It would be cool if Medium gave us a day/night link so we could let our readers flip the colors if they’re reading in the dark. But they don’t. So we have to work with what we have.
Safe to assume “most” people aren’t reading your writing with the lights out.
Best colors for reading on a monitor…
Incidentally, while black text on a white background is easier to read than white on black or dark backgrounds, and causes less eye strain, black on white is not optimal.
The optimal colors for least eye strain reading on a monitor are black or dark text on a light but not white background.
— The palest grey — #F0F0F0 or #F2F3F4 make a great background.
— Pair it with text in black or a dark grey like #111111 or #212121
Heck, you can even mess around with light and dark colors like you’re playing with paint chips at Benjamin Moore. Yay, linen white with charcoal.
When you use dark but not black text on a light but not white background, what you get is high contrast and low reflection. That’s the absolute easiest on the eyes and doesn’t make the iris work to exhaustion.
Which makes it easier for people to read long copy.
Which is what you want, right?
My eyes thank you!
“Simplicity, carried to an extreme, becomes elegance.”
— Jon Franklin