ProPhoto - Premium Wordpress Theme for Professional Photographers - Single Column, big pictures - Blog Template

Here’s a quick tip to help you put another little bit of polish on your blog: make sure to match your background color to your background image, if you are using one. Here’s why: If I visit Audra Little’s blog, which looks great by the way, this is what I see:

It looks very lovely with a tasteful, cool looking background image that is bright, funky yellow. But, if I’m visiting her blog for the first time, for about 1-2 seconds, while the background CSS image loads, I can see the default background color grey underneath. It looks like this:

Try it, by visiting her site. Watch the background before the image loads. (Sorry to pick on you Audra! - it’s my fault really, I should have put this in a tutorial or something.) Background colors specified by CSS load immediately (really, they don’t load, they’re just there) as opposed to background images which must be downloaded before they can be displayed.

Therefore, the optimal thing to do is to eyedrop the dominant color in your background image, and set your whole page background to this. In this case, Audra’s site would start out being a flat yellow #FFC300, and then after 1-2 seconds, the yellow image would take its place, subtly but significantly improving the look of the background. This is much better than a gray site that abruptly turns yellow after a second or two.

In case you forgot, to set your background color, simply open your Theme Editor under the “Design” tab (”Presentation” in WP 2.3.3 and earlier) and click on “Stylesheet (style.css)” to edit. Line 30 is where you edit the background color.

This entry was posted on Wednesday, April 9th, 2008 and is filed under Pimp my Blog. You can leave a response, or trackback from your own site.