As much as I attempt to avoid navel-gazing meta-posts, humour me briefly as I announce that for the first time in more than three-and-a-half years I’ve updated the design of my site. If you’re reading via a feed (and if you’re not, c’mon!) come take a look. As I said back in August 2004 when I last redesigned I’m very much a developer rather than a designer and so it’s not going to win any awards, but I do like to try and keep the place looking nice.
Points of note
One of my objectives apart form the visual refresh was to make good use of microformats from the ground up, so you’ll find the posts formatted with hAtom, as well as hCards and XFN all over the place. There’s more to do, but it’s a good start.
A lot of what I write is fairly text-based technical stuff, so I wanted to include more images to try and makes the page more visually interesting. I enjoy photography and use Flickr a lot, so I’ve simply used a standard Flickr JavaScript badge to drag in a random selection of images from my account. I’m also pulling in gravatars into the comments to break up the textual feel. I’ve done a similar thing with a stream of links from del.icio.us. We’ll see how it goes with the JavaScript badges — if performance is crap I’ll rewrite them with PHP.
As the content here is so text-heavy, I’ve significantly increased the size of the body text as part of the redesign to make it easier to read.
This design has been sat waiting to be implemented for about two years, and so is old before it’s new. In an effort to just ship I’m still running on Textpattern — it was the path of least resistance, and leaves me in no worse position than I was before. There’s still work to do. Some of the pages are still on the old templates. I’ve removed the search as the experience was so shockingly poor you’re better to just use Google. I’ll bring that back once I figure out a method that adds value over what you can get from searching with Google.
This is the first set of templates I’ve developed using Firefox 3 as my reference implementation. The good news is that everything that works in FF3 just works in Safari 3.1. IE7 is ok. Firefox 2 is ok, with a few very minor width issues. If you’re using FF2, you’ll be using FF3 soon enough anyway. I’ve also moved the site off Joyent a.k.a. TextDrive, as the performance was unacceptable. Hopefully things should be a bit snappier now.
As always, feedback is very much appreciated.
In other news
It’s six months since I left Yahoo to join edgeofmyseat.com, and business is brisk. We’re always on the look out for interesting projects though, so if you’ve got a custom CMS project, need an ecommerce solution developing, or perhaps are looking for a development partner for your new web app, that’s the sort of stuff we do. Some of our current projects include the web-based ticketing systems for a festival, front-end development for an online t-shirt store, and some quirky content management that involves putting dogs on a carousel. We’re also running another of our popular beginners CSS training courses in April, which is booking up now.
If you’re local to us in the South East of England, particularly the Thames Valley area, you might be interested in the Refresh Thames Valley group we’re hoping to get off the ground. Consider it an opportunity to get to know and share knowledge with other people who have an active interesting in web and new media technologies in the local area. If that’s you, we’d love to see you over on the Google Group.
Comments
Nicely done. I’m in the process of redesigning and rebuilding my blog too, likewise with particular reference to adding microformats.
I was looking at your implement of hAtom here, and I noticed a couple things which were bothering me in my coding. Firstly the need to the include a rel=bookmark for the post; thereby necessitating the need for a rather redundant link to the page which you’re already on.
Also the need to include an address and hcard of the post author. Again somewhat redundant if all the posts on the website are from one person (although I’m getting around this making the whole page an hentry by including the address and hcard in my site footer.
Just a few thoughts to ponder.
btw you have typo in your XFN (I’m a “frield”).
Hey Drew,
Very sorry to hear you moved off Joyent. Over the last eight months, we have been offering our customers a free migration to the new Shared Accelerators and those who have moved have found the stability and reliability to be oodles better than the servers of old.
http://www.joyent.com/news/newsletter/jan-2008/get-your-golden-ticket-now
With your lifetime account, I would be happy to set you up on the new environment if you wanted to kick the tires over there. If you are interested, please send me an email to kristie [at] joyent [dot] com. Cheers.
The new design feels very concise and organized. Great job.
I’m curious as to what host you decided to move to. I have been thinking of going over to Joyent and this is the first I’ve heard of poor performance. Could you elaborate more.
Also, nice to see Kristie of Joyent commenting. Looks like they realize you’re a valuable customer.
Anyway, thanks for all the great articles here and elsewhere. Keep it up.
Very cool. More of a re-alignment then a re-design, if I remember correctly (RSS has no style).
Augh! Firefox 2, XPSP2.
Needs Lucida-Hybrid :(
Very similar rationale as to my redesign!!!
I love how easy a win microformats are :>
Loving the cleanliness and simplicity of this. :)
Your sidebar kind of disappears off the left side of my window when my browser window is set to its usual width (just slightly bigger than 900px wide). Other than that really like the rest of the changes.
Thanks for the comments, everyone.
@Richard I actually don’t mind the rel=“bookmark” link, and used it before I implemented hAtom. It provides a handy way for users and search engine spiders to find the permalink to the post. I’m using the include pattern (OBJECT variant) to include the author hCard, which seems to work ok.
@Kristie Thanks – I saw that there was an upgrade option, but the list of task I had to perform manually for the process to take place was so onerous that it was easier to just move elsewhere.
@Ryan I can’t speak for Joyent’s current offerings, as the server I was on was very very old. This server is with memset here in the UK.
@Jeff Does it still look bad? I can’t reproduce that font craziness in any of my Windows VMs.
@Edd Thanks – which browser/page? It seems to collapse down nice and narrow for me. Perhaps there’s some content in the page you were looking at that was forcing it wider.
It’s in safari on this page. Checking in other browsers when you shrink the size of the window, the sidebar just sits there and the window scrolls. However, in safari it jumps to the bottom of all of the other content (just above the footer) half off the left side of the window.
It may just be me, but this redesign seems so subtle that I didn’t notice it at first. Nice work!
Scott, I know what you mean. I tried my best not to make too much of a departure from my long-standing style. You can still see the old design on the hkit page. I need to figure a way to get the nose-picking lady into the new layout too.
You know dog carousels are the future!