Open Thinkering

Menu

Tag: theme

A Week of Divesting: Blog design

If you’re reading this in a feed reader, you might want to click through or click on the images below.

A short post, this one. I’ve been working on-and-off for the past few weeks on a new blog theme courtesy of an excellent WordPress plugin by the name of Theme Test Drive. This allows administrators (i.e. me) see a different theme when they visit this blog than non-logged in visitors (i.e. you).

Here’s the difference between the two:

Old blog theme - 'Digital Statement'

The old theme – ‘Digital Statement’

New blog theme - 'New Geeky White'

The new theme – ‘New Geeky White’

Some may say they prefer the old one. It’s certainly more ‘visual’. But I didn’t like the font and the amount of time it took to load. Serif fonts are much more pleasing on the eye and it’s certainly faster loading. Readers don’t have to click through to read the most recent post, and I don’t have to write a summary and crop pictures down to 90×90 to go next to that summary.

Taking my inspiration from the Flickr blog and Seth Godin’s blog (see images below) I pared everything down as much as possible.

Flickr blog Seth Godin's blog

I took as my starting point the (very yellow) Old Popular Yolk theme, which looks like this:

Blog theme - 'Old Popular Yolk'

It was then very easy to modify the CSS to end up with what you see now. 🙂

I’ve called this derivative theme New Geeky White. I’m no good at CSS or WordPress hacking in general, but if you really want to use the theme get in touch and it’s yours!

The story behind the new design of dougbelshaw.com

Whilst I haven’t tinkered with the theme for this blog (yet!) I’ve changed the landing page when you visit dougbelshaw.com. There’s a bit of a saga behind it. :-p

A tweet from Kathy Sierra directed me to Brynn Evans’ (@brynn) blog where she had a great post about an idea called ‘betacup’. What struck me about Brynn’s blog, however, was the clear and straightforward layout. Summising that she was running WordPress (most blogs, including this one, do!) I looked in the footer for an indication of the theme she was using.

Brynn - blog footer

Hmm… no dice. Another way to find out a blog’s theme is to use the ‘view source’ option in your web browser (View/Page Source in Firefox). Sure enough, this revealed the following:

Brynn - blog theme

In other words, the theme being used was in a folder with the title love_work. Again, summising that this was probably short for Love & Work, I searched Google for it. No joy.

Refusing to be beaten and now intrigued, I looked at the CSS by following the link above. CSS stands for ‘Cascading Style Sheets’ and it is the method used to ‘style’ the blog. Authors often put their details at the top of such documents:

Brynn - blog CSS

Although a little downhearted that it would seem that the author – a ‘Chris Messina’ (@chrismessina)- created a custom theme (meaning it was probably generally available for me to tweak) I decided to visit his website – factoryjoe.com. I was impressed with what I saw:

Chris Messina - profile

I thought this was wonderful. Not only does it link to everywhere Chris is online (and deems important) but it tells a story. Unthinkingly (and to my shame) I set about copying him. I ended up with this (CC-NC-SA factoryjoe):

Doug Belshaw - old profile

I did mention on Twitter what I’d done (in fact my network were very helpful in my tweaking it) leading to this tweet the following morning from Chris:

Chris Messina - tweet about Doug Belshaw's profile

Whilst Chris was a gentleman and agreeable about it, others were a bit more to the point. The outcome was that I realised I needed to do my own thing rather than copy someone else’s design. After all, as someone who makes his living through web technologies, it’s only fair that Chris’ design is unique. 🙂

I spent a while thinking about what I wanted and, to cut an already-too-long story short, with the help of my Twitter network, I’ve ended up with this:

Doug Belshaw - profile

Yes, I’ve had all the comments that I’ve got stubble on my head, it’s a bit ‘noir’, it looks like a dating site, and I look like I work for Apple. Oh, and my wife wants me to point out that she took the photo. 😉

I may not be finished my tinkering yet. Chris has challenged me to incorporate a hCard and I really like the design simplicity of the Flickr blog. However, again, it’s a custom-designed theme…

Reblog this post [with Zemanta]

Thinking of changing this blog…

BloggeurI’ll keep this short. I’m thinking about changing this blog for two reasons.

  1. WordPress (which powers this blog) is database-driven. That means it’s not archived over at archive.org. That means if I died tomorrow, my work would be pretty much lost forever. This is the main reason.
  2. I get bored of the same blog theme after a while. While the one I’ve got at the moment (Digital Statement) allows me contain lots of ‘stuff’, I’m thinking crisp and clean – like the Flickr blog, for example. There’s also some nice onces over at plaintxt.org.

So… suggestions for blogging engines that produce static HTML pages? (or do you know of WordPress plugins that allow the same?) 🙂

Oh, and before you say archive.org renders WordPress blogs just fine, have a look at the mess it made of the previous iteration of this one! (pic)

Image cc-by Mike Licht, NotionsCapital.com

Update: Upon further investigation after this helpful tweet by @ctdesign, it would appear it could be something as simple as the link to the CSS file in my header. Cool.

Reblog this post [with Zemanta]
css.php