One Column to Rule Them All

Before: Greywater 2

I’ve redesigned my site again, bringing Zero to One-Eighty to version 3, and this time it really is a One Column Layout. Not that I didn’t like my recent new look, but it didn’t seem to go far enough. There were a couple of things with version 2 I couldn’t resolve. It felt too busy near the top of the page, with the site identity, two-item navigation bar and header of the most recent post all competing for attention.

Second was the right column. As soon as I added a site description to it recently it started to seem like a problem. I don’t think I really wanted that column to begin with, and as long as it only had a single purpose in the content space—providing section links—I was mostly okay with it. But the horizontal meets vertical navigation on a site that was already fairly minimal never felt quite right. Then I added more content to it, and the moment it started to feel like a good old extensible sidebar I wanted to change it. I started working on this 30 seconds after reading Mark Pilgrim’s post on minimalism and offloading typical weblog functions to the browser.

When I made version 2 back in March I was trying to balance simplicity with future expansion, to some extent. This worked against clarity. I was saving space on the navigation bar for imagined future uses, and this empty space was getting top billing, even over and above the latest post I’d written. It wasn’t negative space so much as pregnant space, waiting for something to happen. This time around I’m putting simplicity on top for the sake of one important rule: the content should have the best possible presentation since that’s why people come to the site. Almost everything else is design junk (at least in my hands) and should get out of the way.

After: Greywater 3

Having said that, I’m trying out a new mark, something I’ve long wanted for the site. It’s both a compass rose and ship’s wheel and brings back a hint of the curves missing since version 1. Also making a return is the centred design. I’m not sure why, but the hard left alignment on version 2, which I was fairly attached to, just didn’t seem to work here. I ditched the search form because my visitor logs tell me almost no-one uses it, which makes sense given that most browsers have a much better one built in. Regarding mobile, this version is only 500px wide (as opposed to the previous 780), so it should look change less visibly when viewed on small-screen devices, and I’ve trimmed down the markup so it might load a bit faster too.

I’m looking for feedback and I want to see whether I’ve accomplished my goal of making the content more prominent without compromising usability. In particular, I’m wondering whether the lack of a formal navigation menu will be a problem for visitors. There’ll no doubt be bugs to work out too. I’d also like to add support for next and previous navigation in the metadata for browsers like Opera and Firefox (with a plugin)—this is a great development, kind of like microformats, in making pages that enable the browser to work more effectively at translating markup into functionality.

Related posts:

Navigation via the link element

New domain

Make your own!