My old website was crap.

For longer than I care to remember ‘Redo website’ has adorned many a todo list. I don’t often have anything great to say—but on the occasions that I do—I wanted somewhere to put it so that in the future I could look back and cringe.

Finally, back in January, I found the time and impetus to get going with the redesign. My goals were pretty straight forward; I wanted something clean and simple which would allow me to share some of my random thoughts and rants. The hot topics of the time were HTML5 (and to a lesser degree CSS3), web typograhpy and responsive web design. So, of course, my new website had to be built with these things in mind.

Nuts and Bolts

• CMS: I went with WordPress as the base CMS for my website. I’ve been building websites using WordPress for longer than I can remember and a simple site like mine is a breeze for WordPress.
• HTML5 (CSS3) are very much the current buzz word(s) in web design/development. This seemed like a good opportunity to get to grips with HTML5. I purchased Jeremy Keith’s HTML5 for Web Designers from A Book Apart. It was a nice introductory read and left me feeling ready to go. Another good resource was the website HTML5Doctor. I’ve used the new structural elements that HTML5 brings including header, nav, article, footer and time. To ensure the site still works in Internet Explorer I employed the HTML5 Shim by Remy Sharp.
• Typography. I’ve had a thing for Typekit for some time now, so it was without question that I would be using them to provide the fonts for my website. I was after two fonts: one for headings and the other for body text. I settled on Atrament Web for headings—big, bold and suitably strong without taking great amounts of space—and Droid Serif for body text. Typekit is a great service and I would thoroughly recommend it.
• Responsive design. One website for all devices or separate versions for each? I think the answer to that very much depends on the site. For a small site like mine I think one site which responds to the device it’s viewed on is the way to go. And so we welcome the CSS media queries. I’ve used some here and there to adapt my site layout depending on the device size. From the cursory testing I’ve done, it works quite well.

Without further ado

Some parts of my site feel half done and I’d have loved to have tested more on this and that device. If I did that, this would remain on a todo list for the foreseeable future. So it’s time to put it out there and let it be a work in progress.

Without further ado—I give you my new website.

Enjoy!