This is a redesign of the blog, which runs on Drupal 6 and features a blog and photo galleries. It’s not the first Drupal-based theme I’ve ever created, but certainly the one I’m happiest with.

If you want to know a little bit more about the process behind designing the site, I wrote about my aims for the site, then followed up today with some notes on why I made certain design decisions.

My feeling is that the design is quite unique and a good starting point for establishing an identifiable presence on the Internet. Here’s a screen-shot:

I’ll have a bit more information on this design in the portfolio in the neat future.

In most of the standard Drupal themes, the Preview, Publish and Delete buttons are styled in the same way, which gives equal visual weight to each button. Arguably the most dangerous would be to mistakenly click on the Delete button and wipe out a draft post!

This simple tutorial shows how to style the three buttons so that the Publish button is most prominent, Preview is next and the Delete button is displayed almost as an inline link. Excellent notion, slightly marred in that the solution isn’t particularly accessible for those with poor or no vision (I think the guidelines say that you shouldn’t use color to provide meaning).

Though Mani touches upon the basic benefits of streamlined CSS/XHTML design, like improved accessibility, page loading and search engine friendliness, she focuses mostly on the long-term benefits of the Standards-based approach.

How easy is it to approach a redesign in the future?

Well, Mani suggests approaching the XHTML structure first, regardless of what the final design will look like – Let’s code our XHTML as if we plan to have 10 different designers apply their own unique layouts to it. If we can do it that way, then we will be able to execute minor or even major design overhauls without touching a single page in the site.

The logic of this idea is carefully explained through experience of several site designs and subsequent realigns, which were achieved with virtually the same XHTML structure.

I must say, this idea appeals as a designer. The closest I have come to this in the real world is through adapting the Sandbox theme for WordPress.

Sandbox is an incredibly complex and powerful WordPress theme that makes the best possible use of semantic XHTML, even implementing Microformats where they can be identified.

The idea behind Sandbox is that it can be skinned completely through CSS, and is flexible enough that you can move containers around in the CSS rather than constantly change your XHTML.

Essentially the whole idea harks back to the ethos behind the CSSZenGarden site: one well-formed XHTML document can be styled in unlimited ways with the right creative input. Very good article and a reminder that we should be striving to improve the art of web standards, not merely resting on our laurels!

Anyway, Cameron recently posted some useful grid images that you can use in CSS design to see how if your containers are complying to your spec or if there’s a problem. You simply apply the image as the background image for the container element and then you can refer to it as you work. Highly useful!

I’m working on taking all my blogs to a 950px wide format in the near future, so I’ll be road-testing this technique in the weeks ahead!