We have to start somewhere. Something has to come first.

In 2001, I started working for the BBC in Cardiff. I worked alongside journalists and project managers for four years on all manner of web sites and applications; ranging from small niche content sites about surfing, through to redesigns of the homepage. All of these projects were approached Content First (but not this Content First), but not one of them had the content, first.

Having worked alongside news and media organisations for the past ten years, I’ve absorbed a lot about the editorial processes across three media: television, print and the web (and a bit of radio, too). I’ve rejoiced at the commonalities and grimaced with pain at the differences between how things are done; both in the organisations themselves, and the different output they produce. Some of those things we’ve taken straight to the web with some success. Others, we’ve tried and failed. Like trying to make websites like CD-Roms. Remember those?

The model that we took right at the birth of the web from print – the templated page and publishing system – is now under attack. It’s under attack from the premise that you need to know your content before you can design it. For anyone who’s worked in publishing, or had to design a highly scalable branding system, or a wayfinding system will know that is nonsense. You don’t need Content First. You need Structure First. Then you need Content all of the time.

Let’s be really clear about this. It is unrealistic to write your content – or ask your client to write the content – before you design it. Most of the time. Content needs to be structured and structuring alters your content, designing alters content. It’s not ‘content then design’, or ‘content or design’. It’s ‘content and design’.

Designing a magazine or newspaper system requires the designer to exercise rigorous restraint with a hugely variable melting pot of content. Working directly with an editorial team, you have to define what types of content you need to design for. News articles, opinion pieces, features – all of these require slightly different design treatment to communicate they are a different type of content to the reader. Design variance must be limited. Why? Well, time mostly. Newspapers and magazines run on incredibly tight timescales and content is literally pored into a mould – trimmed and teased a little, but the templates leave little room for movement. This is not bad practice. This is how content lives and breathes in a fast-moving editorial environment. It has to be fluid. It can’t be locked down early. Content First would not work here.

Content as structure

There is an emerging fallacy in our industry recently. The idea that you cannot create good design without knowing your content. Even I said that a while ago. But, that’s only half true. Newspapers, magazines and many other periodicals and publications in different media prove that assumption wrong every day.

You can create good experiences without knowing the content. What you can’t do is create good experiences without knowing your content structure. What is your content made from, not what your content is. An important distinction.

So you have to start with the structure not the words. What exactly is an opinion piece. What are the variables? Can we even define them? Images? How many? (to which, the response is always: ‘I don’t know, it depends!’). We can design around fluidity, but it means letting go of control. Again. How do we do that, then? How do we design around the fluidity? Well, we define structure; of our content, and the templates that content inhabits. We define the rules of the system to display the content in different ways (if we can) to help the reader understand the content better. As Erik Spiekermann says: ‘we give content form’.

Designers as Content Directors

Designers have always been involved with content. We’re not just concerning ourselves with what is visual. So how can we help our clients understand that when we say:

‘Content First!’

We don’t really mean:

‘I’m going to sit on my hands right here unless you give me my content. Finalised, proofed and signed off. Thank you very much.’

No, we don’t mean that. What we mean is:

‘We’d really like to understand the type and structure of the content for this project. Don’t worry, you don’t have to write anything yet, just help us understand.’

We can do this any number of ways, but recently I’ve found this broad process works for me:

1. Talking. And Post It notes. Get a room – preferably lock the door – and talk about the website or application. Not the content (yet). As you’re talking, jot down words that resinate. Then after you’ve talked, stick all the words up on a wall and start to make connections between. Some probably some fancy UX term for this exercise, not sure what.

2. Messy Mess. You should end up with a pile of loosly related words (not content at this point) about some stuff. This stuff is the very DNA of the website. The feel, the tone, the brand, the message through to the nitty gritty of content types, taxonomies, tags and technology. Now you need to sort it all out.

3. Iterate. At some point in that sorting, you will need to start tightening up the structure. Again, I’ve found doing this iteratively and collaboratively the most fruitful.

4. Structure. Now you should have some structure. At some point in step three, there will come a point when you or your client will say: ‘Yes, but what is this?’ pointing at a post note with a word on it. At that point, you get into detail and you start fleshing out what it is. This is defining the structure of your content. And it doesn’t stop here.

5. Page tables. A page table is basically a form for your content. Fill it in. Use this one from Relly, as it’s brilliant. This tool can really help your client later in the ‘oh my God, I’ve got so much content to write and I don’t know where to start!’ phase. It helps focus.

Structure First. Content Always.

Let’s stop siloing content, shall we? We did it for a while when we were designing a largely brochureware, templated web. Now, we’re trying to move that silo from one end of the process to the other. Let’s focus on structure to begin with, and think about content all the time. There is a symbiotic relationship between content and design. One cannot thrive without the other.

Let’s start with structure. Let’s know what our content is made from. Not, necessarily, what it is.