Textured Backgrounds

This tip is so easy to implement (and avoid) that it’s almost frightening how often we encounter it. We’re talking about those textured or graphic backgrounds on websites that make the content virtually impossible to read. Usually, it’s a field of stars, or a cloudy/blue sky, or flowers, or even bricks! The image is wallpapered onto the website pages, and the content becomes unreadable because the text gets lost in the colors of the graphic. Light or dark text doesn’t seem to matter, since either one gets swallowed up by the wallpaper.

The solution is simple – don’t use an image in the background of your web pages. Or, if you must, make sure your text is readable on top of the wallpaper. Some images won’t work, as is, no matter what color text you try. This is because the image itself has so much contrast within its colors – they’re all over the spectrum.

If you want to use an image as a background, either fade it out, to the point where it becomes a watermark, or darken it to where it’s almost a shadow of itself. This created a low contrast image, and then you can find a text color that complements the low-contract background (if the image is faded to white, a dark color text will usually work, and vice verse).