I don’t know what this web page looks like in your web browser, but I do know that, if it looks terrible, it’s your fault.
How do I know this? Consider the BODY start tag that appears in
this file: <body>. Note that it does not have
any specified values for bgcolor, text, link, alink, or vlink, which are the body color
attributes defined in HTML 3.2. Since I don’t
specify any color values, your web browser uses your default page
color settings. And while most people leave these settings
unchanged, people have been known to change them.
Not only do individual defaults differ: different browsers ship
with different settings for these defaults. For instance, the
default background in Netscape 4 is #c0c0c0, whereas it’s white
in IE.
Lots and lots of web pages only specify some of the colors. By doing so, the other colors are drawn from the user’s defaults.
This is problematic, because the colors you actually specified might combine horribly with the user’s defined colors. For instance, consider a web page which explicitly sets it’s background color to white, but leaves the rest of the colors unspecified. Now consider a user whose default colors are given in this table:
| User Colors | |
|---|---|
bgcolor | Black |
text | White |
link | Yellow |
alink | White |
vlink | Red |
Given this, the web page will be rendered with the following colors:
| Rendered Colors | |
|---|---|
bgcolor | White |
text | White |
link | Yellow |
alink | White |
vlink | Red |
Reading white text on a white background is rather difficult for most human beings. What is the relevant principle of web design to learn from this?
When designing a web site, choose from one of the following two options:
There are no other acceptable options.
This principle applies to the use of stylesheets as well; I
targeted HTML 3.2 <body> color attributes because
90% of the time I encounter this error, it is due to such HTML.