the blog goes monochrome
This morning I read a post espousing the benefits of designing in monochrome, which I found through Olga's bookshelf (thanks, by the way!). I found it compelling enough to tinker around with the CSS for my blog, and ended up settling on a monochrome color scheme that I like.
My previous color scheme was white text on black background with pink links (in dark mode). I liked the look of pink on black, but didn't exactly appreciate how drastically the pink links popped out amidst a sea of white text. They were so bright they drew my eyes to them before I could even get to the text they lived in. Going monochrome has solved this problem—now links are a lighter shade of gray than the surrounding text, which, when combined with the traditional underline, lets them stand out slightly but not by too much.
It wasn't until I saw my friend read my blog on his Mac that I realized there was actually a different-looking version of my blog for light mode users, with black text and pink links on a white background. I was shocked. What kind of psychopath uses light mode? (Needless to say, we are no longer friends.)
That traumatic episode reminded me to adjust the light mode (default) settings in CSS today too while cosplaying as a web developer. As it turns out, the shade of pink I was using on the links in light mode flouted Web Content Accessibility Guidelines1 (or WCAG, for short). Changing the pink to black fixed that issue, and I am happy to say that my blog colors now comply with WCAG in both light and dark modes. (At least, I think so. Please do let me know if I am mistaken, though.)
In my gung-ho monochromatization I made all the text and links white (#fff) and the background black (#000) (and vice versa in light mode), only to find the resulting contrast was jarring. My eyes fatigued within minutes. I quickly changed the white and black to less contrasting shades of gray and considered this a lesson learned: just because something passes accessibility guidelines does not mean it is pleasant to use. Black text on white background and white text on black is the gold standard when it comes to accessibility, but a slightly less striking contrast provides for a far superior reading experience.
I'm not sure if I'll stick with this new grayscaled look. I like that it makes my blog look more boring and lets the words do more of the talking, but as with Norma's blog, without color I have no (good) way of distinguishing between visited and unvisited links. (Think blue links turning purple post-click.) This doesn't bother me much, but what do you think? Does it change how you use the web?2
You can find contrast checkers like this all over the web. I used Contraste, which worked like a charm. (EXPERTE.com's accessibility checker tool does that and a whole lot more, too!)↩
According to this stack exchange thread, WCAG doesn't explicitly address visited vs unvisited links, but deciding on a case by case basis seems wise. (I imagine a search engine would be annoying to use without the differentiation, but a blog less so.)↩