Content design is, in my mind, a matter of storytelling. The object is to plot out scenes in an adventure that can be traversed in any order and — at the point the user decides to leave — always retain narrative consistency: in other words, the visitor should be able to describe their visit to someone else, and summarise what they found.

This website serves several principle purposes. It has been designed to meet all of them to the best possible standard. It is simultaneously a portfolio, a skills demo, and a sort of CV.

Portfolio site

Any work sitting in a portfolio case, and especially lurking on a hard drive, is effectively invisible. Having multiple skills and experience means that, even posted on a website, my best work might be overlooked. Many visitors may not even be looking for anything in particular, but I still want to make sure they see my potential. There are four ways I can address that:

Categories and tags

I’ve used the portfolio option of the Jetpack plugin to bolt on a content type for organising projects. The main advantage here is that I can structure projects by type. This is really only as effective as the taxonomy I decide upon: if my model for categorisation doesn’t match my users expectations, they’ll get bored, confused, or frustrated pretty quickly.

However, I absolutely don’t want to funnel my visitors too hard down a structure. On a project-page basis I’ve presented them with a panel to remind themselves where they are. I’ve also made heavy use of WordPress’ built-in tag mechanism, where each tag is a skill used to create a project.

Navigation

Notice that this website’s main navigation tree stops at the third level of categorisation. Further down than that, and submenu systems become hard for users to traverse, especially when we have the mechanics of flyout panels to manage: a slip of the pointer and the user has to start again. This is why we stop at a category page that encompasses an array of topic-similar projects.

Landing pages

The primary landing page is the home page, but it isn’t necessarily the only or even best one. A landing page is the entry point for a targeted conversation. In my site’s case, the gallery page is there to offer someone a tightly curated overview of my visual communication work. They can explore further if they want or need to, but many people simply want to see work examples, and not work through a structure.

An error page (404: “content not found”) is a type of landing page. Making sure there’s a consistent practice of redirecting old or redundant pages to replacements is essential: one should avoid simply deleting a page. But try as one might, there’s always the possibility of a bad or simply mis-typed link floating around. should not only be the final backstop, it should also give some generalised re-orientation.

Search

A site search tool is practically essential for any website with more than a handful of pages. It is important, then, to title each project clearly, and at least write a few words about each one for the benefit of the search tool.

Skills demo

I am lucky to have had the opportunity to learn multiple skills and tools in my work life. This website was designed specifically to evidence as many of these as possible. I’ve used both the built-in category and tag mechanisms to achieve that, but the whole website — its hosting arrangements; the WordPress installation, Theme building, and plugin management; the media-asset management; the development pipeline (local > staging > production via Git), its articles and blog posts; the social media links — is in itself a demonstration of my skills and experience.

CV / resumé

I want to give a potential client or employer every possible chance to see what skills I have, and evidence all of them. To that end, I’ve used WordPress’s built-in tag mechanism: every project is categorised for the sake of the portfolio, but it’s also tagged with the skill(s) used to create it. (Skills reach across categories.) If I want to pitch my services to a client, I can present them with a link to projects that evidences what they are recruiting for.

I’ve also leveraged the social networks I use to demonstrate my hobbies and interest are: am I the kind of person you’d want to spend your working week with? Here’s some help to find out.

I’ve got you covered!

Bish! Bash! Bosh!
This has been a case study in Web content design, but you can also see how I might use these skills to help you with your project.