Version II: Mini-Case Study

After over four months of development, I've finally decided to release version 2 of my site.

For four months' work, not much, huh? I actually had most of the basic layout finished by mid-September, then I spent several months trying to work around various Javascript bugs, especially a particularly nasty one in IE6.

Still have to put some content up, but first I'll explain the purpose and execution of this redesign.

The Why
Although I was very pleased with the 1.5 Remix of my site, there were a number of nagging issues that prompted the redesign. The biggest was poor utilization of space: the actual content took less than a third of the overall real estate on my site. The rest of the space was wasteful (albeit pristine and pleasing) whiteness.

The cramped space also compounded another problem: since I switched from Blogger to Greymatter, my entries have gotten longer, and the main "news" box was too small. Furthermore, I had started doing more and more "link dumps" as opposed to "journal" entries, and this led to a general lack of original content on my part, as well as a discouragement from posting at all, since it seemed like a waste to go into Greymatter and make a new entry if I was just going to link a few sites. In any case, it seemed that I had sacrificed content for aesthetics, and that definitely goes against the spirit of this site.

On top of all of this, I wanted to be as compliant with web standards as possible without sacrificing my vision for the site, and I wanted to incorporate some of my new skills with JavaScript.

The How
I addressed the issues of content and space at once. My first step was to remove the concept of a "splash page"...it kept the visitor one click away from the main content, and that was one click too many. I replaced it with a splash image that would appear at the top of my page. I also squashed the navigation elements into a bar underneath the splash. This left a large area for content, but I felt it was too wide, since the page resizes to the full width of a visitor's screen.

This is when I went back to an old idea I had from version 1: I created a separate Link-a-thon which would consist of links to other sites, as well as a few comments about them on my part. This addressed two key issues: first, it scaled down the space taken up by the main "News" section, making it easier to read; second, by separating "journal" entries from "link dumps," it addressed the poor content issue I mentioned above.

By this point, I'd run out of real estate, but I still wanted navigation elements that pointed to my projects and vignettes. I turned to Aaron's brilliant SimpleScroll component. Now, if you click on any of the links in left side of the navigation bar, more content will scroll into view.

That satisfied part of my desire to incorporate some DHTML. By the time I'd incorporated SimpleScroll, the page already worked fine with my own DHTML snippet, something I call Seasons. Basically, it causes certain elements on this site to gradually change colors as the year progresses...although the difference may not be apparent from day-to-day, you will notice a significant change about every two weeks or so.

Finally, in the name of web standards, this page is almost compliant with the standards for XHTML 1.0 Strict and CSS2. I've decided to use the XHTML 1.0 Transitional DTD instead, however, since Strict doesn't allow the target attribute for a tags. After a few modifications to my counter code, the page should validate. I haven't updated any of my older entries that I imported from Greymatter (I'm on Movable Type now), but I'll hopefully get around to it one of these days.

Well, that's about it.