Recent Updates

Speed & Optimisation25 Nov 2012
Usability11 Apr 2012
Planning11 Apr 2012
About Me / Contact Me11 Apr 2012
Home11 Apr 2012
Last updated: February 19th, 2012  
Viewed times 

Planning Strategy

A successful website needs a sturdy base, and the best way to lay solid foundations is with good content architecture and strong structural planning. Structural planning is often overlooked and sometimes skipped altogether, but missing out this vital step will almost certainly result in upheaval of resources (and quite possibly your sanity) later down the line. 

I'll reiterate here that the planning stage focuses only on navigation and content organisation rather than having anything to do with the cosmetic design. 

Understand what you're working with from the start

If you start designing before you understand the type and amount of the content that a website will contain, you'll inevitably end-up trying to push pieces in where they don't belong - square peg, round hole, anyone? The best way to avoid this is to gather as much information at the start of the project as you can. That's easy if you're making a website for yourself - you'll already have a fair idea about the content that it will contain - but you'll need to do a lot more groundwork if you're making a website for somebody else.

Unless your client is exceptionally organised (which they probably won't be), or unless you're working on a redesign, this could mean that you're provided upfront with text documents, images, logos, videos and audio, etc. Most likely this will not be the case, and it doesn't need to be either since this stage relies less on physical substance and more on understanding. So, get everyone together who needs to contribute and discuss the following;

  • Goals: What should the website do to meet the expectations of the client and their customers (the website users)?
  • Marketing: The website should compliment and enhance the marketing plan - branding will influence design and structure.
  • Roles: Decide who is responsible for what - you need to know who is involved to manage workload and expectations. 
    A successful website can be a large undertaking so it is important to agree upon the contributing roles. Multiple roles might be adopted by one person but they typically include;
    • Representatives from each key department of the company
    • Project manager
    • Marketing manager
    • Content writer / editor
    • Website designer / graphic designer (illustrations, photography)
    • Website programmer / developer (AJAX, ASP, Flash, HTML, Javascript, PHP, etc.)
    • Website administrator / publisher
    • Technical support (will an administrator need to be trained?)

Once you have these bases covered you can then begin learning about the type of content that will be included on the website and, at the same time, work on the information architecture by using some of the techniques detailed below.

Card sorting

Card sorting is a really simple and cost effective way to organise a website's information architecture and it gives a valuable insight into the way website users structure content themselves.

You start by giving blank cards to all the clients taking part in the exercise. Ask them to write the names of the most important website pages/areas on a few of the cards and then gradually work down the hierarchy until all content has been included. What this should give you is piles of logically sorted cards, with related content, that can be transposed into a user-friendly navigation system.

Since the piles of cards will be loose when they're handed back to you, it's a good idea to number them as soon as you can and bundle them up together with rubber bands.

Paper, post-its and sketchboards

Paper can be a fast and easy way of brain-storming ideas and capturing thoughts quickly. You can sketch out the information-flow and move pieces of paper around until a collection of ideas gels together in a cohesive and logical way. The downside is that paper is only a temporary medium - the pieces get easily jumbled so it's not easy to transfer the information or share it without first digitising the final draft.

Sketchboarding is very much like creating an animation storyboard and, in basic terms, equates to rapid prototyping via sketching with markers, sticky dots and post-it-notes. Sketchboarding is a collaborative approach involving others, so it's a great way for clients to feel part of the project from the very beginning and they can easily see what your vision is moving towards.

Site map and flow chart diagrams

Site maps and flow/organisation charts are an excellent way to illustrate website hierarchy, as their joining lines and pointers clearly show navigational paths and the relationships between pages. The negative impact upon production time and upkeep can be quite costly though; You may need to make several revisions during the initial planning stages, so paper diagrams can fast become a tangled web of crossed-out corrections, and digital versions can be a pain to update quickly, working on the assumption that the person making the updates can already use the software effectively - because of this, digital diagram editors seem to have little benefit over good ol' pen and paper. Still, a digital diagram has the benefit of being easy to email to clients for their records and they look much neater than a scan of a scratchy pencil sketch. 

There are many digital flow chart softwares on the market and the likelihood is that you're already familiar with their interfaces and many of their features though use of something like Microsoft Excel. Alternative free tools on the market include;

Effective planning tips

Whatever your choice of planning methods, here are some tips on how to go about structuring your content effectively;

  • Avoid planning website architecture around a company's internal organisation chart.
  • Focus on user needs and expectations only - pander to the user, not the client.
  • Base the architecture of a website on its content rather than creating content to fit the architecture.
  • Give pages clear, concise, descriptive names.
  • Only include content that is useful to the user.
  • If you can't explain why a page is needed in a few words, leave it out.
  • Unless you're working on an Intranet site, avoid internally-directed content that exists solely to stroke big-wig egos.
  • Imagine a user navigating the website - what would they need to do to achieve their goal?
  • Not all content needs its own page - some information might work better in the footer or in a side panel.

Where to next?...

Once you've planned the wider scope of your content architecture and navigational structure, you can then move on to what is considered to be the first stage in the design process - mock-ups and wireframes. This stage concentrates on planing the zones of your web design only; where the main content will go, how the menu will be placed, what space to dedicate to headers and footers, etc. It covers the layout basics without encroaching onto any merry visuals or fussing about what colours or font to use.

Other pages in this category