Everything you need to know before designing a website (checklist included)

https://www.spacetoflow.com/

Between the images, design and copy, there is a lot to think about when designing a website. And you want to make sure you get it right, so you end up with a website you absolutely love.

So with that in mind, I’ve outlined the key steps involved in creating a website that not only looks great, but is also created to attract the right people to your business.

There’s a comprehensive checklist at the bottom of this post for you to download, but first let me give you my top tips so you know what each element of the checklist means. With the tips below, I’ll teach you how to create a website that is true to your brand, with examples of how I did it during the build of Space to Flow’s website.

 
Step_1.png
 

Forget about the website and focus on your brand. 

This might seem counterintuitive, but it is quite common for website design projects to turn into rebrands. That’s because your website shines a light on what you do, how you do it and why you do it. The entire experience—from what you say to how it looks and how easy it is to use— needs cohesively align with your brand.

If you aren’t clear on your brand, it’s more than likely you will end up designing a website that ‘just doesn’t feel right’ (I hear this line a lot from people who built their websites without a brand strategy in place).

To make sure you don’t end up in this situation, ask yourself the following branding questions before you embark on a web project:

·    What values does my brand stand for?

·    What problems does my business solve for my customers?

·    How can I show up for my audience in a way that matters to them?

·    How do I want to be seen in my industry?

·    What do I want my website to achieve? (sales, enquiries, subscriptions, …)

If you struggle to answer some of these questions or you have been thinking that a new website will solve your branding problems, I encourage you to spend time getting clear on your brand.

The good news? I created a Brand Direction Package for people just like you, who need creative direction and strategy without the price tag of a full branding and logo design project.

A brand strategy is not just about visuals. It helps you to make decisions about products, services and digital content for your ideal customer.

 
Stpes.png
 

Set strategic goals.

Alright, once you are across your brand and why it appeals to your target audience, it becomes far simpler to set strategic goals for your website.

This stage is guided by the people who will be using the website and what kind of information they are likely to be looking for. You want to set objectives for yourself (such as selling a product, booking clients or growing your subscriber base) and work out how to align these with your audience’s needs.

Then you can map out how you want your audience to interact with your site—this is known as the user journey. The goal is to understand what information you need to provide from the moment a prospect lands on your homepage in order to introduce your brand and guide each visitor towards your objective.

It’s worth noting that most users will not become paying customers the first time they visit your website. That is why your brand strategy, together with consistent brand presence and messaging, is so important. These elements allow you to build trust through a series of interactions with your audience, so they choose to invest in you.

A common user journey often looks like this ... a prospect finds you on social media and visits your website to read a blog post you have been promoting.

While they are on your site, they might sign up to your mailing list via an incentive to do so, like a discount for a first purchase or a free downloadable, and start reading your emails. Then they begin to trust that your products or services are as good as you claim they are.

Eventually they decide they want to invest money in what you have to offer, and will look for final reassurance that they are making the right decision (this might be case studies, guarantees or reviews/testimonials).

And, finally, they make a purchase.

This is just one of many possible user journeys. Some may be shorter and more direct—especially if the prospect is a referral—but you can see from the example above why a lot of research and planning needs to go into a well designed website!

By understanding what information will appeal to your customers at each stage of their journey, you can work out which other elements you need, like a free downloadable (which is also called a lead magnet), copy and images. I promise the effort is worth it, because it will save so you much time and energy in the website building and revisions phase!

Other considerations to make in the planning phase include:

·    The functionality it needs to have (e.g. forms, videos, plug-ins, blog, shop, etc.)

·    What information your audience needs to become a customer

·    How you want to be perceived through your website

 
Step_3.png
 

Make an outline and get organised.

This step starts with a simple wireframe, which is a process of mapping out each webpage without having to design the whole website. Wireframes can be created using an app or by simply sketching on a piece of paper.

When planning the site, ask yourself what you need to showcase. For example, do you want a more image-focused site? Or do you need to communicate who you are through copy?

Different pages of your website will play a different role in the user journey. Your website should …

·    Tell your visitors clearly what you do and why (home, services, product pages)

·    Showcase who you are and what qualifies you (about)

·    Build trust (testimonials, case studies, blog)

·    Facilitate a purchase (online bookings, shopping cart)

·    Allow people to connect with you (contact, social media links, sign-up forms)

A solid outline acts like a framework to support the development of the website. In this process, you will hear the following terms, and it’s useful to understand what they mean …

Call to action (CTA) → A CTA is the specific action you want a visitor to take on each page.

Messaging → Define the top five key points you want potential customers to know and integrate these consistently throughout your site.

Offering → Your audience needs to grasp what it is you offer within a few seconds. Your home page is the best place to succinctly show that you understand the user’s pain points and have a way to help them.

Opt-ins → This is the form a visitor will use to sign up for your enewsletter or download a free lead magnet.

Search Engine Optimisation → SEO relates to how well your site ranks in Google and other search engines.

Testimonials → Social proof is incredibly powerful for building trust. Try to request testimonials before your web design project begins.

I should note here that you are not expected to have all this figured out before you engage a designer. A good designer will guide you through it all, and hold one or more briefing and strategy meetings at the start of the project. A lot of the important planning work is achieved in these meetings. Based on the planning, the designer will then help you to understand what elements you need to supply and make it as easy as possible to organise them.

Before these meetings, think about how you want the site to look and feel, what frame of mind visitors are likely to be in when they are on your site and what objections they may have about purchasing from you.

Also be prepared to describe your brand in as much detail as possible (e.g. are you high end or budget, professional or informal, minimalist or over the top).

 
Step_4.png
 

Make decisions based on your brand style.

STEP5_cta.jpg

You can draw on your brand foundations and style guide to refine the look and feel of your website. The key style elements include …

Imagery → Whenever possible, invest in professional photography. This ensures the images align with your brand and are truly unique.

Typography → Beautiful type combinations are an effective way to set yourself apart, but try to stick to two or three fonts for your website. Squarespace has an amazing range of Google fonts as well as premium fonts.

Colours → Your colour palette should be diverse enough to allow for contrast and accents, but simple enough to be harmonious. Two accent colours and two neutrals, plus a colour for your website background and one for your copy is sufficient.

Copy → Your copy is most effective when it is developed in line with your brand foundations and strategic objectives. Write your copy to express your unique personality while guiding the user to a specific action, such as sending an enquiry or subscribing to your mailing list.

Speaking of copy, it is a good idea to have all your content ready before design commences. If you work with placeholder text and write the copy as an afterthought, you risk wasting your time and money making several changes by changing the design to accommodate your copy.  

Wondering where to start with your copy and messaging? When we work together, I give you a detailed website workbook that guides you through the content you need and helps you structure your site (cue sigh of relief).

Another common struggle my clients share is writing copy that feels a bit generic, and wondering how they can jazz things up. This is often a sign you aren’t truly in touch with your brand and ideal customer, and that is where my Brand Direction Package is so useful for kicking things off. This package also allows you to work with me to see if we are a good fit before building out your website.

 
 
website_planner_journal_pin.jpg

Save time planning your website … here’s that checklist I promised.

If you’ve stuck with me this far, you must be eager to get started on your own website (and I’m so excited for you). I created the Website Planner checklist below to keep you on track as you piece together all the elements you need to get organised, which in turn makes the process simple and stress-free!

 

PS— Maybe you don’t know where to start or think you can’t afford to have a professional website designed. Check out my services page to see how much a website project costs and what it includes. You can always contact me with any questions you have! I’d love to hear from you.