The checklist is divided into eight different categories:
- Functionality & Integrations
- Link Testing
- Content & SEO
Let's dive in!
If your site doesn't look professional or it doesn't function as needed – then no one is going to give it the time of day, and you'll lose your momentum straightaway. Here are some fundamental principles to keep in mind as you build the new website:
- Spacing. It should be consistent throughout the site to give it a familiar feeling, and be sure to give your elements breathing room wherever possible. White space matters!
- Typography. Is your font consistent? Is it easy on the eyes? Are your headings structured correctly for all devices? Are your links clear and eminently clickable? If not – then you've still got work to do.
- Colors. Be sure to use a consistent color palette throughout your site to reinforce a strong brand presence that your readers can relate to.
- Shadows. Are your drop shadows consistent? Make sure that you check the blur, the opacity, and the spread. The details matter here.
- Images. Image quality is crucial, so remove any blurry images and only use crisp, clean images and get your message across.
- Favicon & Web clip. Is yours set up? Get on it!
- 404 page. Errors happen, links break. So make sure your 404 page is optimized with a proper CTA for those inevitable moments.
- Responsive. Check your website on a range of different browsers and devices to ensure that it's compatible with all of them and looks good in each particular context. Adjust as needed.
Functionality & Integrations
A website doesn't just stand on its own. It uses various integrations and advanced functionality to deliver on one holistic experience. Make sure all of these are in place before launch!
- Are your forms submitting to the correct email address?
- Are your autoresponders set up effectively so that customers know that their request has been received?
- Do they have the correct confirmation URL or event tracking?
- Are the required fields working correctly? Test them to make sure!
- Try and throw some brand personality in here for extra points.
- If you've got your phone number in the footer and/or on the contact page, make sure that they are clickable from mobile devices to remove that extra unnecessary friction.
RSS Feeds / Share Links.
- Make sure your customers can easily subscribe to your RSS feed and/or share your content pieces on all the relevant social media platforms.
- Make sure that your analytics is successfully installed so you can start tracking visits from the get-go.
- Make sure it's installed and ready to go.
- Make sure the search functionality is working as intended.
There is nothing more frustrating than a broken link, and even if you think that everything is working correctly – it's still worth doing another check so that you don't lose customers unnecessarily.
- Top navigation links.
- Footer links.
- Button links
- Logo (linked to the home page)
- Phone numbers (for mobile devices)
- Email addresses
- Link your physical location to Google Maps
If you want to do this efficiently, there are a number of website tools that can assist, such as the W3C Link checker or the CheckMy Links chrome extension.
Content & SEO
I shouldn't have to mention how vital your written content is for your site. It's the key differentiator between professional operations and fly-by-nightside projects, and you want to make sure that your written content is putting your best foot forward both with your readers and the search engines on which you want to rank.
- Proofread everything for spelling and grammar errors.
- Name all forms with a good, understandable title because some of them will be included in emails going to clients.
- Use proper semantic structure in all of your pieces. (Webflow has a great article on this.)
- Spend some time optimizing your title tags and meta descriptions to help web crawlers understand what your site is about.
- Open graph settings and check your featured image for each page.
- Name all files, icons, images, and other files with relevant names.
- Auto-generate your sitemap.
- Make sure that your footer contains the correct copyright statement.
There are lots of good hosting providers out there, so make sure that you've gone with one that is reputable, has good reviews, a strong support structure, and is right for your unique needs. Once you've confirmed all of this, there's a couple of things to do:
- Connect your domain.
- Add 301 redirects to prevent SEO loss and keep your visitors from getting 404 errors.
- SSL certificate should be requested.
- Create a full back-up of the whole website.
From a markup perspective, ensure that:
- HTML has passed validation.
- CSS has passed validation.
In today's age, we must ensure that our website is designed to work for all people. So, spend some time making sure that all the relevant accessibility features are built to cater to anyone who lands on your site. Ensure that:
- The website meets the appropriate level of WCAG compliance.
- ARIA Landmark Roles are specified.
- Semantic headings and structure used.
- Links are recognizable and have a focus state.
- Images use the appropriate ALT tags.
- Forms have a logical layout.
- There is an associated label for all form input fields.
- Color contrast tested.
There are many great tools to assist with all this. My favorites are Wave, Stark, and accessiBe. A little bit of effort here goes a long way.
The devil is in the details when it comes to setting up a website, so the more you can do to optimize things, the better it will perform. You want things to be sleek, fast, and functional in all contexts. Here are some things to consider:
- Be aware of your header and footer codes, don't overuse them because it can slow things down.
- Make sure your images are of a size that they aren't pixelated. You can optimize your images with a tool like TinyPNG or something similar.
- Take a back-up of your site and then run a range of tests.
- Run Google speed test and optimize accordingly.
- Run GTMetrix.
- Run Tools.Pingdom.
- Incorporate CDN / Caching as required.
- Enable gzip compression.
- Ensure that only the necessary fonts and weights sets are installed.
So there you have it! The ultimate checklist for your sparkling new website. Be sure to check back every now and then because I'll be updating this list regularly to make sure it's current and meets all best-practice standards as they evolve.
Do you have anything to add? Anything I've forgotten? Please let me know; I'd love to hear about it.
Lastly, I made a FREE notion template that can walk you through all these steps, so if that's your cup of tea, be sure to grab it. I look forward to seeing what you build!