Expect wonkiness

I’ve been wanting to create a new look for Stuff & Nonsense for a good, long while, but I felt daunted by how much work I imagined there’d be for a redesign. My work diary is so full that I couldn’t see the time I thought I needed, so the site stagnated and over the last few months I couldn’t bear to look at it. Then a few weeks ago, Elliot spontaneously redesigned his site and inspired me to follow suit.

I gave myself a deadline — no more than one week for content, design and development — and I left some things for a rainy day. One of these things is the portfolio, which might seem strange, but as my work diary is full until next Spring, a formal portfolio can wait. In the meantime I’ll write about what I’m working on. Instead I focussed on the blog, as well as on new articles, speaking and teaching pages.

I’ve tried to reflect the pared down nature of the site in the new design. I’ve limited typefaces to just Abril Text (serif) and Etica Web (sans-serif), both designed by TypeTogether and served by Typekit. I’m using tints of just one colour and screen-toned shading to suggest low tech. The devil’s in the detail though, and I’m pleased with the typographic details overall. And — after a year of designing responsive sites for clients and talking about that CSS3 Media Query malarkey — I finally have a responsive site of my own. Of course, it’s built on ‘320 and Up’

I still have plenty to keep me occupied on the site over the next few months, so expect some wonkiness in places. Interested in technical geekery?

• I’ve finally flipped the switch on an upgrade to ExpressionEngine 2. The installation is as simple as I could make it and only the blog components are now dynamic. Everything else are static pages.

• HTML5’s ‹time› elements have bitten the dust and while I’ve replaced them with ‹data›, I’m not altogether happy about the change. Over the next few weeks, I’ll be transitioning my clients to the new elements too.

• Dip into the stylesheets and you’ll find me using CSS border-image to build many aspects of the design. CSS3 masks also helped me to keep up the circles motif on the blog comment Gravatars (in browsers that support masks.)

• I’ve included a few geeky easter eggs too. See what you can find.

The site now feels like a place where I’m inspired to write again.