Introducing Bleached

Ever wanted to ditch what you’ve got and start over? No, wait a minute. This sounds like a broken record.

Ahem. Let’s try that again.

Ever wondered what your site would look like devoid of most of its color and imagery? Bleach the entire design, remove the saturation and leave behind the basic visual structure on a stark white background? Sure, some sites already use a white background for their design. But Stopdesign has been filled with deep colors and prominent header images since I launched this design a few months ago.

How ’bout we strip away all that decoration and atmosphere? Temporarily. There’s something about looking at a design without all the extra layering of color and fancy graphic work. It allows one to see how much the basic form, structure, and proportions speak for themselves.

Or not, in some cases. Often, color and imagery is overtly used to disguise bad design. Take away color and images, and some designs fall apart. I wanted to prove to myself that this wasn’t the case with Stopdesign.

Nothing about the design changed position — aside from the slight adjustment I snuck in on the home page yesterday, giving more emphasis to the latest entry. Those who remember and liked v2.5 of Stopdesign, where I really did “start over” will note some similarities with this version.

(Ooh, hey, what was that little 2.5 link he just slipped in there? What? An archived version of a prior design? I didn’t know that existed. Hey, wonder what happens if I change the URL to see if v2 works? Whoah, he kept that one too! So, did he actually have a v1 design? Ouch, nice table-based layout!)

Bleached was a small challenge for me, and an excuse to further separate the function of different style sheets. One to control the basic layout, visual structure, and common design elements. Another to pump in color and imagery. With the advance prep work in place, the only change needed to switch to Bleached was to yank the @import for the color style sheet. When I want to return to the full-color design, I’ll simply add it back in.

I’ve been using a separate color.css file to control section-based colors for a while now (something I started playing with on Wired News).

But unlike Wired, until today, if you pulled out Stopdesign’s color style sheet, you would have been left with a color scheme that looked like the home page color scheme, since that’s the page I used to start authoring the CSS for this design. For Wired, I actually created a grayscale version of the design as a base. Then alternative color style sheets are added to create each day’s color scheme. They’ve never used the grayscale version. But it’s there, just in case.

And now, a bleached version of Stopdesign exists as a base. So poke around a little. Explore the untainted space. And if you miss the color and pretty pictures of the unbleached design, don’t worry. This isn’t a permanent change. If you do like it, don’t worry about it’s lack of permanence. A style-switcher will make it’s way onto Stopdesign soon, allowing you to choose whether you want the full technicolor experience or not.

The real fun will be my next challenge with this site: Liquid Bleach.