rob.rho.org.uk

As you may or may not have noticed (depending on how you’re reading these words, and if you’ve been here before), I’ve given this blog a little spring clean. The idea for this redesign emerged when I noticed that I actually preferred the (responsively selected) mobile layout of my site to the full one. Maybe it would be worth adopting and adapting that kind of layout across the board? Looking around, I found that a number of other sites that I liked the look of (such as Matt Gemmell’s) had taken a similar approach, so I decided to give it a go.

Any design needs to be informed by the people who are going to use it. Thinking about this, I came up with a few categories of user:

1. Casual readers who come to an article via a link they’ve seen elsewhere. They’re mainly interested in reading the single article in question, so it needs to be presented clearly, and stand on its own, with the absolute minimum of extraneous cruft. If the article piques their interest, they may want to explore the site further, but this must not be at the expense of presenting the article on its own.
2. Regular readers who check out all or most posts via links on my Twitter feed. This group has similar needs to the first, but as they see the site more frequently will be even more sensitive to anything that gets in the way.
3. Subscribers to the RSS feed. It’s a full text feed, so I imagine most of these readers will rarely, if ever, actually visit the site itself. For this use model, the content needs to work on it own, rendered without custom styling.
4. People who’ve encountered me, online or offline, and want to check out the blog to get an idea of who I am. These readers will start at the front page, then poke around.
5. Myself. Anything that requires me to do extra work when writing posts will mean I write fewer, and I’m already bad enough in that score. Hence, the styling absolutely must be automatic, unless I want to achieve some special effect. When I just want to write plain text with the occasional image (by far the most typical case) I need to be able to just drop in my Markdown and have it look good without additional tweaking.

With those users in mind, I came up with the following requirements:

• Readable text. This affects all users other than RSS readers, and trumps everything else. To this end, I use fairly conservative fonts (currently Georgia for the body text, and as close to Helvetica as available for the headings) and colours (black on white, with a couple of shades of grey - all other colour is saved for the content), with plenty of white space.
• Minimal page loading times. This is vital for the first group in particular. To this end:
  • No JavaScript (unless the post itself includes JavaScript, such as this one).
  • Minimise non-content resources such as images and style sheets.
  • No web fonts for body text. This not only adds another resource to the page load, but unlike an image or style sheet it renders the text itself invisible until it arrives. Until someone works out a way around this, I’m steering clear of web fonts for sites with casual visitors.
• Responsive design. Users in the first two groups may well be using a phone or tablet, especially if they arrive via Twitter. The site must look as good, and more importantly be as readable, on a phone as it does on a desktop.
• Simple HTML. This is vital for the third group, and also contributes to making my life easier as the writer. It also improves accessibility for the visually impaired and anyone using W3M.
• No elements that do not directly serve these goals.

The last point was perhaps the hardest to get my head round, but once I started to swing the axe I enjoyed it immensely. Gone is the sidebar. Gone are tags. Gone is the short bio. Gone are the pages of old posts.

Hang on. Pages of old posts? Aren’t they kind of important? Well, yes - one of the things I like about running my own site is that it’s a collection of writing going back more than a decade that isn’t going to disappear because somebody changes their business model. However, having the reader endlessly clicking on an “older posts” link doesn’t seem to be a good way to present them. Bearing in mind the types of user listed above, I’ve torn these down and replaced them.

As before, the first five posts are shown, in full, on the front page. However, at the bottom of this page, there is no longer a set of links to historical posts in five-post chunks (which change whenever a new post is added). Instead, there’s a link to a single archive page that contains links to every old post in reverse-chronological (i.e., newest first) order.

The reasoning being this is straightforward; I don’t imagine many people are going to want to sit and read through page after page of my blog in order. If someone wants to read a sample of what I’ve written, the five most recent posts would seem to suffice. If they’re looking for a specific historical post, a unified archive page is far better than a paginated set of all the text. The new arrangement is simpler, more logical, and more effective.

I’ve not finished tinkering with the site by any means. I want to try algorithmically generated related posts, and add some kind of search facility to the archive. However, I don’t think I’ll be doing any major, site-wide design changes for a while. Instead, I’m going to try and focus on actually writing stuff.