Brainstorms and Raves

Notes on Web Design, Development, Standards, Typography, Music, and More

Fri

23

NOV

2001

When is it Time for a Redesign?

My Web site design business, SKDesigns, had its 5-year anniversary in August. I should have had a party! I’d hoped to have a new design up and running then (for reasons that I’ll share below), but didn’t quite make it.

SKDesigns screenshot, new site design So a few months later I’ve finally finished the latest version of SKDesigns. I’ve been asked to share my journey through the redesign, so here’s a nutshell account.

In the Old Days . . . (Why a Redesign was Overdue)

My previous design was over 2-1/2 years old and was built when Netscape 4.x browsers were still a major contender with Internet Explorer. Geez, remember those days?!

Because of that time period, the old design relied far more heavily on tables for layouts than I use now, for example, and was also originally built using font tags, not CSS. That soon changed, though.

SKDesigns screenshot, old site designOver time I made many changes to the site, the first about 2 years ago converting the font tags to using CSS via an external style sheet. That was a major shift that simplified the maintenance of the site more than anything else and has saved countless hours, not to mention improved download times from less markup on the pages. I also added JavaScript mouseovers to the navigation since I had (and still have) clients very interested in this feature. More recently I converted the site from HTML 4.01 to XHTML 1.0. I’ve updated the content regularly also.

Despite all those rather significant improvements, the site was still no longer sufficient for what I envisioned as my business site, especially with 2002 drawing near. It’s important to me to be forward thinking and have my work also reflect that philosophy.

I’m also an advocate of the latest W3C recommendations and the Web Standards Project, and I want my own business site to be more reflective of that philosophy’s current trends than the old design represented.

Recognizing the New By Keeping Some of the Old

My new design follows the same core color palette, although I expanded it this time from navy, bronze, light gray and white to several shades of blue, several shades of bronze, along with light gray and white.

While much of the site architecture and some of the content remained intact with only minor updating, I reorganized areas, too, streamlining and eliminating extraneous content as I went along.

People who’ve already visited my site will recognize they’re at SKDesigns. The few pages that I did eliminate have been redirected, so no one will be left in the dust, including search engine spiders.

Learning From Experience

Potential and existing clients need to see what we’re capable of doing. A first impression also happens only once, and we need to make the most of it. Most of my clients own businesses, whether small or large, and while that’s a huge umbrella, it also demands a lot of insight, often a conservative style, a wide range of cross-browser, cross-compatibility knowledge, accessibility skills, and a lot of know-how for information architecture, usability, and search engine-friendly design. I want my own business site to represent those things to attract that kind of client. This has been my niche and has worked well for me.

During the past 2-1/2 years since I created the old design I’ve also gained thousands of hours of experience designing sites, using Photoshop, and improving my skills as I’ve continued to run a full time Web design business. It’s critical to me to continue to learn and grow and build on my skills, and part of the reason I’m in this business is because I thrive on challenges and constant learning, and this industry certainly provides that!

I firmly believe that continuing to learn and build skills is one of the important ingredients in having a successful Web design business, too. I wanted to update my site to reflect at least some of my improved skills, feeling my old site was no longer representative.

Separating Style From Content

My goal is to separate style from content as much as possible, much like my approach to the Brainstorms and Raves design. Therefore I relied more heavily on formatting with style sheets, taking advantage of CSS2.

I used what I’ve tagged as my transitional bridge approach, in which I still used a table for the outer layout for Netscape 4.x browsers, but I used CSS2 for the rest of the formatting and layout. I used a second style sheet accessed via the @import attribute for what Netscape 4.x chokes on or spits out in weird ways. Cross-browser and cross-platform testing was also critical for fine tuning, as usual (especially the forms).

I’m always encouraging others to consider learning CSS and XHTML, and I think it’s critical to practice what I preach. My business site is a good place to do so. While I was using both CSS and XHTML with my old design, the new design was created with these in mind to make better use of them.

Additionally, I’d also love to show my clients, potential clients, and other designers some examples of how it’s possible to create a forward thinking, visually appealing design using CSS2 and XHTML that still supports older browsers. In fact, this approach is more widely accessible than being forced into all the hacks and workarounds for Netscape 4. This approach is still fully accessible to Netscape 4 and still looks good, even though it’s not visually identical to newer browsers that support more of CSS2 and are far more standards compliant.

The ideal, though, is to get away from using tables for any formatting at all, using them only for their intended purpose, tabular data. The transitional bridge I mention helps bridge the gap while many of us must still create our designs to appear somewhat or more visually similar in Netscape 4 browsers. It’s been my way of figuring out a reasonable compromise until I can completely get away from using tables for any formatting.

CSS-P (cascading style sheets positioning) will continue to improve and the older browsers will gradually phase out so that we can rely more on CSS-P for our layouts instead of using the longtime hack of tables for formatting. As I also mentioned above, separating style from content is truly the ideal, and the advantages of this are many and will continue to be discussed more in future posts.

Inspiration

Inspiration can be difficult to describe at times, and where it comes from can also seem elusive and mysterious. While I can’t nail down my own inspiration to any one thing, I can definitively say my inspiration for Web design comes in part from my passion for the Web Standards Project, W3C and other designers who inspire me regularly as designers and as such great people, such as Jeffrey Zeldman, Carole Guevin, Nick Finck, Makiko Itoh, CSS guru Eric Meyer, and information architects Christina Wodtke, Louis Rosenfeld, Lucian Millis, JavaScript by Dori Smith, and the gifted writing of all the above plus Meryl Evans, Molly Holzschlag, and others. (This is only a partial list, as many inspire me!)

In addition, light, darkness, colors and their splendor are a constant source of inspiration. I have eternal gratitude to my mom who lived and breathed the world of art, music, and creativity as a part of everyday life. Such passion couldn’t help but rub off on me, and I’m so glad it did.

I’ve also been a professional pianist nearly all my life, with my academic degrees in piano performance (a bachelor’s degree and master’s degree). I’ve lived and breathed music, playing many composers' works and composing my own. I’ve been totally immersed in the wondrousness of music in its millions of forms all my life. That greatly influences my work in Web design, and I don’t see music and art as separate—they’re intertwined from my perspective.

Inspiration is truly a mixed bag of life’s experiences and the people with whom we cross paths that becomes a melting pot for our own creations. We all influence each other, whether consciously or subconsciously, and whether we’re aware of it or not.

06:47 pm, pst23 November, 2001 Comments, Trackbacks ·

Categories: CSS, Design, Development, Graphics, Photoshop, Web Biz

top


Visit iStockPhoto - Royalty-free stock images. Click Upload Earn, Click Download Create 

I Wrote a Book

Deliver First Class Web Sites: 101 Essential Checklists  Via amazon.com: Deliver First Class Web Sites: 101 Essential Checklists, by Shirley Kaiser. SitePoint Books (July 2006). 

Available now via: SitePoint Books, Amazon.com, Amazon.ca (Canada), Amazon.co.uk (UK), Amazon.fr (France), Amazon.de (Germany), Amazon.co.jp (Japan), Tower Books U.S. and elsewhere! You'll also help support this site and its owner if you purchase via any of these links.

Learn more at SKDesigns - Deliver First Class Web Sites and via SitePoint Books.

Recommended Books

Cover - Deliver First Class Web Sites: 101 Essential Checklists, by Shirley Kaiser. SitePoint Books (July 2006).

Cover: The CSS Anthology: 101 Essential Tips, Tricks & Hacks, Practical Solutions to Common Problems, by Rachel Andrew 

Hand-picked best book recommendations for Web site design, CSS, graphics, Photoshop, color, accessibility, more

In association with
 In Association with Amazon.com 
http://brainstormsandraves.com/archives/2001/11/23/when_is_it_time_for_a_redesign/
Page last modified 30 April, 2008 - 6:51pm PDT Page load time: 0.009305 seconds.