The Complete Website Checklist

Having a good website checklist that covers all bases will help you get through your launch.

Launching a website can be a stressful time, Does it look right? Are there any bugs? How am I going to get all of the content to fit in with the design? How am I going to get my site on Google?

All of the above may start to seem overwhelming and you may be thinking about what have I missed, adding to the stress even more.

The Complete Website Checklist is designed to help you out and help get your stuff together.

We are going to list out and cover the most important areas you need to go over before launching your site. By the end of this post, your mind will be at ease and you will be able to sail smoothly through launching your site.

To make this as easy for you as possible, there are three sections:

• Pre-Launch (checks before launching your site)
• Launch Day (what to do on launch day, exciting times!)
• Post-Launch (what to do after you’ve launched your site)

If you are planning to launch your website and need some guidance on digital marketing, we offer a range of web services and we can help you with digital marketing.

Pre-Launch

Pre-Launch checks are critical in making sure the whole site is ready to sail up onto the web. We are going to cover the visual checks, them pesky cross-browser inconsistencies, content checks, and the magic of search engine optimisation (SEO).

Visual Checks

First things first, does your website look like how it’s supposed to look? Are there any weird spacing issues causing elements to get too close to each other?

Spacings

Are spacings between elements consistent?

This one is very important, if there are inconsistencies in element spacings throughout the website, the user will start to notice as this throws off the visual flow of the website.

There is nothing worse than having miss horizontal-aligned content flowing down your webpage, clean lines on either side are a must! (if this is the design of course).

Images

Do full size and thumbnail images look good?

Imagery needs to be clean and crisp, you do not want blurry or pixelated imagery floating around your website to catch a user off guard (seeing a pixelated hero section as soon as they land on your website).

Now for the critical point – Images need to have alt tags, this is a must so screen readers can read out what the image is all about. This is a simple and quick process if done from the beginning.

There is nothing worse than having to go through your whole site adding alt tags once content has been added, this can be done when uploading images to your website.

Typography

When going over your website to make sure the text is legible and readable, keep these following points in mind (font styles and font sizing). This will make it easier to actually spot them subtle font errors.

Font styles
Websites usually don’t just contain one font, they have a font stack. You need to make sure the correct font is being used on your headings and your body content (paragraphs and links).

The last thing you want is a heading font being applied to your body copy.

You also need to make sure correct font modifiers have been used, proper italicized and bolding.

Font Sizing
The size of your fonts need to be consistent throughout, make sure all your headings, paragraphs and links are the correct size.

Colours

Websites contain few to many colours that also make up your brand, check over all your website to make sure the correct colours are applied to the right elements.

Are my headings the correct colour? Is my body text the right shade of black? Are the correct background colours and gradients used?

One error that can slip under your radar is the same coloured text on the same coloured background (white on white, black on black).

This can make it seem too much spacing is being applied between elements.

A top tip. Click and drag your mouse over the contents of your webpage, this will highlight any text that is not visible to you.

Cross-browser Inconsistencies

Browsers render websites differently to one another, this can make a webpage that works perfectly on one browser seem broken on another.

Simply open your website up on different browsers. I.E. Chrome, Safari, FireFox, Opera and the like.

From here you can identify any layout and visual changes.

There are a few different areas to watch out for when looking at your site on different browsers:

Layout changes

Is the overall layout consistent across different browsers? One thing to watch out for is the alignment of elements.

One example could be: You may have a vertically bottom aligned button that always sits at the very bottom of a container that contains text and the button.

Thus leaving space between the text and buttons. On some browsers, the button could be sitting right up against the text.

General colours, images, fonts

Colours, images and fonts tend to be the areas that can change the most across browsers.

For example, some browsers can make the same bit of text seem to have two different font weights applied. These are the type of problems that can slowly build up, so make sure to get them all ironed out.

When checking for any colour, image and font inconsistencies across browsers, you can use the visual checklist above to help you out. Simply make a note of which browser causes any issues and let your designer/developer know which are the problem browsers.

Website Optimisation

Website optimisation can massively contribute to your website conversion rate (the visitor of your website completing the desired action).

If your website is bloated and slow, your users will simply leave.

Your website should load between 2-5 seconds, any longer your bounce rate (visitors leaving a webpage before browsing any further) will begin to increase. You most certainly do not want that.

There are a few things you can do to make sure your website is properly optimised:

Check the loading times of content

If the load time of your content seems slow, one thing you can do is check the size of your imagery on your website. If the images have huge file sizes, this can seriously bog down your website. You want nicely web optimised images that are lightweight, look good and load in a blink of an eye.

If the images have been optimised and the website still seems slow, this can be a number of things.

Website assets (CSS, JavaScript) may not be properly minified and there may be a lot of HTTP requests.

An HTTP request is simply made when different parts of a website are being downloaded so that you can use it.

If you are in doubt simple make a note of the above and let your designer/developer know so that they can get it sorted for you.

Responsive Checks

Websites need to look good on all platforms: mobile, tablet and desktop.

For this to happen the layout and styling of elements of your website generally needs to be changed to suit the different screen sizes, and so it is still functional and usable.

To make these checks you can simply resize your browser window expanding it or contracting it.

On all platforms/screen sizes, you need to make sure the correct layout and stylings are being used across all elements.

Some things to look out for include:

Layout

Is the correct layout for each element being applied for the different screen sizes?

For instance, is a single column being used on mobile, are two columns being used on a tablet and are three columns being used on desktop.

Styling

Is the correct style is applied to each element for the different screen sizes?

Text sizes generally change across screen sizes.

One thing to look out for is the desktop sized headings being applied on mobile or vice versa.

Having a huge primary heading for desktop is simply not going to fit on a mobile screen, or having a small heading for mobile that is used on desktop is simply going to be too small.

In general, these are the types of errors that can be easily spotted and fixed, as they generally stand out.

So make sure these are all ironed out before launch. As these can totally break the design of your website.

Content Checks

Once the preliminary checks have been made (visual checks, cross-browser inconsistencies, website optimisation and responsive checks).

The next step is to check the overall content. There are a few steps here to carry out including links, lorem ipsum (developers love this), content and design and general proof-reading.

Links

Go over your whole website clicking all clickable elements and make sure they go where they’re supposed to go.

Check that internal links link to the correct parts of your website, do they open up the correct modal windows, do external links open up in a new window or do they open in the same window closing your webpage.

Lorem ipsum

Lorem ipsum is used as filler content as your website is being developed, this is so the developer has some content to work with whilst fleshing out your fancy new design.

You should check your whole website for any residual lorem ipsum, checking the home page, all internal pages, modal windows and the header and footer.

Proofread

Always check for any spelling and grammatical errors.

Proofread all your content yourself and get someone else to check over it.

There always seems to be a spelling or grammatical error that slips under the radar, so it’s always good to get another set of eyes on it.

Having one little spelling or grammatical error can drastically reduce the professionalism of your website, so make sure they are all gone!

SEO

Now for the magic of search engine optimisation.

SEO will be carried out and maintained after the launch of your website, but there is one check that needs to be covered beforehand. Semantic Structure.

Semantic structure

Having a semantic structure simply means having HTML elements that reinforce the meaning of the content on your website.

It also helps search engines (Google) understand your content, this will make sure the search engines display the right content on the list of search results.

When you are adding content to your website, a blog post for example. When using your text editor (generally a WYSIWYG editor) make sure that you have the correct headings applied.

This ranges from heading 1 to heading 6.

You also want to make sure all paragraphs are wrapped in the paragraph element.

You do not want any text floating by itself (not wrapped in heading or paragraph tags). This will reduce semantics (reducing the meaning of your content).

Launch Day (or just before launch)

Now for the exciting part. The launch of your website!

Before moving onto this step, you want to make sure you’ve completed all the steps from the pre-launch checks.

You also want to make sure your website is properly set up on the server and has the right domain name. (Simply put, can it be accessed from the domain name of your choosing).

Functionality

The first step to carry out is the functionality of your website.

By now your website should be visually pleasing meaning no visual errors, no cross-browser inconsistencies, no slow load times, no layout errors across different platforms and no content errors.

It is now time to check your forms, social media links, mailing list, security and spam protection.

Check forms work

There are a few things to check here, the things to check include:

• Form validation
  • Does the validation work for each field where validation is required (email format)?
  • Does the required field work where users must enter information before submitting the form?
• Form notification email
  • Do the notification emails get sent out as soon as the form is submitted?
• Instructions for the form
  • Does the form have a clear indication of its purpose (form names, input placeholders and any descriptions to go along with the form)?
• Form confirmation
  • Is the form confirmation clear/helpful to the user? Does the correct thank you message appear? Is it clear that the form has been submitted?
• Responsiveness
  • Does the form adjust appropriately for all screen sizes? One thing to check here is, does a two column form go down to a single column for mobile? Two columns may be too squashed on mobile.

Check social media links work

Somewhere on your blog post page, you will most likely have social media icons to allow visitors to share your post.

You want to click on each icon and share the post yourself to make sure the icons are working.

The last thing you want is for people to be sharing your posts, and for them to not actually be shared.

Check mailing list integration works

You will probably have subscribers to your website. You want to make sure that all your subscribers’ mail is being sent out.

If your mailing list is not working, it will more than likely need to be updated with settings for your new website. For instance, is the correct form embedded on your website?

If this is not working, you may end up losing subscribers. So make sure not to miss this one.

Harden security

Before your website goes out into the wild, it is absolutely paramount that your website is secure.

Luckily there are many options out there that can make securing your website easy. On WordPress, there are various plugins available that cover all your security needs.

The top three include:

• WordFence
• Bulletproof Security
• iThemes Security

WordFence, Bulletproof Security and iThemes Security, in a nutshell, are firewall and security scanners for your WordPress website.

This means your data is safe and your website is safe from being hacked.

Activate spam protection (Akismet for WordPress)
No one likes spam. It bloats out your website (especially the comment section) and reduces your website’s credibility. There are two options, dealing with spam manually or automating the process.

The best option available is the Akismet Anti-spam plugin for WordPress. With this plugin, you can simply wave goodbye to spam.

The only setup required is the activation of the plugin and setting up an API key.

But don’t worry, this process is well documented and is very simple to follow.

Visually check website matches what you had before launch

Now that the functionality has been dealt with, it is time to complete the final check.

Does the website match the original designs? If you have carried out the previous checks it should!

But, it is good practice to check and recheck again. Go over the site with a fine tooth comb and identify any areas that may have slipped under your radar.

Hopefully, these are very minor, but if not, the bulk of the issues should be done and out of the way.

Post Launch

Now that your website is out in the wild. It is time to complete the long-awaited post-launch checks.

These checks primarily consist of the configuration of your website.

Configuration

Configure SEO plugin

If you completed the pre-launch SEO, your content should be good to go.

It is now time to install (if not already installed) and configure your SEO plugin.

The top plugin we recommend is Yoast’s SEO plugin.

This plugin will allow you to get more website visits, attract more people from social media and increase the engagement of your readers.

With this plugin you can:

• Optimize keywords
• Keep a watch out for outdated content
• Preview what your pages look like on search engines
• Check the readability of your content
• Have control over Breadcrumbs
• Set up Content insights
• Configure Focus keywords
• Set up the Site map
• And more

Redirect old website and changing DNS settings

Redirecting old site

It is paramount that people find your new website, not your old site.

You can do this by taking down your old site, disconnecting the domain name from that site.

However, If you are using the same server, the settings should more or less be the same.

If you are using a new server but the same DNS, you need to connect your DNS to your new server, so that it’s no longer pointing to your old website.

If you are using a completely new DNS, you still need to make sure your old DNS is not pointing to your old or new site.

Changing DNS settings

Now, how to actually update your DNS settings.

Let’s use the example of pointing your DNS from your old site to your new site on a different server.

As mentioned before, if you have a previous domain name pointing to an old website on a different server, you want to update the DNS settings so that it points to the server where your new website is hosted.

This may sound complicated, but it’s really not.

All that is required is changing the settings in the A records on your DNS. an A record is responsible for pointing a domain name (yourdomainname.com) to an IP address of a hosting server (where your website is stored).

If you are unsure, you can ask your developer or your domain name business and get them to sort it for you.

Make sure emails work

Double check the emails.

After launch, it is important to check that all your email services still work.

Enter information into your contact form and click submit to see if the email is actually being delivered.

If you are using links to open up the mail app, make sure that the correct email is being implemented into the send to box.

Google Analytics and SEO

If you want your website to show up on Google, it doesn’t just magically happen.

The three most critical parts here include:

• Submit your website to Google’s search console (this will allow Google to index your website pages and provide you with access to SEO tips and tricks)
• Implement google analytics (track and report website traffic)
• Submit your sitemap to Google (provides the information so Google can crawl your web pages more easily)

Once you have completed these three steps, your website will begin to show up on Google and you can start analysing the statistics to continuously improve your website’s SEO.

Links

LinkBacks

Previously we have talked about on-site SEO – adding semantic HTML, implementing Yoast SEO and adding your website to Google along with implementing Google analytics.

You need to also make sure you have off-site SEO, one way to do this is by making sure you have plenty of links back to your website.

This means links on other blog posts and social media platforms, link back to your website.

This process will promote the authenticity of your blog posts and website in general, what this means is that search engines will begin to trust your website for providing good authentic content.

Conclusion: The Complete Website Checklist

Hopefully, after going through this website checklist, your mind will be at ease on what needs to be done when launching a website.

Going through this checklist should save you a lot of time going back and forth to your designer/developer as the most crucial elements have been covered.

For a brief recap and a nice consolidated list, here are all the areas to cover when launching a website:

Pre-launch:

• Visual Checks
• Spacings, Images, Typography, Colours
• Cross-browser inconsistencies
• Layout changes
• Colour, image and font changes
• Website optimisation
• Load time of your website
• Responsive checks
• Layout
• Styling
• Content checks
• Links
• Lorem ipsum
• Proof-reading
• SEO
• Semantic Structure

Launch day:

• Functionality
• Forms
• Social media links
• Mailing list
• Security and Anti-spam
• Visual checks
• Make sure the final website matches the design

Post-launch:

• Configuration
• SEO
• Redirect old website
• Changing DNS settings
• Making sure emails work
• Google analytics and SEO and link backs

If you like to be super thorough and you are yearning for information, check out our guide on how to get your launch just right.