I recently finished the first phase of my long-planned updating of my other blog, Usable Help. (If you've never visited, it's for technical writers and instructional designers.) Since launching the site, in 2002, I have been using a slightly-modified version of templates that were provided with Tinderbox, the application I use to write, manage, and build the site.
Keeping the same design for five years seems like an eternity in the online world, but there were always other projects to distract me from changing it. And, quite frankly, it worked so smoothly that whenever I got the urge to change the design I reminded myself that I could just write new content instead. (Such is the demon that sits on my shoulder.)
I started the redesign by searching for a new CSS-based blog template. After poking around at a few, and not getting anywhere, I finally thought to closely examine the template that I was already using. It uses tables for positioning, but has a solid stylesheet for markup, which meant I didn't have to start over from scratch. With the aid of Macrabbit's CSSEdit, I very quickly had a new "pure" CSS design.
Once the basic design was in place, and the "greeked" content I used for development replaced with the Tinderbox export tags, the fun really started. Here's where Tinderbox as a content management system shone. I rebuilt the whole site dozens of times as I worked on it. Hundreds of posts, tens of thousands of words, all reflowed into the new design in a matter of seconds. I could literally, with hardly any investment of time, see how a design change would look across the whole site.
You know, when EDS trained me to be a professional programmer they taught me that computer cycles are expensive. "Before spending any processor time on a task," they drilled into me, "make sure the code is solid and well designed. Furthermore, having the compiler find a syntax error is an embarrassment." I could see their reasoning, but here on my computer--where I'm not sharing resources with anyone--using Tinderbox to experiment felt just great. I laughed at the voice of Ross Perot in my head as I tried something new, exported the whole site, then backed-out my change when I didn't like it or it did something unanticipated. Whee!
Tinderbox is very much under active development and there were a lot of new features I hadn't yet exploited. I took advantage of several of them with the new design. For example, the "do macro" feature allows me to easily add category art to each post without having to enter all the HTML parameters each time. My friend Fuge created the new artwork for the site.
I also tried out the "similar notes" feature, which finds previous content that is related to the current post, but ultimately decided not to use it as an automated process. With five years of archives it's easy for anyone, even me, to overlook older topics that are related to current ones. For now, I'm letting Tinderbox suggest related topics after I write something new, but I'll manually add the cross-references that I like. (Another place where those macros are handy, by the way.) It's not that "similar notes" doesn't work, it's that with the narrow subject range in which I write the list of candidates needs to be carefully pruned, lest everything get linked to everything else, without significance.
Another change I made was completely modularizing the sidebar and splitting the old one into two. Now, since each link is a separate note, I can rearrange, add, and remove items from the blogroll and other sections with less fuss than before. Tech writing blogs seem to have a life shorter than tsetse flies, so this will let me keep up more successfully. The sidebar work also had an immediate payoff when I signed up for AdBrite. Their affiliate code was put into a Tinderbox note as-is, the site re-exported, and now Usable Help is sullied with shameless commercialism. I'll let you decide if that's for good or evil, but it simply could not have been any easier to implement.
Another change I made was to have the name of each individual post reflected in the HTML title. Previously, every page was titled the same, which was fine and dandy until I adopted Mint, in an effort to better understand how my readers utilize the site.
Finally, I moved the Gallery of Onscreen Help to a completely new system. I previously used iView. I haven't liked that product's direction for several years, especially recently, so now I'm using Gallery instead. All in all, moving from iView to Gallery took considerable more effort than the Tinderbox-twiddling I did, and I lost a bunch of metadata in the process. Frustrating.
I have a couple more changes waiting in the wings, but for now, I'll let the dust settle. Please drop me a note if you notice anything strange with the new design. I've already had some puzzling IE6=specific CSS problems crop up, but I think those are resolved.
