My Web Design Process
If you’ve never created a website or hired a web designer before, and you don’t know where to even start … here’s a look at my process.
I remember sitting down to build my website for the first time… roughly 8 years ago.
It was shortly after I made the decision to leave my job and become a freelancer.
As a new freelancer, I was desperate to look the part and having a website (even if it was a free website with ads on Wix), was an important step toward being an online professional.
So I sat down to build my website believing it would be relatively simple, easy and quick. I was excited to create something special and show everyone my brand-new, made-by-myself website.
Unfortunately, it didn’t quite work out that way…
Choosing a template was easy, but then I needed to customize it with my own content & branding which was a major problem because I didn’t have ANY content or branding. 🤣
I had no professional photos of myself, no portfolio, no packages, no testimonials … basically I had no clue what to put on my website other than my name, email address and previous work experience.
But I was determined to have my own website so I pushed forward, doing whatever I could to fill up the pages and make it look professional.
The entire process was confusing, overwhelming and much more difficult than I had anticipated.
And the website itself, even with all my best work … wasn’t much to look at.
It didn’t look like a professional website to me, and I didn’t know how to fix it.
But looking back on it now… it’s easy for me to see where I went wrong.
My first mistake was assuming it was going to be a simple task to build a website.
But my biggest mistake was going into the project without a process.
A process is a series of steps (usually refined over time) that keeps you moving in the right direction toward your desired outcome.
Without a process, you can easily find yourself working in the wrong direction or working in multiple directions at once… leaving you feeling like you’re spinning your wheels but going nowhere.
This is why I want to share my web design process with you.
It’s not perfect, but I’ve used it to create 10 websites in the my first 12 months as a website designer so I know it works. Hopefully it will save you some time and headache when building your own website (or working with a web designer). 😊
Here you go!
Step 1. Vision
Before starting any website project, I sit down with the client to understand their website vision.
This involves looking at websites they like, reviewing their branding, discussing the content, features, pages, etc. I like to start with the big picture vision, and then get down into the details.
A big part of the website vision is knowing how you want someone to feel when they visit the website. People often talk about how they want their website to look, but I’m a big believer in also defining how you want your website to feel.
Once you have a clear vision for how you want your website to look AND feel, it’s time to start working on the content.
Step 2. Content
Website content covers everything from your logo, images, videos, copywriting, blog posts, lead magnets, testimonials, FAQs, etc.
This is the meat of your website, and you’ll need content for almost every page.
If you already have a website with content and are doing a redesign project, you can pull content from the old website and add new content to make it even better.
But if you’re building a website from scratch, you’ll need to create and collect the content before you can start.
If you’re not sure what content is needed, check out my blog post called “12 Things To Think About Before Building Your Website”.
My process usually involves sending my clients a Google Drive link with several carefully-labeled folders inside so it’s clear what content I want from them.
I also send my clients a Website Copy Questionnaire to get their own words about their business.
I’ll use the answers they’ve given me in this questionnaire to create the website copy.
Step 3. Build
Now the fun begins!
Building a website is so much simpler once you have the vision and content already sorted, because you quickly start to see your vision coming to life and it’s very motivating.
I always start by building the pages first.
Most websites have a few standard pages: Home, About, Services, Contact, Privacy, Terms of Use.
I’ll start by creating all the pages the client wants (usually decided in the first step) and then inserting all the content that I’ve collected in the second step.
At this part in the process, I’m focused on getting all the content on the page and having it “flow” in a layout that feels natural and easy for the viewer.
I’m not tweaking the little details or web copy just yet, because those tasks will slow me down and put me in an “editing” frame of mind when this stage is all about creating.
Finishing the design comes after all the pages have been built.
Step 4. Edit
Once the entire website is built with content on every page, it’s time to go over your work with a fine-tooth comb and get those design details just right.
Here’s a list of what I normally look at:
Spacing: page margins and spacing between objects like text & images
Images & Video: these may need to be compressed to improve page loading speed
Headlines: normally it takes several tries to get this just right (especially on the homepage)
Body text: needs to be proofread and edited on every page for clarity, consistency and style
Mobile-view: everything needs to work and look good on mobile devices
Page layout: use a full-page screenshot tool to get a full view of each page
Page links: check the SEO, keywords and URLs for each page
Call-to-action: every page should have some call-to-action or next steps
Clickables: connect all the buttons, links and contact forms to the right places
Header/Footer: make sure it works on every page
My process involves going through each website page and tweaking all those design details until I’m happy with how everything looks.
Once I’m finished designing the website, I’ll schedule a video call to “reveal” the site to my client and get their feedback and edits.
If I’ve done my job properly, there will be only minor changes needed.
Step 5. Test
Now that your website is built, designed, edited and ready to go live… there’s just one more step to complete before you hit that “publish” button.
All professional websites must go through a round of QA Testing (quality assurance) to make sure everything is working smoothly before we open the doors to the public (so to speak).
My typical process would be to publish the website as “password protected” while I do the testing.
Why publish with a password? Instead of just testing the website in the draft stage?
Because until the website is published, the link is not on the internet, which means I can’t visit the website like customers normally would. I can only visit the website through the back-end of my website platform… which doesn’t give me the full user experience.
In order to test the website like a real user would, I need to view the website on my computer AND my phone (without logging in as the website owner).
Testing the website is more than just clicking on links and buttons. You also need to test all the functions of the website.
If there’s a contact form, you’ll need to fill out the contact form and then check to confirm that you’ve received the message in the appropriate email inbox.
If there’s an online shop, you’ll need to complete a purchase to test the checkout process.
If there’s a blog, you’ll need to leave a comment to test that feature
If there’s a downloadable PDF, you’ll need to download and open it
If there’s a newsletter subscription box, you’ll need to subscribe and check your inbox for the confirmation email
There are more examples but I think you get the picture.
Testing gives you peace of mind to move forward with publishing your website.
Step 6. Publish
By the time you reach this stage, you’re probably sick of looking at your website and ready to get this project off your plate.
Which is good … because now you get to take your website live and see it on your favorite search engine (hopefully not Google 😉).
If you already have a domain name, you can connect the domain to your website and then remove the password protection (if you did this for testing).
Most website platforms have a step-by-step guide for how to connect your domain and I recommend following that guide.
If you’re transferring your domain from an old provider (i.e. GoDaddy) to a new provider (i.e. Squarespace) it may take up to 2-3 business days for the transfer to go through but once your domain is connected to the website … boom!
Hit that “Publish” button and let’s wrap this project up.
Step 7. Share
You probably thought the process ended with the website going live … but surprise!
The final step is to share your new website link with everyone.
Post it on your social media channels.
Put in your bio.
Write a blog post about it.
Ask your friends to include a link to your website on their website.
etc.
The goal is to do everything you can to drive relevant traffic to your website so you can start building your business, blog or whatever you created the website for.
Conclusion
Building a website is HARDER than it looks but it always helps to have a process whenever you tackle on a difficult task.
A process helps you save time, money and sanity.
And it will get you closer to your desired outcome than just “winging it” with no plan.
My website design process follows these 7 steps:
Vision
Content
Build
Edit
Test
Publish
Share
You can borrow my process … or create your own.
The most important thing is that you HAVE a process and you follow it to the end.
Any questions? Drop them in the comments and I’ll be happy to answer them.
Thanks for reading! 😘
