PigPog: Usability Improvements

Learning from Jakob Nielsen, and improving the usability of the PigPog web site – adding summary sections and clarifying links.

Introduction

I’ve been reading through the old Alertbox columns from Jakob Nielsen’s excellent UseIt web site recently, and trying to apply some of his ideas to PigPog. Jakob is a usability expert, and through his site, passes on a lot of really good, practical advice on how users interact with web sites.

Writing for the web is quite different for writing for print, and Jakob is one of the few people who has really studied this, and is good at applying his own ideas – making his columns very readable. I wanted to try to apply some of the ideas I’ve learned from him to PigPog, hoping to make it a bit easier to use, as there were a few problems with the site as it stood.

Problems

No clear statement of what the site is

Starting from the front page, there was nothing to actually say what the site contained. The About page wasn’t really much better – offering some insight into the name, but not a lot else.

Most writing was ‘upside down’

Most of the writing on PigPog (certainly mine) followed the standard pyramid model – starting with background, filling in details, suggesting ideas, leading to solution. OK, so not many articles followed that as such, but my writing started at the beginning and lead to an end. On the web, no-one will get to the end. They’ll skip to somewhere else if you don’t get to the point quickly.

Links in the Blogs were unclear

If you clicked the title of an article on the front page, you jumped to the permalink for the article – a page with just that article. The title on that page was a link to – the same page. After that, a reader could go in a clicking loop and never find the link to the actual page the article was about.

Solutions

No clear statement of what the site is

The top of the content section of the front page now contains a statement highlighted in green, which clearly states what the site contains, without dressing it up in marketing speak.

The About page hasn’t really been changed much – it doesn’t really take long to explain what PigPog contains, once I stopped trying to make it sound ‘cool’ or ‘enticing’ and just said it. "Writing and photography by Sam Harris and Michael Randall." Job done.

Most writing was ‘upside down’

Jakob suggests the ‘Inverse Pyramid’ style – start with the conclusion, expand on it a little, then work on the background from there. If someone doesn’t understand why to read the article from the first couple of sentences, they won’t bother.

This would be a difficult one to go back and change, and is really something we need to learn as a writing style. I first attempted it in my recent article on Internet Explorer’s security problems, but it still needs work – I can tell that this article isn’t going in the right direction, but I’ll try to get better…

To try to encourage this style a bit more, and to make an easy way to improve older pages quickly, I’ve created a new style called ‘summary’, which can easily be applied to the first paragraph of any page or article, which I’ll attempt to begin all new pages and articles with – it’s the same green text and green dotted left border as the introductory sentence on the front page. Each page or long-ish article should now begin with this little green summary section to explain what follows.

Links in the Blogs were unclear

I’ve tried a bit of a quick fix here, that I hope will make things more clear. The title of an article stops being a link on the page with just that article on it. So a user can click the title to get to the page for that article, but on the resulting page, the same title is no longer a link. It should then be fairly easy to spot the blue linked word ‘Link:’ next to the title, or the link in the article, rather than going around in circles clicking the title.

Conclusions

Hopefully, these changes will make PigPog an easier site to use – which can only be a good thing. People who get lost in a site will probably never return. Remember Jakob’s Law – your users spend most of their time on other web sites.