This frequently exposes some bad design decisions with some webpages out there. Even some of the big players. Take for instance, Livejournal. This screen I’m typing on is properly light on dark, but I had to set my “light” to be about a 70% instead of my normal 100% white. Even though this main editing window is properly light on dark, the rest of the entry fields have a background color set, but no foreground color. So I end up with a ghostly 70% on 100% white effect going. Readable, but not easily.
All from the fact that there’s no foreground color specified in this block of CSS code.
input.text,
textarea.text,
select.select {
margin: 0px 3px 0px 0px;
padding: 2px 2px;
background: #fff url(/img/input-bg.gif) repeat-x 0 -1px;
border: 1px solid #bbb;
border-top: 1px solid #999;
border-left: 1px solid #999;
}
GMail also has this problem. It seems to be even worse because the main text entry area has that attribute set. Ugh! Most of the other stuff has the foreground set, but not the main text entry thingie, and oddly, the “unread” mail lines. The rest of the read mail has the foreground set.
MSN also has this problem in some of its popups. :( Yahoo’s chat windows are similarly lobotomized. Does nobody test their stuff with alternate color schemes?
I know they say a light background is better for the eyes, but I find a dark background to be less blinding when working on the computer in the dark.