Here's a Story:

In April 2006 I started the re-design of this website. I started by picking up two books: CSS Zen Gardens by Dave Shea & the XHTML Bible.

I also went back to a great learning source for me, Lynda.com. Lynda is a web designer & author whose books I studied when was initially designing my own website (back in 1999). Her site has movie tutorials where I learned XHTML, CSS2, Fireworks & Flash. I really liked learning this way. For me, it was very casual. It seemed that most of the times, I would fix myself a meal and then watch a tutorial as if it were the TV. Then I would take what I learned and see if I could do it myself.

Learning about CSS2, XHTML & web standards was very exciting. After my monthly subscription to Lynda.com wore out, I started incorporating the CSS Zen Garden techniques. I would go through the pages of CSSZenGarden.com one by one & study the designs & layouts I liked. I would try to rebuild them from scratch on my own, and see what worked and what didn't.

This was my first:

I started the re-design brainstorm in Fireworks, drawing up layout ideas. Here, it looks like I was studying the "Box-Layout." I don't think I knew about background images back then.

 

And then, I got a little fancier with My Second:

I seem to have liked stripes in design.

 

And then it seems I came up with a new logo:

I wanted to do something with a PNG transparency. You can see my end result with the logo at the top & bottom of each page.

 

This was my first attempt with background images:

It also was the introduction of the "Bridge" theme. If you look closely, the banner at the top is a bridge to a guitar. I wanted to use that idea as sort of a watermark to my website. I would soon find out that such a task was a little out of my reach.

 

Here's a close up the "Bridge:"

This one was going to be the footer & each circle would be a link to another page.

 

This idea I really liked:

It was going to be on my contact page. It's my phone number written out on the Staff. Each Phone digit corresponds to a scale degree. I put a lot of thought into it. If I transformed it into flash, I was going to put an audio clip of me playing the "theme" underneath.

 

Now we start Getting Sleek:

It uses the "Bridge" theme as the footer and the broken strings as a nice watermark. It was, and still is, way too complicated for me to write out in CSS.

 

This one had promise:

I actually wrote this one out and published for tests. I really liked the idea. It had a different image in the top left corner for each page. On other pages, the top image would be either a volume knob from and electric guitar, a guitar strap, or a distortion pedal. Each one would house links that were appropriate for the page.

 

And Finally:

This one resembles the current layout the most. This one was up and running as well. It was simple and it was something I could handle.

 

But Then....

My Broken Hand

At the beginning of May, I put down my guitar, wished my girlfriend good luck on her tour, and sat down at the computer and didn't get up for 2 weeks. I had a small window of design oppurtunity and I took it. The problem was that I did not appreciate how out of shape I was, and ended up injuring my hand. I need my hand. It helps me play guitar.

Long story short... I was diagnosed with 2 pinched nerves and sent to Physical Therapy for healing & then strength building for the rest of the summer.

 

And That Brings us to Today:

Late August 2006

I cut my losses as a designer, and figured the best way I could get this site looking nice was to find someone else to do it for me. Luckily for me there are several major sites that have Free CSS Templates available for download.

I chose Nautica 05 by Studio7Designs. You may have noticed their link at the bottom of each page. They have made my life so much easier. I took their original design and then just added and subtracted some elements here & there.

So here it is... 4 months in the making, with a side-trip to the Neurologist & Physical Therapist. Now that this is done, I'm going to put my head back into guitar. I miss that silly thing.

And thanks to TW for all your help!

If you would like to post a comment, leave it here, on the blog.