Starting over

Ever wanted to ditch what you’ve got and start over? I sure have. I’ve been wanting to completely wipe the style sheets clean for this site and start over with a blank slate. Finally jumped off the cliff. Wonder if anyone saw me do it. And if they did, will they understand why?

I didn’t really know where this jump would take me. And to be honest, I still don’t know where I’ll end up. I’m free-falling. It’s a risk. But I’m doing exactly what I’ve been wanting to do. That’s the fun of it, right? I’m trying something new. The old style sheets are gone. So is the familiar design that many people knew. But it’s not really that different…

Why?

Was the old design not working well anymore? Quite the contrary, the old design was working beautifully. After a little over a year and a half, this site’s design is the one thing that I’ve never grown tired of seeing. It’s an odd thing for a designer to be satisfied with one design for so long. Guaranteed, I’ve seen the design more often than anyone else. I was comfortable with it. Too comfortable, in fact. To the point that every time I thought about attempting design changes, I panicked.

I wouldn’t say the previous design is the best thing I’ve ever done. But I think it had become known and respected by a few folks. It was a simple design, highly flexible, and scaled well at many different window sizes. Yet somehow, the design gained a reputation of being an example of attractive design and a polished aesthetic. I started to wonder if I was capable of doing anything better. Self-confidence issues plague most designers now and then, especially if they know the next thing they do might be highly scrutinized. That’s certainly something in the back of my mind. When a bar is already set high, I often wonder if I can raise it any higher.

I knew that if I kept what I had, and tried to evolve it, I would only screw it up. I wanted to get back to the basics, and eliminate some of the complexity in the CSS that had built up over the past year and a half. Maybe I’m reacting to the abundance of over-decoration I’ve been seeing on sites moving toward more and more complex CSS. Design on the web seems to be going the wrong direction. We should be making things easier to understand, not more difficult to use. This design change is my own attempt at an excercise in clarity and simplicity. I literally yanked the old style sheets from Stopdesign, and exposed the raw, unstyled HTML. The CSS file I started with was nothing more than the commented header text I usually include at the top of each file. It was blank otherwise. I started with nothing, and slowly added only the rules I found absolutely necessary. Nothing more.

I didn’t have a very good idea of a direction I wanted to take this design. I don’t normally work like this, preferring instead to use a refined process that produces more predictable results. I only knew I wanted to stay simple. Simpler than the previous design.

I’ve been reworking the Stopdesign logo over the last few months (started before I learned of an almost identical mark from a Swedish company). The logo is an evolution from the previous version, with emphasis on a new form for the mark. The Yin Yang influence is further abstracted. Yet two forms working together to make a whole are still very much a part of the logo. Meta was used as a base for a customized type treatment. (Erik Spiekermann would probably call it a bastardization of his typeface, but I like it.) New business cards will need to be printed soon, but not until after we find new office space.

I didn’t want to plop the new logo into old templates. I wanted something new. I didn’t want to change just for the sake of change, but I didn’t want to step gingerly around the existing design. So starting from scratch seemed like the best idea. Like taking the plunge and not looking back. Flipping that irreversible switch.

Is it permanent?

I don’t know yet. Obviously this is somewhat reversible, should I decide to go back. But there’s something wonderfully refreshing about stripping everything away and starting over from scratch. Will the old design resurface? No idea. As the new tag line states above, change is the only certainty. Hope there were screenshots of the old version somewhere. I’m not sure if the WayBack Machine properly grabs all the linked/imported style sheets for each site.

While looking at Stopdesign’s raw, unformatted HTML, I was reminded how much work and effort I put into crafting the original markup for the site. I liked the markup structure that exists, and saw little reason it needed to change. If anything, I simplified the markup a bit. The nested spans in the navigation are gone, as are the <del> tags that were wrapped around intra-word spaces in some headers. I’ve also removed all instances of Farhner Image Replacement, and any additional elements and classes that technique required.

As I started writing rules into the CSS file, I purposely kept the design extremely simple, avoiding the use of complex tricks or hacks. I paid a lot of attention to little details. I focussed on typography, hierarchy, proportion, and the spacing between and around every element. Color is used sparingly, and only added as necessary. I prevented myself from adding back in extraneous lines and decoration of the previous design. Box model hacks are gone. In place of those, I’m using Tantek’s mid-pass filter to serve up an additional style sheet for IE5/Win.

Do I see carry-overs from the previous design?

Yes, of course. Certain design characteristics of the old version worked well enough that I replicated them with the new version. The design remained liquid, despite heavy temptation on my part to go with a fixed width. Column proportions are basically the same (65/35), though the layout now uses floats for both columns, instead of the absolute positioning from the previous design. The overall width is now pinched ever so slightly, constrained to 90% of the viewport width. At the last minute, I ended up reusing the thin, repeating photographic imagery in the header, mainly to create a connection with the previous design.

Incidentally, I have a strong affinity for all those images I’ve been using in the header of each section. They come from pictures I’ve taken in various cities over the past couple years. The locations represented in those headers include San Francisco, Miami, Vancouver, Kauai’i, Detroit, Madrid, Barcelona, Washington D.C., and San Diego. I’m not sure if the same images will stay, but I have no reason to get rid of them any time soon. Perhaps they’ll be updated with imagery from the additional cities I’ll be visiting this year.

What Exists So Far

The design here is the result of about a half-day’s work so far. From absolutely no style, to this. There may still be a few rough edges throughout certain portions of the site. I’ll get to them as I can. The Portfolio will certainly need additional attention at some point, as may other pages or sections.

I’ve restricted the type specs to two fonts: Verdana for body text, and Trebuchet for headings and special copy. (Yes, Trebuchet. In defiance of Andrei’s tongue-in-cheek request that it never be used again. I know, he was slamming it’s use for body copy. I actually think Trebuchet is nice alternative, especially when presented as uppercased, letter-spaced titles.) Prior to this, Stopdesign used Georgia for accent type. But the serif face started to seem pretentious when used on Stopdesign.

Most everything is basically in the same (or similar) place as it was in the previous design. So there’s nothing new to learn. It’s just a new look. Whether the new direction looks like a gradual evolution, or a radical departure from what existed before, I’m not sure. I see all the similarities with the previous design, so I see it as an evolution. Others may associate the previous design with strong background colors, and lots of structural rules that framed the design. Regardless, I’d like to keep this design as minimal as possible for a little while. I like what I see when I pare a design down to the essentials. After all, I firmly believe the presence of design should simplify our everyday lives, not complicate them.

Where will it go from here? Who knows?