Meet the new Puffbox.com

If you’re reading this on the website rather than the RSS feed, you’ll already have noticed things look a bit different. It’s a new year, Barcamp is around the corner, and it’s high time for a design refresh of the company website. Of course, it’s still a custom WordPress theme; and everything’s more or less in the same place. And yes, it’s still green, although not quite as green.
So what has changed? Not as much as I initially intended; there were some wild ideas in the initial sketches, let me tell you! But for all sorts of reasons, many of those fell by the wayside – not least, it has to be said, because many of my government contacts are stuck using IE6. In the end, it became a reinforcement of the principles I liked best from the previous design, most notably the very vertical approach.
You’ll notice a lot more imagery on the site. I’m conducting an experiment using the new WordPress media library function, to pull out the thumbnails it generates automatically when you upload a picture. There’s amazing potential in this, and I wanted to give it a try; but there may be issues with older content, posted in previous WordPress versions. I’m also using gravatar images to personalise the comments function a bit; if you haven’t already associated a picture with your email address, hop over to Gravatar.
It’s also been a chance to update my own site with the technologies I’m regularly using on other people’s: things like JQuery, and the Yahoo! UI Library’s CSS templates. I nearly built the whole thing without HTML tables, until a last-minute crisis courtesy of (guess) IE6. And for once, it looks great – and probably, best of all – in Safari.
I’d love to know what you think.

10 thoughts on “Meet the new Puffbox.com”

  1. I like the design. Perhaps it could take a but more in the sidebar? Your twitter feed?
    If you manage to de-pig-in-a-poke the WP Media Library, do let us know. Or a tutorial would be great.
    I don’t go near it. XMLRPC is much nicer ๐Ÿ™‚
    Matt

  2. It’s funny; I’ve always kept Twitter away from the website. I don’t do anything to publicise my Twitter ID; and somehow that makes me feel better about posting more personal stuff. Maybe that’s a meaningless distinction these days, especially since it’s easily found on Google. I’ll give it some thought.

  3. Hi Simon,
    It somehow seems more sombre with the muted colours. But it is clean looking.
    I would be tempted to increase the main font size and also the line-height to introduce a little more whitespace (greenspace) and lighten the density.
    Perhaps

    #content p {style.css (line 68)
    font-size:110%;
    line-height:1.6;
    margin-bottom:1.5em;
    text-align:justify;
    }

    Finally, the titles of the boxed sections in the sidebar are links that go nowhere. Another call to the_permalink() needed?

  5. When the feedback’s so specific Mike, how can I refuse it? ๐Ÿ™‚
    Line height and margin duly boosted a bit, and you’re probably right. The links in the ‘work’ list were originally going to fire off a Javascript effect, but I dropped it at the last minute. Not sure I can face unpicking the CSS now though!

  7. I like it Simon. Cleaner, lighter, softer. The previous design arguably had more visual impact but possibly at the expense of the content. In this design the content is totally foregrounded. I’d like to see your Twitter feed on here too.

  8. Slightly color-blinded and can’t read whether it says bios or blog at the top. I am guessing it’s blog. Background looks like odd gray-green rather than green.

  10. I love it. Especially the temperature guage… Means that website design could react to anything: time, date, temperature, stock market, footie scores without the owner doing a thing.

Comments are closed.