How to prepare to create a website (Part I)

As a web designer, you might find yourself struggling to bring your vision or idea to life.

Not because you don’t know how to code – you might not need it – but because you don’t know where to begin to take your design idea into Squarespace.

This series is going to guide you through the process, MY process from going from idea to full website design.

In these next posts, we’ll be looking at each of the steps you should be taking before you can successfully create your design in Squarespace.

Ok, I know that doesn’t sound fun. Perhaps it even sounds counterintuitive.

But I promise you, each of these phases or steps will help you enjoy the design process in Squarespace even more, by helping you avoid going blank when its time to move on to a new section of the page you're creating.

Ready? Let’s do this.

 

You need to have a goal

It’s pretty obvious... right?

Otherwise, why would you be creating a website in the first place?

But the trick here is not having a reason for creating the website, but one or two main goals your client wants to achieve with it.

This way you’ll be able to give each of the pages of the site a purpose, making it a lot easier to think about what content should populate them, and in turn find out which features you should look for when it's time to pick a template.

 

Let’s assume the website you're building is all about flower arrangements for weddings... and please keep in mind I know zip about how the flower arrangement world works!

 

So, what would be the site’s primary goal?

  • Getting more visitors to buy your client's service or products?
  • Getting new subscribers on an email list so she can sell them infoproducts or courses?
  • Creating a side income through affiliate links?

 

I’ll assume you said getting more clients to buy a service. Great.

 

Now, what is the site’s secondary goal?

  • To get those non-buyers on your client's email list so she can pitch them her services later on?
  • To create a side income through affiliate links?
  • Offer a membership to those who buy her services or products?
  • Invite those who already purchased from your client to become affiliates?

 

Alright, let’s say your client wants to have her clients become ambassadors, referrals or affiliates of her brand, to promote her flower arrangement service to their friends and family.

 

So, with those two goals in mind – and assuming you have most if not all her content – you can already start thinking about what pages to include in the site.

 

Planning your pages

“Wait, aren’t you going to talk about design here...?”

Yes, but to be able to build a design that makes your client's content stand out, you need to have that content ready – or at least a VERY clear idea of what you’ll be showcasing – and then build the design around it.

Always, always, always fit your design to the content, NOT the content to your design.

 

Want to know if you are doing it/have been doing it the hard way? Then ask yourself these questions:

  • Have you tried to recreate part of a drool-worthy pin, and even when you’re using the exact same disposition of block + text, for some reason it doesn’t look good on your design?
  • Are you annoyed with how text-heavy the pages look?
  • Are you changing templates over and over again hoping one of them will magically make the site look good?
  • Do you find yourself getting rid of chunks of text just because they don’t fit the space they’re in?
  • Do you make up random bits of text out of the blue, because “there needs to be something else there” to make it look better/even/symmetrical?

 

If you answered yes to 1 or more of these questions, you’re doing it the hard way...

So, let’s move on and see how you can do it the easier way.

 

ABOUT THE MAIN GOAL

Referring back to those goals from before we have that the primary goal of the website is to get more visitors to buy your client's service.

 

To win new clients, they need to know a couple of things first, right?

What your client sells, how the purchase process works if it’s not something straightforward, examples of her previous work, testimonials or reviews from previous buyers wouldn’t hurt and of course, a way to have them purchase the service.

 

  1. In this case since we’re talking about flower arrangements, photography is probably the best way to go, so you’ll definitely need to create at least one gallery page to show off those arrangements.
  2. In these galleries you can simply use examples of her previous work or a mix of past arrangements and ideas she's come up with.
  3. Regarding the process, it’s pretty simple, people contact her to talk about ideas and go from there, so a longer explanation might not be necessary.
  4. For testimonials and reviews, it might look cleaner if you create a separate page for them, perhaps with some images of the events next to each of them.
  5. And to buy the service, you definitely need to setup at least a prominent contact info section or a contact form.
  6. Of course, let's not forget to add her story or bio about her brand so people know there's real people behind it.

Ok, cool!

 

ABOUT THE SECONDARY GOAL

Your client wants to eventually turn clients into ambassadors and referrals.

That means that she needs not only a way to keep track of those ambassadors through a software or third-party app, but also a way to give them the information they need to know, to apply as an ambassador.

So, you could add all that info to a page on the site where she can send her clients after purchase.

 

It seems like we now have a good idea of what will go into your client's website, so how about we plan the sitemap to start organizing that content?

 

Planning your sitemap

A sitemap is basically the organization of your website pages. Which ones will be primary pages, secondary pages, and so on. This will help you see how many pages you’ll actually need to build.

Let’s start with the pages that stemmed (get it?) from goal #1.

 

You need at least one gallery page to showcase her work, but assuming not all her arrangements have the same style, how about you create separate galleries to sort them by categories?

These can be called: whimsical, traditional and minimal.

 

Ok, so this way you’ll have:

  • Gallery
    • Whimsical
    • Traditional
    • Minimal

 

Next, regarding the process we agreed it’s simple enough so you only need to setup a contact page for people to get in touch with her, to discuss ideas and get a quote.

Then:

  • Gallery
    • Whimsical
    • Traditional
    • Minimal
  • Contact

 

Also, you can set up a reviews/testimonials page separate from the galleries to keep the images clean and let them be the main focus of those pages.

  • Gallery
    • Whimsical
    • Traditional
    • Minimal
  • Reviews
  • Contact

 

Ok, this is taking shape! Now, you need to add a page to share her story or brand’s bio.

  • About
  • Gallery
    • Whimsical
    • Traditional
    • Minimal
  • Reviews
  • Contact

 

As for the secondary goal, I mentioned it would be a good idea to have a page with additional info for prospective referrals. So let's add that to your sitemap.

  • About
  • Gallery
    • Whimsical
    • Traditional
    • Minimal
  • Reviews
  • Contact
  • Become an ambassador

 

And we should add a homepage as well.

  • Home
  • About
  • Gallery
    • Whimsical
    • Traditional
    • Minimal
  • Reviews
  • Contact
  • Become an ambassador

 

Since she’s running a business, she'll need a page for her terms of service and also for her privacy policy if she’ll be taking people’s info through the site. You can make that just one page.

  • Home
  • About
  • Gallery
    • Whimsical
    • Traditional
    • Minimal
  • Reviews
  • Contact
  • Become an ambassador
  • Terms and policy

 

Now, is she thinking about writing tips on weddings, picking flowers, etc. to attract her ideal audience through social media?

Yes? Ok, then let’s add a blog page too.

  • Home
  • About
  • Gallery
    • Whimsical
    • Traditional
    • Minimal
  • Reviews
  • Blog
  • Contact
  • Become an ambassador
  • Terms and policy

 

Beautiful!

We have our sitemap!

 

In Part II, we’ll be diving in deeper into each of these pages to think about how we can organize the content inside them and what purpose to give each one.

 

Until next time,

B.


Save now to save time later!


FOLLOW ME FOR MORE!