Category: Design

Redesigning dougbelshaw.com

Posted on June 19, 2017June 19, 2017 by Doug Belshaw

I wrote my own HTML and CSS for dougbelshaw.com back when I was at Mozilla. It was originally a template to be used with Thimble, and a few people ‘forked’ it to use it for their own site.

Although it had some nice features, however — like a JavaScript library that swapped out text, a custom DuckDuckGo search engine, and one of my photographs of Druridge Bay — it wasn’t responsive and, quite frankly, it looked a bit old-fashioned.

So, on the train on the way back from Dundee today, I thought I’d do something about it. I knew that I wanted something pretty simple and minimalist, yet with just enough to ‘delight’ visitors. It needed to serve static files, not rely on a database back end (as with WordPress).

I also wanted to link to something I’ve been tinkering around with that allows me to surface my most recent writing. I’d already put that together at dougbelshaw.com/feeds in response to people complaining that they miss my stuff because I post it in different places around the web.

For those interested, I’m using the LazyGuy personal landing page template (cheap!) and the Font Awesome Favicon Generator (free!)

Please do tell me what you think: http://dougbelshaw.com

(note that this redesign doesn’t affect the look/feel of this blog)

Preparing for ‘Story Hack’

Posted on March 6, 2017March 6, 2017 by Doug Belshaw

Tomorrow, I’m helping facilitate Story Hack, a kind of book sprint at Gateshead Central Library. It’s part of a series of events funded by Arts Council England called STORY MODE:

Story Mode is a series of events that actively explore the role that Libraries play in their communities via a critical engagement with contemporary creative digital practices and how this activity can enable Libraries to grow in capacity and profile.

It presents new ways of working by presenting experiences and approaches from local, national and international practitioners. Story Mode events will connect Libraries to current engagement practices in contemporary visual, digital and narrative arts.

We’ll be using Sourcefabric’s Booktype platform to collaborate on during the day. Facilitators have been asked to curate relevant Creative Commons-licensed (or public domain) text for remixing, as well as to prepare a short, 15-minute talk about their work.

In terms of the focus of the day, we’ve been given the following prompt:

The advent of collaborative online platforms for journalists, writers and visual artists has had a profoundly disruptive effect upon the nature of traditional media and how we access it. This situation raises more questions than it answers. Questions like: Do digital platforms have the same aura and appeal as physical media? Does the truth matter anymore? Who should we give our attention to and why?

Thankfully, my network is filled with professionally-generous people. The following are just 10 of those whose work I can confidently and openly share with others in relation to the above prompt:

In terms of my own work, I’m going to use five links to describe what I’ve worked on over the last five years:

I’m going to learn a lot tomorrow, and see myself as much as a participant as I am a facilitator!

Image CC BY-NC Thomas Hawk

Blog redesign: October 2012 edition

Posted on September 30, 2012 by Doug Belshaw

(Email and RSS subscribers will need to click through to see the change)

I’ve felt for a while that I should make this blog better suited to mobile interfaces and, in particular, touchscreen devices. This is known as responsive web design and I’ve been particularly impressed with Microsoft’s ‘Metro’ design language leading to a tiled approach on Windows smartphones. To my eyes it seems streets ahead of Apple’s skeuomorphism.

Yesterday, when I was browsing architecture blogs and came across the Contemporist site, it reminded me of that clean, touchscreen-friendly approach:

I did something I always do when I see blog themes I like: right-clicked to ‘View Source’ as you can tell which blog theme is being used. Judging by the CSS it’s a custom job, meaning I couldn’t simply download the same theme.

That was a shame, but it spurred me on to look for Metro-inspired blog themes. I was looking for something with a tiled, fairly squarish look but that didn’t scream Microsoft. Beautiful though it is, the Subway WordPress theme (from €39) was out of the question. I’d have looked like a Microsoft fanboi:

I also found the MetroStyle theme ($45), which I rejected for having too many boxes at the top:

I downloaded and installed the WP Metro theme (£FREE), but I had trouble making it look decent with my content:

In the end, after considering signing up to a course to get the Anaximander theme, I decided to pay $35 for a WordPress theme entitled Metro:

Like many premium themes it comes with an extremely easy-to-use configuration dashboard in addition to the usual WordPress options. Nevertheless, old habits die hard and I delved into the CSS to tinker about a bit!

I hope you like what you see, and if you want to see the ‘responsiveness’ in action, either resize your browser window or visit this site on a mobile device. It’s only my first attempt – I’ll be tinkering around making improvements here and there over the next few weeks.

Any feedback is gratefully received!

Notes:

You can see previous iterations of my blog on Flickr: 2009-10 / 2010-11 / early-mid 2012 /
More Metro-inspired design
I love the theme Colin Wright has at flashpack.co. It’s called Focus ($20) but it’s Tumblr-only, unfortunately!