The Blueprint: Steal our QA Process for Web Design

Today I’m sharing how you can steal my quality assurance (QA) checklist for when you’re launching a website.

If you've ever felt stuck in the development phase, unsure of what you need to install or add, this checklist is your lifesaver.

Let’s dive in!

We’ve all been there with web development projects – you're deep in the development phase, but you’re stuck. You don’t know what needs to be added or checked off, and you’re caught in that awkward space between development and launch. That’s why I’ve put together a quality assurance checklist that you can use for your projects.

Take notes! Grab it! Use it!

The QA Checklist

This checklist is pretty detailed, so I won’t go through every single item, but I want you to have a solid list to work from. Here’s a breakdown of our key QA steps:

1. Update Titles and Metas: Ensure every page on your website has updated title tags and meta descriptions. This is essential for SEO and ensuring each page is accurately described in search engine results.
2. Add Open Graph Image: Insert an image that will appear when your links are shared on social media platforms like Facebook, X (Twitter), LinkedIn, and Pinterest. This enhances your social media presence and makes your links more visually appealing.
3. Complete Blog Entries: Make sure all your blog posts are uploaded and formatted correctly. This ensures that your content is ready for readers and search engines alike.
4. Review Site Links: Have someone click through every link on the site to ensure they work properly. Broken links can frustrate users and harm your SEO.
5. Install Google Analytics and Microsoft Clarity: Track your website’s performance with these essential tools. Google Analytics provides valuable insights into your traffic, while Microsoft Clarity offers heatmap tracking to see how users interact with your site.
6. Test Forms: Verify that all forms are functional and that submissions go to the correct email. This is crucial for lead generation and customer inquiries.
7. Check Site Responsiveness: Ensure your site looks great and functions well on all devices, including desktops, tablets, and smartphones.
8. Clean Up Style Manager: Remove unused CSS classes and styles to keep your code clean and efficient. This helps with site speed and maintainability.
9. Remove Webflow Branding: If you’re using Webflow, make sure to turn off the default branding in the footer. You can do this by going into the settings and turning off the branding option.‍
10. Backup Your Website: Always back up your HTML, CSS, JavaScript, and other assets. This ensures you have a copy of your site in case anything goes wrong. Save these backups on your drive or cloud storage.

Bonus Checklist: SEO Quality Assurance

We also have an SEO quality assurance checklist to prepare your site for search engines. This includes:

• Set Up 301 Redirects: Ensure all old URLs point to their new locations to preserve SEO value.
• Connect to Domain and Set Up Hosting: Make sure your site is live and accessible to users.
• Label All Images with ALT Text: Improve accessibility and SEO by properly labeling all images.
• Generate a Sitemap: Create and submit a sitemap to search engines to help them index your site.
• Set Up Google Search Console: Submit your site to search engines manually so they can index your newest content.

Detailed Steps

Here’s a bit more detail on some of the key steps:

• Update Titles and Metas: In Webflow, you can update these in the designer view. For each page, add a relevant title tag and meta description. This helps search engines understand what each page is about.
• Add Open Graph Image: In Webflow, go to the page settings and add an open graph image. This image will be used when the page is shared on social media, making your links more attractive and engaging.
• Test Forms: Submit test entries through each form on your site to ensure they are working correctly and that all submissions are received by the intended recipient.
• Check Site Responsiveness: Use tools like BrowserStack or simply resize your browser window to check how your site looks and functions on different devices.
• Clean Up Style Manager: In Webflow, go to the Style Manager and remove any unused styles. This keeps your CSS clean and reduces load times.

You can find detailed SOPs and deliverables for all these steps in my Web Design Studio Accelerator course. Otherwise, feel free to grab this checklist and start using it for your projects.