Set the Body Element Background Color Property, Even If It's White
This is a small post on one of the little things that has tripped up web developers for many years. In Windows, the default background color of a web page displayed in Internet Explorer (i.e. the <body> element) is white, and pretty much always has been. The default background color for a web page in all other browsers is also white - but, importantly, that is for different reasons. In Firefox, Chrome, etc, the background is white because that is the default color set by the browser configuration. In Firefox, you can change that in the Tools > Options > Content panel, for example. In IE, however, the page background is white because white is the default setting for the operating system display property governing window backgrounds, and in Windows the browser page background is a window background. In Windows 7 you can change that color in Control Panel > Appearance and Personalization > Personalized > Window Color.
I have long made a habit of altering the Windows display settings in order to change the window background color to something that isn't quite as bright as white, as I find that a mild gray makes for less in the way of eye strain after a day of peering at code and essays. What this means is that for me the default web page background in IE on Windows is that mild gray, not white. Over the years I've lost count of the number of high traffic, mainstream websites I've seen fail to set a CSS property for the background color of the <body> element - MSNBC was one of them for quite some time, for example. When that happens the design appears backed by gray to me, which generally ruins the effect.I'd go so far as to claim that a majority of modern web designs use a white background. White is the first color you see when you open up a web page in a browser in any operating system - assuming you have default display settings, which is the case for most people. So it is perhaps understandable that even experienced teams sometimes fail to set this property for designs with white backgrounds:
body { background-color: #ffffff; }
After all it's white already, right? Well for you it is, perhaps. Not for me.
So what are the lessons here? Firstly, examine all of your assumptions about the characteristics that might be exhibited by various operating systems, browsers, and configuration options: make a point of actually investigating the range of possible options and how they change the playing field for web development. There's a lot of documentation out there, the accumulated experience of an entire generation of web development, so it's not as though you have to start from scratch. Secondly, it seems clear that your favored HTML/CSS boilerplate should include a background color for the <body> element - which is not presently the case for most of the established boilerplates, even the extraordinarily comprehensive ones such as HTML5 Boilerplate.