December 26, 2003

I waited until the holidays to go on a programming binge that I’m still recovering from. After visions and revisions, after obsessing over code on caffeinated nights, the new version of clubLaurier.ca went online on Christmas Eve. The site’s overhaul is the Christmas gift I’ve been promising Greg for quite some time, and now that the hard part is over I can bask in the glory of the moment and talk about all the exciting behind-the-scenes details.

Since I took over the ClubLaurier.ca layout department back in September I’ve been constantly trying to capitalize on the strength of the site: the decidedly subversive online community that evolved through the forums. However, for over two years ClubLaurier.ca existed mainly as a static archive of articles. The site was a brute-force attempt to take print information and to make it available on the web.

This brute-force approach consisted of hiring volunteers to rip articles from the school paper, convert them to static HTML, and manually create links to over 900 articles. There was no content management system to assist in the process and no way of engaging the community in a discussion centred on these articles.

The content that drives the site (the forums, the photo galleries, and to some extent the blogs) was buried deep within ClubLaurier.ca and there were few ways of moving from one area of the site to another.

Thus, the main goal of redesigning ClubLaurier.ca was to move away from static content and to emphasise the interactive content. This was achieved to some extent by highlighting information buried deeply in the site (photos, calendar, forums) on the front page. The information on the front page changes every day because of user driven content, and I’m certainly looking for ways to make the community even more visible in the future.

My second goal was to clean up the bulky and inefficient design I inherited. The old design was boxy and seemed cluttered because of the number of isolated elements on the page and the heavy, black borders. Underneath, the code was unreadable (bad for maintenance) and inefficient, and after rewriting the front page I managed to reduce the size of the page by at least 40 Kb. CSS simplified the entire process, and allowed me to implement an elegant solution by eliminating many of the unnecessary elements in the code (layout tables, font tags, etc).

And yes, there are a lot of things that can be improved with the current design. A List Apart did a wonderful job of retooling Slashdot to work with web standards. It is possible to move entirely away from the old methods of coding websites (relying on tables for layout, for instance) and to create elegant solutions that have tangible benefits in terms of load times and maintenance costs.

In the future, ClubLaurier.ca may have to be re-coded with web standards in mind, but I hope that the existing code base will be easy to maintain and modify as needed. And that’s the really exciting thing about the change: with a more flexible code at the base of the site it’s suddenly a lot easier to implement ideas on ClubLaurier.ca. I can spend more time developing the community aspects that I want to see on ClubLaurier.ca instead of navigating my way through messy code.

Right now I still have to find a quick way of taking 900 static pages, plugging them into a database, and using my home-made content management system to drive the site. I am quite excited about the possibilities …