I plan websites. Together with my team, I’ve done this hundreds of times for a huge range of clients in nearly every industry.
Of course, each site is different. But the planning procedure isn’t. So over the years, we’ve carefully honed our website-development process. And we’ve discovered a lot.
In this article, I’m going to share some of the most important lessons I’ve learned, and I’ll summarize the best approach to planning sites.
Whether you’re creating a site yourself or looking for a company to help you, this will be useful information. It’s an organized way of thinking – of focusing in at every step until you’ve created a site that works for your visitors and your business.
Now, this isn’t a marketing article. I’m assuming that you already have a solid understanding of your message and target market. That thinking should always come first.
And keep in mind that this planning process is most valuable for sites that go beyond basic brochureware. If you’re looking to build a simple site with 5 pages, you might not need a process this detailed.
But if you’re planning a site with more to it, this article will help you organize your thoughts and achieve a better end result.
This isn’t a question of how a site is organized or what it looks like. This is a question of features.
Think in verbs: Can visitors sign up for newsletters? Make a reservation? Create an account? Watch an animation? Buy a product?
Consider the actions a visitor can take (besides just surfing the site), and use those actions to create a features list. This is your first step.
For more complex sites, you’ll need a thorough description of all capabilities – what the features do and how they connect with one another. With this level of detail, you might create more of a functionality document than a features list.
Write it carefully and thoroughly. This is a key element in an efficient project process.
Examples of common features include:
By outlining the features you’ll need, you will answer the biggest questions about how to approach your project. You may need this information to build a team or select a vendor for the project.
Also, now that you’ve got web on the brain, this is a good time to make notes on all the general requirements of the site, such as search-engine friendliness, ease of updates, accessibility, printability, etc. Add these items to your list.
Since you’ve been thinking about what actions your visitors will be able to take, you’ve probably started visualizing the pages that will appear on your site.
It’s time to make a list. Don’t forget to include a contact form and a thank-you page.
Next, you’ll turn your list into an outline. Then, turn that outline into a flow chart. Draw lines between any pages that will be connected through links and buttons. And voilà: you have a sitemap.
A fancy word for all this is “information architecture,” but we don’t need to get fancy. The point is, you have now made the initial decisions about how pages on your site will be interconnected.
This is important for two reasons: First, it means that you can begin planning content – the text, images, etc. that will go on each page. Second, it helps you nail down the site’s navigation. These are essential steps in your web design process.
A quick note: In many cases, you won’t be the best resource for organizing the site – especially for larger or more complex projects.
The best way to make sure the website works is to get input from people who might actually use it. There are fancy words for this too: “user-experience analysis and iterative design.” But however you describe it, this process can be super important to the success and longevity of your site.
Usually, around this point in the process, clients start asking what the site is going to look like. So far, all we’ve made is a list and a flow chart. These deliverables aren’t very visual or emotionally gratifying, but they’re hugely important.
Sometimes it’s hard to be patient with a process that starts with high-level, abstract ideas – especially when all you want is to make something visual. But hang tight! We’re getting there.
Next month, you will see how the plan takes shape through the more visual steps in the process: wireframes and design…