I’ve been growing frustrated with Textpattern. A trusty tool for my client work days, but despite a growth spurt last year increasingly stagnant. Plus if I’m rebuilding I should learn something new, right?
After finally climbing aboard Wordpress for The Naked Startup (our behind the curtain blog about Gameplan) I realised that were I to use it for this site I’d merely be swapping like for pretty bloody similar. So I decided to archive the old site and explore the world of tumblr.
I agree with Dan Cederholm, my hope is that this new blog will help me post more and remove some of the maintenance of hosting my own site. A single page template and simple publishing. Amen.
The New Shiny
So when it comes down to it, I’ve used this blog to experiment a little. HTML5, web fonts by Typekit, responsive design. Jesus, it’s like web-buzzword-bingo in here.
An iPhone-ish version is provided responsively by the @media stylesheets, and there’s an in-between narrower version with a wider header. Just resize your modern standards-compliant browser window.
The design is somewhat inspired by the advent of Safari Reader and my continuing use of Instapaper over reading the actual text as set on the page. I wanted to try and create something that would allow readers to care about the content, rather than a load of extra surrounding gubbins.
I was aiming for a modern-retro feel and tried to limit myself to black and white as much as possible.
Other influences are the Seed Conference site, Colly’s recent refresh for it’s retro stylings and Jon Hicks' reflexive redesign (plus it was his tweet about tumblr that set me off down this route… even if he gave up in the end).
IE6 is readable and I’m testing IE7, do drop me a line on twitter if you spot a rough edge.
Justify Yourself
One trick I’m reasonably proud of is the one-line-justification in the page header.
It’s a simple trick to get around a single line acting like the final line of the paragraph (not normally justified) so I added a class and then jQueried a load of non-breaking spaces to the end of the line, and manually set the height in CSS.
Have a look in the source if you’re interested.