Since January, I've been on a content outline streak. Two large higher ed sites and a smaller policy site are in the can, and now I'm moving on to another higher ed site. So, I thought I'd share a little bit about this deliverable.

---

What is a content outline?

Where I work, content outlines are the primary information architecture deliverable for the new or redesigned site. It's in outline format (0.0 Home, 1.0, 1.1, 1.1.1, 2.0, 2.1, etc.), and it becomes the supporting structure for the sitemap (the familiar boxes-and-lines rendering of an outline). Here, the information architect or copywriter combs through the existing source material, and working from the site's new strategy and goals, forms the written outline of pages.  

---

Why do you need a content outline for your website? 

The content outline is basically the Bible for the new, revised and old content on your site. Copywriters or editors will use the outline for guidance when revising and writing the new website. Generally, the content outline will capture at least the first three or four levels of the website's navigation, so that the project team can see where and how the majority of the site's content fits into the new structure. The goal is to have an intuitive home for all the content that has to be on the site.   

---

Where does it fit in the process? 

To put the website content outline in context, here's when it happens. 

• Goals and strategy for the site have been identified, and any primary user research needed to inform the content architecture has taken place. 

• An inventory of all the existing website content has been done. (To be honest, I think this step is wholly skippable.)

• Content outline time! 

• Sitemap

• Wireframes 

• Design, development, coding, testing, qa, etc.

Really, though, a content outline should be done any time you want to rework your site's content (or even a small section of content), independent of design or coding. It's a content thing. 

---

How do you write a content outline? 

So, you know whatever it is that you need to know about the strategy or goals of the site. Maybe you're just working on fixing a section of a site, and you know that you just need to repair the awful mess. That's a valuable goal. Or maybe you need to especially target an audience, or seek conversions, etc. Whatever it is, you're aware of it, and thus, you can begin. 

Step 1: Immerse yourself in source material. 

For sites with hundreds of pages, it's okay to spend a couple of days reading the site, particularly if you are unfamiliar with the project or the client. I find that coming into some sites is totally disorienting, like a bomb has gone off. As you click through the website, you'll notice wacky navigation schemes, hidden pockets of pages, wildly outdated pages and utterly confusing or contradictory text. This is totally overwhelming. 

After hours of reading and poking around, you'll strangely begin to know where everything is and what exactly it is that you are working with.

At this point, any print materials you can get your hands on can be helpful. People seem to invest more time and money organizing and writing quality published material than they do for their web copy.

Step 2: Draft the top level navigation. 

Once you've grown to understand the beast that is your project, jot down the main navigation labels--the big buckets. I'll use higher ed--let's say generic undergrad liberal arts college--as an example, since that's been on my brain lately. 

0.0 Home

1.0 Admissions

2.0 Academics

3.0 Campus Life 

4.0 Paying for College

5.0 Athletics

6.0 Alumni

7.0 Parents & Families 

8.0 Giving

9.0 Intranet

(various footer links) 

Group them into sets if need be. Move things around. Give them new labels. Sketch out the homepage. Once you feel comfortable starting with what you have, move on. 

Step 3: Fill it in with the ideal. 

What I like to do next is fill out the next level from memory. So, I might say for 1.0 Admissions, I want a page for a checklist, a page for requirements, class profile, request information form, dates and deadlines, open houses/tours, etc. I do this rough sketch for every section, thinking more about the goals than the content that exists right now. 

Step 4: Add in the reality. 

Next, I start to pick through the source material and fill in the blanks. I make notes in the outline for combined pages, new copy, or stuff that is pretty good as-is. I write in ideas for the wireframes, if I have any, like "consider adding an event feed from the calendar." I note when I see a form, or when a new form is needed. I write basic descriptions for the page and suggestions for callouts.

By now, I've touched every page on the site several times, and I've officially become some kind of expert. 

Step 5: Add some notes about your vision.

Corny as it seems, it helps to write an introduction to the outline where you clearly state what your guiding idea or plan was and highlight the major technique(s) you used to accomplish it.  This is not about teaching best practices for writing for the web, but should be your rationale or approach. Include any major issues that you've identified and hope to address. 

Step 6: Make a sitemap (if you need one), test it if you can, then relax.

You are now a subject matter expert! 

---

In a nutshell

A quality content outline expresses the vision for the new website. It sets expectations for how many pages and how much work is ahead. It's also the fundamental building block of a site...you've set the navigation and the IA, now writers can begin working on the content. You'll also have the exact navigation items needed for the design. From here, projects big or small, are off to a solid start. 

Here's a true story that serves as a metaphor for why your website needs good navigation and information scent. 

This weekend I conducted a search for chaat masala. I had a Mark Bittman recipe variation for dal, and figured I could just get it at my local super-sized grocery store. This store is, in fact, the largest grocery store in southwest PA, and I had gotten garam masala at smaller stores before. I checked all the obvious places: International, spices, where they keep boxed dinners, to no avail. 

Since I live in an area with a significant Indian population (for Pittsburgh), I am rather close to two Indian groceries, and I knew they would carry my spice. 

Grocery K

I walk in, and it's dark. The store is crowded with products, and things are everywhere. To me, it seemed like the organizational principle of the place was "put the product wherever there is room."    

Grocery M

I walk in, and it's brightly lit. The store makes sense instantly. Dry staples like beans, dal and rice are along one wall. Across from the rice and beans, rows upon rows of spices, herbs, tamarind, sesame seeds... Another aisle has boxed dinners, another for frozens, prepared foods, and even mark-down section. Candy is in front of the register. 

Why I chose Grocery M

Grocery M is familiar. Sure, the other shoppers were speaking in another language, and my knowledge of what I was looking for was slim (spice blend?). But, it was organized. A glance at the store's shelves told me what was in each section, and I found the spices in seconds. Once I found the spices, it took a little while to find my specific spice, but after I briefly browsed the shelves, there it was. 

Organize your content like store M, not store K.  

• Make sure your store is clean and brightly lit. Can someone glance at your website and get the gist of its contents? Or is it cluttered with distractions?  

• Are your aisles organized? Your content organization and navigation structure should make sense and feel natural. 

• Can a new shopper transfer knowledge? I had keywords, nothing more. But based on my experiences at other stores, I had a general idea where to look. I had a mental model. 

• Did the customer convert? Ultimately, I found what I was looking for at store M. Store K? Honestly, I bailed. I knew there were other stores in town, and I didn't want to waste my time. Ask your users and check your stats: are users fleeing your content because they can't find what they are looking for, or did they successfully complete their task? 

In my working life, I've attended tons of discovery sessions, conducted informational interviews and usability tests, listened to vendor demos and been in too many meetings to count. The thing that gets me the most are the questions. 

You have questions! This is good. What is not good is asking more than one at a time. You know the type. Those massive questions that stretch on and on, asking for 3 or 4 things, that include various other points as you go along. By the time the questioner has stopped talking, the answerer: 

1. Doesn't remember any of what was asked.
2. Only remembers the last question, or the first, or whichever one they managed to cull from the oratory.
3. Only chooses to answer the easiest question.
4. Ends up answering none satisfactory. 

 I remember being in journalism classes back in the day, when the rule was "if you want an answer, ask one direct question at a time." And to make it more fun, the question couldn't be answered with "yes" or "no." 

When you're conducting user research, or even trying to get to the bottom of an issue in a meeting, just ask one question at a time! And just ask the question: don't add fluffery, don't hedge and don't include your reasons for asking. You have a right to the answer to your question, so make your question easier to answer.

By the way, after you ask your question don't jump in to fill the uncomfortable silence (if any). The person is probably thinking. Thinking can cause answers. 

Update on 2011-01-19 02:49 by JMY

UX Matters just published a quality article about developing your interviewing skills. Great refresher!