On Redesigning The Machine Starts

Back in November 2010 when I first thought of starting this website, I remember scribbling in a notebook. I was sketching ideas for the web design, font styles, and even how the relational database behind it all would function.

Doodles helped the (very) vague ideas I had for the site's identity come to life and when I converted my sketches into a Photoshop mock-up, it stayed faithful to those early drawings.

But around a year ago I had grown bored with the design. It was dated and, I felt, hampered by the abundance of various tones of grey. Most problematic was the fact that the index or landing page was terribly organised. It was a nightmare to navigate and far too busy. In addition, because the design was non-responsive I had had to put together a completely separate mobile site which had severe limitations. It seemed pretty clear that an update was required.

Finally it's happened. Over the last year I've made stabs at it, put together redesigned logos and toyed around with pastel colours on my proverbial drawing board in Photoshop. But ultimately I kept feeling as though I had run out of ideas that actually worked. I had a look and feel that I wanted to achieve, a mood of openness and whitespace, but little else.

At this point I ditched the scrap paper and pen - as well as Photoshop. I came at everything from a completely different angle; coding the design by hand from the ground up and making the most minimal of changes. It was a therapeutic, step-by-step approach.

I took inspiration from websites I discovered through Google searches like "minimalist blog designs" and "best writing online". I introduced new elements in the design slowly, moved things around a lot and played with the code and CSS styles for hours until I was sure in each case that I had something I liked.

Against TL:DR;

What really prompted all this was not only a general feeling of discontent regarding the old design, but also a genuine desire to improve the interface for a specific reason: I wanted people to read my writing. My blog posts are almost always #longform in nature. They are usually essays or explorative pieces which reject the common dogma that says blog entries will fail if they try to be too clever.

The kind of blogs and websites I value (and try to promote) online generally foreground lengthy, insightful, stylistically accomplished prose and that is what I'm working so hard not just to produce, but also to present.

Recently, I've realised that it's very rare for me to read anything at length on a PC screen. I've become addicted to Pocket - a mobile app that stores articles for users to read offline and in a very readable format. I can't blame you if you never read an article on this website except via Pocket or a similar app, in fact I would almost encourage you to do just that. However, a conscious effort was made during the design process to emulate the feeling of reading in comfort and at peace on a screen, despite that screen being attached to some kind of laptop or desktop computer.

A crucial feature of the new design which is intended to encourage this is the site's responsiveness. Responsive web design allows for a website to be resized in a browser window without portions of it becoming obscured in smaller and smaller panes.

Try it now for yourself, you'll see themachinestarts.com will adapt to whatever size browser you throw at it meaning you can choose to read an article in a scrolling format which presents no distracting elements to the right of the text. The site will also display well on most smartphone and tablet browsers.

One thing I spent a huge amount of time thinking about was the choice between serif and sans serif fonts. Initially, because of websites like thenewinquiry.com, I was interested in "going serif" when I re-launched. All the early prototypes for the design you see here included serif fonts only.

However, I had read this incredible article from 2008 by Alex Poole which discusses the century-old debate over whether serif or sans serif fonts could be described as more readable. As Poole points out, no-one has been able to prove such a thing either way. It seems much more important to choose a font that fits a particular design context and display it at the right size, in the right colour and with appropriate spacing.

Arguments over whether serifs make text look too busy or whether they in fact induce reading by providing a kind of vague outline to a given line of type seem irrelevant. In the end, I switched to sans serif because it became obvious that in the design I had come up with, sans serif fonts (here Arial and Verdana) would feel like a more natural choice. Serifs remain only in the titles of articles and sections and are intended to evoke a certain elegance, albeit in an intense flavour of orange.

New Features

Aside from these design features, there are only a few updates to the mechanics of themachinestarts.com which you will notice. The most important is the incorporation of the Disqus comment platform. Don't worry, comments you made on the old site have been preserved and will appear, archived, below new threads.

I chose to include Disqus because it enables simple sharing of comment threads via social media and allows users to track responses to their comments if they wish. It also moves away from purely anonymous posting which, for a website such as mine, feels like an appropriate change.

The second main difference is in how content is presented on the site's homepage. I've got rid of various modules which had previously cluttered this space and now the latest posts are simply displayed in a reverse-chronological-order list, with two paragraphs from the start of the article's text as an introduction.

Finally, I should mention that the site now uses longer, descriptive URLs for linking to articles. The old links still work, but for SEO and sharing purposes, I decided descriptive URLs would be a much better choice.

The remaining alterations are minimal and/or invisible. Quite a lot of updates have been made behind the scenes to various scripts and processes but you are unlikely to notice any significant changes in functionality - the new lines of code are there either to keep me or the site's servers happy.

Where We Go From Here

I hope you like the changes I've made to the site and I especially hope you feel motivated to return to it frequently and read the articles I post here. As I write this, I actually have two large essays in progress which I hope will be published initially by other publications so I'm very excited about seeing those get under way.

The whole process of re-launching themachinestarts.com has made me think a lot about how much I've learned about the web and how human beings interact with it since I first started posting here. I think this site has come a long way, as has my understanding of digital culture and I am pleased to say that I'm fully committed to continuing the journey.

All that's left to do is to ask you to keep in touch, tell me what you think, share writing you find here (or anywhere) if you think it's worth sharing, and - at the very least - stay connected.