Mari Kondo from the Netflix series “Tidying Up” has made millions from inspiring us to organise our homes, roll our towels and keep only the things that spark joy.
While websites don’t house our treasured possessions, if we took the time to organise them well, they would spark joy for the user.
The thing is, website planning is often viewed as a creative process but what if it was approached more like an organisational process? What if you could KonMari your website into shape?
Well, you can. Here is your ultimate website planning guide.
Why users are the focus of website planning
Just as an orderly home is a tranquil and inviting place for the residents, so is an orderly website. That’s why, when undertaking a website planning project, your client’s intended users should be top of mind.
It’s a common mistake to focus on branding and creative copy ahead of the user experience.
The reality is, if you don’t organise your website’s structure, content, and design with the user in mind from the outset, you may find that your clients’ customers get lost or are lost, or your client’s site needs a redesign a lot sooner than they anticipated.
Website planning steps
Below is a simple checklist for the website planning process.
1. Define your client’s purpose and goals
The first step in website project planning is to establish your customer website’s purpose and goals.
If your customer’s goal is more search-based traffic, their website will have a different look and feel to if their goal is more referral lead traffic. If their goal is to get visitors to subscribe for updates, their website will have different functionality to a website that is about sending the visitor to a youtube channel.
2. Establish the budget
Your customer’s budget size will largely determine if they are a good fit for you. Some agencies charge tens or hundreds of thousand dollars and some only a few thousand. It can be difficult for your customers to know who to trust. Get that they will want to know they’re in good hands with you. Encourage them to talk to previous clients and check out your portfolio.
If you’re a small or solo agency, differentiate yourself as a quality service provider. Clients know that larger companies have massive overheads and may get a better deal with a smaller agency, but if they are haggling on price, you may not want them as clients after all. Your value is in being able to handle their project smoothly and professionally.
Communicate Factors that will increase the budget
With so many apps and shiny digital toys that make it look like magic happens in an instant, it’s easy for clients to get caught in the trap of thinking that putting a website together is easy and quick.
Websites can be simple and complex and everything in between, but here are a few common aspects that can increase the price of a website’s development.
E-commerce platforms have many moving parts and, even with platforms like Shopify now available, the set up can be intricate, particularly if your client wants a Shopify store to seamlessly integrate with their web presence.
Online courses and programs
Many clients aren’t aware that setting up online courses and programs requires a lot of skill and expertise and often a lot of coding experience, even if using a platform like Teachable or Learndash.
If you are setting up a membership platform for a client that includes a forum or social media element to it, these can be extremely technical and time-consuming to set up.
Custom tools, mobile apps and wizards
Custom tools, mobile apps and wizards can be extremely technical to set up.
Completely customised platforms
If your client wants a completely customised website built from the ground up, this will take many many hours to develop and include a team of backend and front end developers as well as copywriters and UX designers.
If you keep adding features to your website, that will definitely blow out the costs, and usually after your client’s decided on a budget and accepted a quote. It’s important to establish features at the outset and stick to those. Otherwise, you may find the project takes months to complete. Your client can always add features down the track so doing things in stages is a great idea.
Resources for calculating website cost
Check out this post from PageCloud that includes 11 different website examples and factors that effect their costs.
3. Get your client to complete a creative brief
A good agency will give clients a thorough creative brief or offer a creative brief workshop. Read more about creative briefs here.
We’ve written the ultimate guide to creative briefs. Read the article here.
4. Create a content strategy
Content can sometimes be an afterthought and it shouldn’t be. Your client’s content strategy should drive the design, not the other way around. Sometimes it becomes apparent during the content planning stage that a change in branding is needed, so this step is critical.
Creating a content strategy begins with an analysis of your client’s current content (if you are not starting from scratch) and then the intended website users. Who are they and what is their journey to your platform likely to be? What considerations do they have? What are their pain points and needs? All of this information is essential for providing a good user experience and user flow. What questions do your client’s target users have that could be turned into content opportunities and stories? What are their browsing habits?
5. Establish the information architecture
Information architecture helps users know where they are on a site, what they are looking at, what its purpose is and what they need to do next.
Essentially, the information architecture looks at a site’s overall structure, organisation, navigation, and searchability.
A good information architecture informs the copy, design and user experience. It includes:
- page and tag labels
- each page type’s design and layout
- overall user journey
- user flow
- wording and key phrases
- menu and link logic
A quality agency will work with a specialist content strategist and/or UX designer to develop the information architecture. This is particularly the case for larger, more complex projects. It’s not as critical with smaller projects but as a developer, ideally you should have your heads around the importance of structure, navigation, wording and labels, SEO and user experience or be able to work with someone who does.
6. Create wireframes based on the Information Architecture
The wireframes allow your client to see what the site look and feel will be and give you a sense of what content you need for each page style. If you’re developing a website using a WordPress or other template that isn’t such an issue but it is if you’re developing a custom site.
7. Create the content for the site
It’s critical to have the content ready to go when the project begins and as you know, that’s exactly why Content Snare exists. We saw the pain that both developers and customers experienced because the content wasn’t done and we wanted to do something about that.
Content is not an afterthought. Your client’s content strategy should work hand in hand with a site’s design and technical aspects.
Your clients’ websites cannot be completed without the copy so, if you want to avoid delays, it’s best to address this early in the process.
As a copywriter and content strategist, I find the smoothest projects are the ones which get everyone around the table from the beginning and where there are open communication lines between team members.
8. Beta test the site
The beta site is the test site. You send it out to stakeholders for review and feedback, and then tweak it to perfect the user experience.
There is a stupid array of technology that enables developers to test the user experience. Some of these are:
Split testing is recommended when you have thousands of users coming to your site each day. It is useful for testing messaging and design aspects and you can tweak the options over time until you’ve established the optimal user interface.
Heat mapping shows you where your user goes on the site and highlights any trends that can pinpoint design or navigation flaws. You can access heat mapping through specific apps or even through Google analytics.
You can track the user journey through your Google analytics dashboard, through UTMs, through bit.ly links etc.
You can also ask your customers to fill in surveys and feedback forms or even provide a tool that enables them annotate issues and changes on the actual web page itself before it goes live.
Things to consider when beta testing the UI:
- Does the user find what they need, where they need it, when they need it?
- How is the user navigating the site? Do they constantly go back to the home page or are they gravitating towards one menu item over another?
- What content is most popular? What is least popular?
- Is the messaging attracting the right visitors?
9. Launch the site
Create a content marketing plan that integrates with your other marketing and make sure that your client’s website contains everything it needs to support their marketing and vice versa. Make sure their site is well and truly ready for launch and encourage them to let their people know.
10. Create a maintenance plan
Site maintenance is critical and yet many people forget this. It is primarily critical from a security point of view. When you fail to regularly update your website and any plugins you use, you are more vulnerable to attacks. This isn’t so much the case with custom-built websites that don’t use plugins but, even then, there are always security updates on any cloud-based platform you use and you’d be wise to stay on top of them. The other factor is that sometimes plugins become obsolete or may fail when you upgrade a website platform and these can take your site down. The impact of this is you may lose business and your reputation may be hampered.
Be clear on who is responsible for maintenance. If you are managing this internally, be sure to communicate this from the outset. If not, make sure you get quotes for maintenance and factor this into the budget.
Website planning tools/apps
There are many software tools on the market that can help you implement your website planning process. Here are some of our favourites.
- Content Snare — well, we don’t mean to blow our own trumpet but that’s what we’re here for… helping you gather your content and get it done. Content Snare is the ultimate website content planning tool.
- Draftium — An amazing tool for creating and collaborating on wireframes.
- Fresh Design — This site is chock full of awesome design ideas. Be inspired but be warned, you might get carried away. https://freshdesign.io/
- Marker – Marker is excellent for bug reporting and you can send your annotations direct to Trello and other project management platforms.
- Hotjar — for heat mapping, user flow, instant visual feedback and annotations, Hotjar is awesome.
- Invisionapp — Invision is a wireframing and web prototyping platform that enables you to communicate your information architecture clearly.
Over to you
As you can see, planning a website is a process that requires organisation, a great team and a lot of moving parts. The more complex the site, the more involved the process and the bigger the team you will need.
What other aspects are important in the website planning process? Share your ideas in the Content Snare group on Facebook.