What pages / content / navigation should my website have?
Figuring out what to put in your new website - or how to clean up an old one
Avoid the "blank canvas" syndrome and find an easy and effective method for designing your website structure.
When starting a new website, having a blank canvas can be daunting. While you may have some idea of what you need to say, it can be tricky to decide the best way of grouping information to make it easy for your visitors to find what they need, while also ensuring that you communicate everything you need to say, in a simple and streamlined manner. Today I’m going to share an easy way to get started on developing content for your website. It's also a really useful tool for tidying up an old website that has grown organically over the years.
Information architecture (IA) is the fancy name for organising, structuring and labelling content, with the goal of helping your site visitors (users) find information and complete tasks on your website. Good IA is so intuitive that users won’t even need to think about it, while bad IA makes the whole process of using your website awkward and frustrating. The path through your website that users take is called the user journey, and there are usually a few different journeys per website, each depending on the user’s needs. One journey might end with the purchase of a product, while another might end with downloading a case study. The user journey comprises each click from the point of entering your site, to the point of getting what the person wants and then leaving. Our purpose in planning your IA is to make the journey as streamlined as possible, by providing clear signposts and putting the right information in front of the user at the right point in the journey.
You’ll probably have a lot of different information and actions that you want to have on your website, and there are often multiple different ways to organise them. Our goal will be to find the method that best suits the way your visitors will use the website, not necessarily the way that matches your internal company structure or personal filing method. For example, you may have a bunch of client testimonials, so at first it may seem that having a page called Testimonials is the way to go. But let's say your goal is to get someone to buy something on your website. By putting the testimonials on a separate page, outside the normal purchasing user journey, you are then expecting your users to magically know when to click on the Testimonials link, which may take them outside of their optimal journey towards buying your product - if they even click that link at all. It may make more sense to sprinkle your testimonials around the site, presenting them just before decision points, to act as reassurance to move the user on to the next stage in the journey.
Card Sorting - The Brain Dump
With all of this in mind, I suggest the following approach for starting your website content plan: it’s called card sorting, and all you need to get started is a big stack of index cards or Post-It notes and a fine point marker pen. Card sorting is best done using actual physical cards or sticky notes, so you can easily move things around. The process is simple: on each card, write down a concise few words that summarise a piece of content or a user action. It’s best to do this fairly quickly and stream of consciousness style, letting each note lead on to whatever association comes next. I suggest the marker pen to stop you writing too much on a card: the card should be a short summary describing the content, not the actual words that your website will have. Don’t stack the cards in groups at this stage, just write.
My pointers:
Each card is not a page / menu item. The cards are meant to represent information or actions. Try not to think about “pages” but instead about user actions or chunks of information.
Be as granular as possible. A card that says “Downloads” is not specific enough. Much better to have a few cards, with “Download price list” and “Download case study”, etc. Likewise for “Contact”. You’ll want cards that say “Email address”, “Map” and “Office Hours” instead. You can always condense things later, but starting out being really granular may make you see things in a different way and open up new ideas for how content can be grouped.
Don’t pre-think it. Coming to the table with preconceived ideas of how the information should be grouped can actually hinder the process. Using my earlier example, you might have a preconceived idea and just write a card that says “Testimonials”, but you’d probably be better off with multiple cards that say “Testimonial about product A” and “Testimonial about service B”, etc. This will enable you to move things around more easily if need be.
NO JARGON! Call a spade a spade. This is the most important point, and the one that most often leads to bad IA. Let’s say your company’s series of events are called “Reverb” - so you write this on a card. Do you think users will know what this means? Nope. Unless you’re Burger King, no one will know what Whopper means. Your card should say “Event calendar” or “Upcoming event listing”, and may also include cards such as “Sign up for an event” or “Past event photos”.
Be thorough. You can always throw away or revise cards later, so put down EVERYTHING. And don’t forget the boring things like your Privacy Policy.
Card sorting image courtesy of Rosenfeld Media
Sorting the Cards
Once you have all the cards, then it’s time to sort them. I actually recommend doing this with a colleague, your web professional (someone like me) or even better - real customers or prospects. For larger websites/projects, card sorting is usually carried out with groups, but you can do it with just a couple of people, especially if your website is small.
Sorting is the tricky bit, since there’s more than one way to organise any set of information. Cluster the cards together into groups of associated content, always remembering the end goals of the user journeys for your site. When you have a group of cards, get a different colour card or pen, and write a title for that group and stick it at the top. At the very end, once you’ve put all the cards into groups, take a high-res photo (make sure you can read the cards!) or type the results up into outline format. However: don't do this immediately. I encourage you to play around with things first.
My pointers:
Put similar groupings next to each other. Although we are not necessarily aiming to end up with an actual navigation menu at the end of the exercise, this process should lead us there, so it can help to place similar groupings next to each other, or to even create a parent title for these.
You can have duplicates. Let’s say you want people to be able to reserve a table at your restaurant from either the dinner menu page, or the homepage. Don’t be afraid of having two “Reserve a Table” cards (see next tip). Or, perhaps consider having this function at the bottom of every page, as part of a chunky site footer - in which case, you’d have a title card that says “Footer” with this card underneath.
Remember that websites can (and should!) have links. Putting a piece of content in one place doesn’t mean it can’t be accessed from others. Many websites cross-link to internal content from multiple places, so you can indicate this on your cards. Just stick on a smaller note or write in pencil to indicate when a piece of content should be linked to/from elsewhere.
You might end up with leftovers. It’s not uncommon to have a couple of cards that don’t fit nicely anywhere else, but if you have a lot, it may be a sign that your clusterings aren’t quite right. If you do have a couple of rogue cards, think about whether they are really important, or if they could be absorbed into others.
Think about hierarchy if you can. Remember the user journeys and think about putting the “meat” in the most prominent locations, and reserving the “potatoes” for something like a secondary menu or footer. For example, your online shop would want the products featured prominently, but “Returns Policy” could sit in a less visible location. It can help to visually separate these hierarchies on your table or wall when doing the sorting.
Try multiple different groupings. Don’t rush into one final set of groupings without considering other possibilities. It can sometimes help to take a photo of a couple of different approaches and sleep on it and/or discuss them with other people before firming up what’s best for your target audience.
What next?
Once you have completed the card sorting, you can then use the results to help create your sitemap (and potentially wireframes). The results of the card sorting will inform your content framework, as well as indicating the required functionality for each page/section. My blog post about the elements of a website explains what all of these terms for elements mean and how they interact.
Crafting the actual website content (words & pictures) is the next big step, and the best way to do it really depends on your website’s purpose, audience, brand values and so much more. There’s no magic formula because every website is different, but I will try to give some further tips in a future blog post. For now, I hope you will try card sorting. It's not just for new websites; it can also really help improve the user experience on old websites that may have had content bolted on or changes to the business over time.