What's in this article

      Planning a new website project is essential and prevents misunderstanding and disappointment for the client or web designer.

      Websites are complex and it's not always easy discovering what the clients expectations are and quickly and effectively learning about the clients business.

      For the client, when we undertake a new web design project, the sooner they can get an idea of exactly what they are paying for the better!

      It's very reassuring for the client and the planning stage allows for quick updates before the designer and developer get stuck in tackling the more time-consuming tasks of designing and building the project.

      Get brand assets together

      Make sure you have all your brand assets available, including logo, colourscheme and fonts / typefaces.

      You'll need these for you new website, so it helps to build your brand.

      branding.jpg

      Make sure your positioning is ready

      You need to know who you are, where you have been and where your business or organisation sits in the marketplace.

      You will need to know what your USP is (Unique Selling Proposition or Unique Selling Point), so you can plan the design and content of your website to communicate these to your users.

      This helps promote why your business is the one that people will want to work with or buy from.

      Work out your key audiences

      To make your new website as effective as possible, you need to work out the personas of your ideal customers.

      Knowing your customers intimately means you can design a website that helps them out with better information.

      This is then more likely to increase engagement, leading to more sales

      Check the competition

      Have a look at your competitors websites to get design and content ideas.  We don't want to copy here!  But inspiration and ideas are always a good thing before you start to think about the details of your own website.

      Competitors who are doing well are getting things right, so see what they're up to!

      Define goals for the new website

      You will already have some idea of the goal of the new site, so make a list before going any further.

      Is it to make more sales, build brand awareness, demonstrate your E-E-A-T, improve SEO etc.

      The Sitemap

      I always produce a sitemap first of all which shows the client what pages are going to be in the website and how they relate to each other.

      The sitemap doesn't take long to produce and can identify key issues early on. For example, is an important page buried too deep within the site? Or should it be moved up to level 2 or even level 1?

      Are some pages too similar, should they be merged? Or should one page be separated out into multiple pages?

      The sitemap gives a really great early on impression of how the user journey will work and for website redesigns, it gives us a chance to improve the websites architecture and refine what the client already has.

      For pages and sections that have moved or been renamed, we will add 301 redirects later on to preserve SEO and make sure users can find what they are looking for.

      For producing sitemaps I use XMind because it is a fast drag and drop desktop app that allows me to quickly produce sitemaps and export them as a PNG which I can then drop onto my headed paper layout.

      View XMinds website.

      The sitemap

      The Wireframe(s)

      Once the sitemap is agreed we know:

      1. How many pages there are
      2. What are our most important pages
      3. The architecture of the website, including how many sub pages we need to cater for in our navigation.

      Also, the client is happy because they have seen something for their money so far!

      Next is wireframing. It is MUCH faster to correct a wireframe than a design in Photoshop. This is because wireframes are much simpler and have less layers and extra stuff to worry about.

      This is why we do a wireframe stage and chop and change that before we go into our full page design. Again, clients will get to see something quickly so it really helps reassure them that you are working on their project and haven't run off to the far east with their money!

      For wireframes I use Balsamiq. They offer a free trial, then there is a one-time cost to buy it. Because it's a one-off cost, it is cheap because you won't be paying a monthly fee forever.

      Balsamiq is fantastic. You can drag in a browser window, then add rectanges and other elements such as blocks of text, video, maps, headings, links, navigation etc to quickly build up your wireframe.

      They look great too!

      View Balsamiq's website

      The Wireframe(s)

      Content and SEO plan

      Before and after your website is created, have a plan for what content you will update over time.  It's important to add to, refresh and develop your websites content over time to keep it competitive online.

      Search engines like Google like to see a growing source of information, so it'll help you rank higher in their search results.

      Create a calendar or plan, setting aside time each month, so you can consistently develop your websites content.

      Conclusion

      Hope this helps you plan your website projects better. Of course there will be an initial meeting or phone call and lots of communication in-between, but through careful planning you can help avoid disasters and the sitemap and wireframing steps really help to make a project a success.

      Join the discussion

      Want to have your say on this topic? Start by posting your comment below...

      Related Articles

      Keep up to date