The Two Things That Must Happen Before Any Website Design Project

 

Do you have a DIY website in need of a major refresh? Or are you starting out in your business and are in the process of either creating your own website or hiring a designer? Either way you’ve come to the right place! I’m going to be walking you through two super important things you need to make sure you do (or that your designer does) in order to design the most effective website.


Creating a website has so so many parts to it but for purposes of this blog post we can separate the process into two phases:


Phase #1: Strategy

Phase #2: Designing


Seems simple enough, right? Well, not quite!


There is a lot that goes into both phases but I wanted to focus on two of the most important things that need to happen in the strategy phase and in the beginning of the design phase.


Once you’ve defined who you are in terms of your business, who you serve, determined your brand style, have your branding visuals designed, picked your template, obtained your domain name,  and chosen a host then it’s time to move on to making sure you design with purpose and functionality in mind.


Side note: Before you keep reading make sure you grab the freebie I’ve put together for you that walks you through every step of the website design process, from defining your target audience to SEO.  



 
 There must be a strategy behind the way a website is designed. Sure, we can just throw in a couple things together and call it a day but we would be going about it the wrong way. Whenever someone lands on your website they are brand new to you and your site so you need to guide them to the pages you want them to land on.
 

What do I mean by “design with purpose and functionality”


There must be a strategy behind the way a website is designed. Sure, we can just throw in a couple things together and call it a day but we would be going about it the wrong way.


Whenever someone lands on your website they are brand new to you and your site so you need to guide them to the pages you want them to land on. The strategy behind your website will all depend on your site goals so whether you want people to opt in to your email list, contact you, buy a product, book a coaching call, etc…


Ok, so enough with the suspense, the two things that must happen before any website design project are:
 

  1. Creating a Sitemap/Roadmap

  2. Creating a Wireframe


Sitemaps/Roadmaps


Sitemaps also called Roadmaps are exactly that, a map of your website. They are useful because they help you create a navigation system for your website since you (and your designer) are the people who will need to know the in’s and outs of your website.


When creating this roadmap ask yourself:
 

  • How will your visitor get from the page they landed on to the place you want them to go?

  • What are the pages that will help get your website visitor to your end goal?


Keep in mind you should try to keep your navigation bar links at no more than 5-7 links because we don’t want to overwhelm our visitors with so many options that they get analysis paralysis and take no action.


Side note: Your homepage does not count as a link since you don't really even need to have a link labeled “Home”. Most people know that by clicking your logo they will we sent to the homepage automatically.


Here is an example of the site map for my website:

 JNL Media Co. Sitemap


You can be as detailed as you want or as general as you want but the more detailed you are the better. You want to get an idea for the flow of your website and what pages link to what pages so you know the scope of your project when beginning the design process.


Another reason to have a visual of your website is for SEO purposes. Why? Well in all your website, your homepage carries the most authority that it then passes on to some of the other pages in your website. So you want to make sure important pages are no more than three clicks away from your homepage.


There are a lot of great paid versions out there but if you don't want to pay anything I did the research for you and found the best option for creating free sitemaps. I used draw.io and loved it! It’s completely free and allows you add, drag, drop, customize fonts, apply your color palette, and more.  You can even save it into your google drive which is what I did in case I want to make changes to it later.


Wireframe

 Wireframe created on Squarespace


The second thing you should be doing before starting your web design process is to develop a wireframe. This is technically in the design phase of your website although I like to consider it  as part of the strategy phase.


When you develop a wireframe for your website you are setting the foundation for a well built website. It ends up saving you time in the end because you can focus on the flow and structure of your website without getting stuck on the design aspects of it.


Wireframes are basically white and black mock ups of what the end of product will look like. By not focusing on the color of a certain font or how you look on a certain image then you can actually focus on the structure of every page and what type of information will go where.


Back in the day, when Squarespace didn't exist, all you had was a blank template and your coding knowledge so people had to use software to help them create wireframes. But now Squarespace makes it super easy to create a wireframe by using the drag and drop feature!


So there you have it! The two things you must do before starting your website design project. Let me know if you have any questions on the comments section below or by emailing me at hello@jnlmediaco.com.


Oh, and don't forget to download the checklist I put together for you that will help make sure you take the right steps to creating and launching your website. Download it here.

 
Jessica Nicasio

Hey , I'm Jessica!

I am the designer and owner behind JNL Media Co.!  I help creative entrepreneurs & small biz owners create a beautiful Squarespace site that converts.  After almost two years in corporate I left so that I could  pursue my love for design + marketing and help other #girlbosses do the same through their business.

Obsessions: Traveling, Fitness, and Writing 

Location: Currently living in San Diego, CA



Categories:

 



Learn more: