The effective website development checklist. How to develop an SEO optimized website that converts from the start?

Date : November 7, 2019 By Andrei Iunisov

While the coding process is definitely a substantial part of website development – it’s not the only part of the whole process. The code itself takes care of the site’s visual appearance and its interaction with users. But the actual creation of the site through coding is just one step in the process of website development, which also includes completely different steps like prototyping, creating website’s structure, checking the site itself after it’s been created – even post-launch support is a part of that giant process of website development. 

Next we’ll take a detailed look at the website design process as a whole and in the end of the post you’ll get the checklist with all the ideas listed in the post. There are several different interpretations of the necessary development stages, but we’ll split the process into seven main steps. These steps are: 

1. Analysing competitors’ websites 
2. Choosing lead generation method
3. Choosing website development platform
4. Website structure development
5. Checking for typical usability errors
6. Checking for typical SEO errors
7. Final website check

Now, we’ll go through them, one by one.

Analysing competitors websites

The first step should be quite obvious – competitor analysis. You should know something about your competitors, at least their strengths and weaknesses in the digital field. There are three main categories of information you should look for when analysing your competitors websites: content (in any form of it), traffic sources and functionality.

Analysing content means that you’ll be looking for:

• Product or service messaging;
• Texts, their topic, size, keyword density and writing style;
• Videos, their length and themes;
• Image graphics (infographics, stock images, real photo sessions etc).

When you’re analysing website’s functionality – usually it’s the following:

• Website blocks for increasing visitor trust;
• Call-to-action website blocks;

Traffic sources are very important when figuring out how to check competitors website traffic. This can help you to build the strategy where you can start in the places where your competitors are weak. I prepared a huge presentation on how to analyze competitors with SimilarWeb earlier:

Choosing lead generation method

At this step you’ll have to choose which of the many client lead generation methods you’ll be using and implementing in your website. Basically you can divide your clients in two major groups:

• Visitors on the upper-funnel stage (people who aren’t ready for the “hardcore sales action” on the website yet);
• Visitors on the lower-funnel stage (the ones who are ready to perform the “hardcore action” right now).

The way you can reach the upper-funnel stage clients can be through:

• Downloading price lists, catalogs, whitepapers, ebooks, RFP templates and other materials that support the sale or lead generation process or provide more information;
• Offering consultations in both messengers and online chats;
• Making access to the price of the subject easier (using price calculators, TCO and ROI calculation tools, etc);

Reaching for lower-funnel stage is somewhat different, through things like:

• Leads;
• Orders;
• Purchases;
• Calls.

Choosing website development platform

This particular step is partially linked with an actual coding process that goes into every website development project. But it’s not the process of coding itself – it’s all about choosing the website platform. You can choose from three main categories: one-pager websites, template-based websites and websites with unique design. Each of them has its own unique pros and cons.

One-pager website:

• Small setup time (using generators like Weebly, Tilda, Wix, etc);
• Maintaining credibility for visitors of the one-pager is quite difficult;
• Search engine optimization of such website is very hard to execute.

There are a few other things worth remembering when creating a one-pager:

• Insert web analytics system, preferably Google Analytics;
• Get the unique level-2 domain name (can be with positive history to boost SEO);
• Set up HTTPS protocol for SEO purposes (with EV SSL certificate preferably);
• Integrate Google Search Console;
• Integrate lead generation forms with Google Sheets or CRM system;
• Write down the title and meta description for your page.

My opinion. One-pagers are good for starting a new company or for checking out some business hypothesis. They are not suitable for SEO in most cases because of the lack of content, internal backlinks and visitor trust which results in high bounce rates. They’re also sometimes “sitting” on the same IP with a bunch of other websites on this builder which results in affiliation filter from search engine.

Template-based website:

• A large variety of templates available for Opencart, WordPress, Drupal, Bitrix and other content management systems;
• Templates are mobile- and tablet-adaptive;
• An optimized structure and a CMS is already included in a template;
• Most of the time templates have from little to zero major prototyping errors.

My opinion. Templates are quite costly for hypothesis checking but still not as expensive as unique site design, they are also good for organic SEO website traffic increase when you need to redesign for better user behavior on site and have the best “price/quality” ratio (if you want to compare traffic to websites of different origin).

A website with unique design, on the other hand, is somewhat completely different. Using this platform type means that you’re getting your website designed exactly how you want it with the help of the web designer. But first you’ll need some way to show how you want your site to look like – the prototyping process. And, as usual, there are several methods of doing that.

• Gliffy and Lucidchart are web tools that give you the ability to prototype your site page by page. They both lack flexibility when compared to more complex paid options like Axure (which has useful features like a customizable “Masters” tab that you can fill with widgets and tools you use the most). Limited flexibility makes the process of creating each page’s prototype generally longer, but the limited amount of options makes it easier to understand and start from scratch. Both of these services are free.
• Axure RP is a highly functional product, but mastering it is way harder (also it’s 30 USD per user per month). Working with it can be divided into four steps: 
  • Сreating a sketch. A sketch is an approximate plan of the site’s each page. It doesn’t have to have a lot of details and it’s easy to correct. The ideal way of doing it is to create a sketch on a half of an A4 page and the other half should be filled with commentaries. The text itself should be represented by thick or thin lines. A picture is a crossed out rectangle, a video is a rectangle with a triangle in it, icons are circles and buttons are smaller rectangles. Hint: you don’t have to come up with every block’s design since you can get them from Tilda or Wix.

• • Creating page prototypes. There should be no more than three different layouts in general. The following example shows one layout that has more than 1140 px in width.

Next, the prototype page can be filled with all kinds of elements from the Libraries tab.

You should create a structure for your first page, including a title, a call to action, a button and a picture.

If you want to create a block that lists key advantages of your product (or service), then it should include elements like a photograph, an icon and a description for every advantage you’re listing.

• Creating master-blocks. For easier interactions with this service you can put the repeating blocks into the Master tab.
• Connecting pages using links. You can also link one page to another when you have more than one page created already. It can be done using Properties tab and choosing the “OnClick” option, which lets you click on element that would be a link to another page of yours.

After the prototyping stage you’ll have to contact a website designer of your choosing and give them your prototypes for further examination and correction.

But that’s not the end of the custom website designing process, there’s also the layout of the site and a process of integration with your chosen CMS.

In general the custom design for a website is offering:

• A completely unique look of your site (in case when it’s necessary);
• The level of customization which ensures that this exact site suits the exact needs of your company;
• The site’s structure that can be adapted to be SEO-friendly;
• An upfront price that for such a website is much more expensive than a template;
• The process that is usually quite long (from 6 weeks and more).

Website structure development

Your website might look better than anyone else’s, but there has to be a structure underneath all that design, too, for your website to rank high in Google. Keyword research plays a huge role in the future website structure. There are two different types of keywords that affect your website’s structure:

• Informational keywords (“alternatives to…”, “how to …”, “examples of” etc). For those kinds of keywords your site needs to look like an informational type of site (you need to have the blog or glossary or something else);
• Transactional keywords (“buy toy dog”, “buy iphone X”, etc). This type requires in-depth product (or service) pages.

It is quite common for companies to just focus on transactional keywords-based structure and not foresee landing pages in sections for informational content. It leads to the loss of the relevant informational traffic that can also convert. Apart from conversions such traffic can also improve your behavioral metrics for SEO website.

Checking for typical usability errors

It’s not uncommon for site designs to have usability mistakes at basically any stage of the whole designing process. There can be quite unique errors as well, but let me list the most common ones instead:

• Infinite page scrolling (3+ screens);
• Pop-up blocks appearing all the time (blocks like call-back, online-chat, subscription offering, discount popup and others, all appearing constantly – see the example here);
• Possibility to go back through the conversion funnel (example, it should be no buttons that allow you to go back to the catalogue once you’re near the payment stage);
• Placing objects with large file size onto your website (flash, virtual tours, etc);
• Distracting customers from performing the target action (the picture below clearly shows that an element overload on the checkout page is severely distracting for any potential customers, that’s why those pages should be kept as clean as possible)

• Problems with call-to-action forms. There are 8 main signs that your call-to-action form is good: 
  • The less fields are in the form – the better;
  • No legacy captcha (excl. Google Captcha 3.0) or other “not a robot” checks;
  • There are examples of how to fill in each field;
  • If there’s an error while filling in the data – the data itself stays and is not deleted;
  • The number of fields that you need to fill in in the mobile version is significantly limited;
  • There’s an indication on the field if you filled it wrong;
  • The overall form is integrated into your CMS system;
  • Your form saves the data that has been typed in even without pressing “enter”.

New website SEO requirements check

After creating the new website you’ll also need to think about how well it will work for SEO to generate organic traffic. To help you with that, here’s a checklist of SEO website check requirements for your new site. Important disclaimer: you don’t actually have to do all of it to make your site SEO friendly, far from it. But implementing maximum possible from each section of this would go a long way in making sure that you’re doing better than your possible competition. Here’s what you should look for if your goal is to check website for SEO errors:

1. Basic SEO checklist

1. Build an XML and HTML sitemaps.
   Well-built XML sitemaps are the guidelines for search engines – they tell them where is the content they need to find and index. There are a large choice of sitemap generators, either for WordPress or for any other CMS. HTML sitemaps are guiding the users towards their goal on the website, that’s why it’s also crucial to have them on your 404 pages. 
2. Build and deploy robots.txt file.
   One more important part of SEO website check is creating a robots.txt file. Search engines address this file to know where they can and can’t go on your website (a good example of possible restriction can be billing-related part of your website or personal client area). There are several different robots.txt generators out there, as well, however good SEOs should be able to create them by themselves and know the directives.
3. Add Google Analytics or Google Tag Manager.
   GA (Google Analytics) is a free analysis-based tool made by Google. Its base function is to analyze and view the number of your website’s visitors and the way they interact with the said website. GA installation consists mainly of copying and pasting a specific Google-provided tracking code into your website (after signing in to your Google account) or of deploying Google Tag Manager on your website.
4. Setup Google Search Console.
   Google Search Console is a multifunctional tool that is recommended to use for any webmasters in the SEO website promotion process. Some of its core functions that you can use to check SEO effectiveness of a given website are index tracking and keyword research. You can also use it to keep track of different opportunities to improve your site in some way (speed enhancements, website look in search results and more).

2. On-page SEO checks

1. Figure out short and descriptive URL.
   Usually shorter URLs can get better ranks. The main purpose of your site’s URL is to show users what they should expect at this exact page. Longer URLs also have more opportunities to include a keyword of your choice but don’t need to be more than 115 symbols as I suppose.
2. Both title and description have to be compelling.
   General advice for both title and description tags is to force target keywords in there. That’s good advice, no doubt about it. But you shouldn’t force keywords in title or description if they don’t make sense in context. Work on creating a good compelling title and description that would attract more traffic to your website, instead. Most of the front-page results in Google don’t even have an exact match with their target keyword or keywords in the title – but they’re still at the front page nevertheless.
3. Try using only one H1 tag per page.
   You can freely use multiple H1 tags at the same page, it’s true. But the best recommendation would be to use only one for each page instead. Most of the time H1 is a wrapper for the page main heading – and there’s only one main heading for a page. Still, there’s some benefit to having a keyword in your H1. For example, that way you can be sure that your visitor got exactly where he or she wanted to be. 
4. Use H2 tags to create the page contents. 
   H2 tags allow to create a top contents menu which will ease the navigation process through the article that you work on. Try to use H2 text for tier-2 headings and unite them in the list at the very top like on the regular Wikipedia page.
5. Both internal and external links of each given page have to be relevant and should have high quality.
   If we’re talking external links – it’s quite important to link only from high-quality websites with relevant info. Internal links are important as well – try to add them on your existing pages whenever you publish something new. There’s a good tool for measuring the quality of internal linking called NetPeak Spider, I suggest using it too. 
6. Don’t forget about the alt tags, too.
   The main purpose of alt tags is to offer at least some context to your viewers in case of some image not loading properly. That’s why alt tags should be descriptive. This makes for high ranks in Google Images, as well. 
7. Include longer keyword variations throughout your website texts.
   Most of the time your traffic isn’t just the result of one popular keyword. The big chunk of it would be mainly from longer keyword variations (for example, not just “website submit”, but “website submission services in germany”or some other variation). Try to use long-tail keywords in your texts as well.

3. Content optimization checklist

1. Compelling intro.
   Most of the time your viewers’ attention span is really short and if you can’t compel them to stay on your site in the first several seconds after they’ve arrived – you might make them bounce off the page. Your introduction should also look trustworthy, resonate with the viewer in some way and promise an actual solution to your viewer’s problem. 
2. Remember about readability.
   Barely anyone calls reading a wall of text a fun time. That’s why there are images, quotes, bulleted lists – anything to break the routine and keep the reader’s attention. You should always keep that in mind, even at the very beginning of SEO website development process.
3. Write in short sentences.
   Complicated wording is the last thing you should be doing with your content. It’s quite a common knowledge that a lot of people on the planet have a reading level of an 8-grader. That’s why you should create your text with short and descriptive sentences, avoid long-winded jargon words/terms and remove unnecessary adverbs when possible.
4. Strive to deliver the best content on the topic. 
   Google’s official search quality evaluator guidelines state that you should use E-A-T. It stands for expertise, authoritativeness and trustworthiness. All three attributes are required from the content creator to succeed in search results.

4. Technical checklist

1. Crawl errors.
   If Google is having some sort of trouble viewing your content – it’s called crawl errors. If Google can’t view it – Google can’t rank it, simple as that. This is the main reason why such issues are to be fixed as soon as possible. One of the ways to find such issues is to use a “Coverage” tab in Google Search Console. The more sophisticated way is to get the server logs and analyze them by yourself in a text editor. 
2. Work on your site’s loading speed.
   Google provides a range of tools to understand and improve website pages load speed problems. These tools include a standalone service PageSpeed Insights and also the tools that were recently added directly to Google Search Console interface. 
3. Monitor and fix broken links and 500 errors.
   Broken links aren’t exactly crucial for your search ranking, but they’re still ruining your overall user experience – and it is common knowledge that Google cares a lot about user experience. So you should work on locating and fixing those whenever possible. I usually use the tool called ScreamingFrog SEO Spider for this particular purpose.
4. Make sure that your website can be viewed from mobile device.
   Nowadays most of the searches are performed via mobile device of some sort. This makes your site’s mobile friendliness the important part of the overall SEO work. There’s a free service (made by Google) for checking if your website is mobile friendly or not.
5. Use HTTPS protocol.
   HTTPS is all about security, it’s obvious. But it’s also a ranking factor, according to Google statements. HTTPS provides additional protection that’s extremely important if you have some sensitive data that can be entered: like contact submissions, client passwords or even payment information. Consider EV SSL certificate because it has the biggest level of credibility between specific organization and its website.
6. Work on fixing the common duplicated content issue.
   Having duplicate content means that you have two or more of the same pages within your website. If that’s the case, Google won’t know which page to index and rank. It is a common problem for ecommerce SEO – all thanks to faceted navigation (cause of myriads of duplicated pages appearing because of some incorrectly set parameters). Working on fixing those is a must, for sure.

Yes, that is overwhelming, but, once again, you don’t have to implement all of this at once. But on the other hand the more of this checklist you’ll manage to tackle – the better your chances are to get to higher Google search rankings.

Final website check

After you’ll get your website from a developer – it’s not the end of it, you still have to check it in several different ways. And, in this modern day and age, there are plenty of online services to help you with that even if you know nothing about web development process. The main things you should definitely check for are:

• Browser compatibility – using org, choose the most popular browsers – Chrome, Firefox, Safari, etc – and see how your site looks as if you’re looking at it through all of the chosen browser engines. If there are differences between how your site looks in one of the browsers and the design-layout – you’ll need to contact the developers that created your website and work on fixing this problem with them;
• Pages loading speed – through one of Google’s own services – PageSpeed Insights, Google Page Speed should show you some load speed statistics and problems in the code that slow down the page. You’ll probably have to contact your web developers anyway – for solving the problems that may occur or for some other reason, but don’t forget to balance the compression of assets like images and other media so it’s not harming for the overall user experience worse; the alternative tool is org, in which you can choose things like server location, browser type, number of attempts and also has more unique options like first time loading speed or waterfall type of reports (for professional developers);
• Performance testing – services like com are your best bet for this kind of work, it allows for up to 50 subsequent visits, and it shows statistics in a diagram to make the possible troubles even more obvious.

Conclusion

Website development as a process is quite complicated, to say the least. There are a lot of little things and nuances that need to be taken care of in the process so you don’t have to spend extra time and money after the whole process is done. We’ve discussed the general steps of this process, as well as site creation methods and typical mistakes. For example, the only credible way of comparing different companies’ price and performance is to compare the work that they’ve done based on your own prototypes, and the price they’re asking for it. And there are a myriad of little things like that spread throughout the whole process of website development. To make it easier to understand, here’s a checklist of this process, as well:

1. Analysing competitors’ websites 
   1. Content
   2. Functionality
2. Choosing lead generation method
   1. Upper-funnel stage
   2. Lower-funnel stage
3. Choosing website development platform
   1. One-pager website
      1. Check for webpage ergonomics
      2. Set up a level-2 domain name
      3. Integrate Google Analytics 
      4. Set up HTTPS protocol for SEO purposes
      5. Create a connection with Google Search Console
      6. Integrate forms with Google Sheets or your CRM system
      7. Write down the title and meta description for the page
   2. Template-based website
      1. Create a list of requirements for the template
      2. Integrate Google Analytics
      3. Set up HTTPS protocol for SEO purposes
      4. Create a connection with Google Search Console
      5. Integrate forms with Google Sheets or your CRM system
      6. Write down the title and meta description for the page
   3. A website with unique design
      1. Choose the prototyping instrument
         1. Gliffy / Lucidchart
            1. Create prototypes of each page
         2. Axure RP 7
            1. Create a sketch
            2. Create page prototypes
            3. Create master-blocks
            4. Connect the pages between each-other
4. Website structure development
   1. Perform keyword research
   2. Divide keywords into “info” and “transactional” groups
   3. Create a site section for each group of keywords
   4. Create landing pages for similar keyword types (no more than 3-5 per page)
5. Checking for typical usability errors
   1. Infinite page scrolling
   2. Pop-up blocks appearing all the time
   3. Possibility to go back through the conversion funnel 
   4. Placing objects with large file size onto your website (flash, virtual tours, etc)
   5. Distracting customers from performing the target action 
   6. Unreadable text, overcomplicated navigation and complicated fonts
6. New website SEO requirements check
   1. Basic SEO checklist
      1. Form a sitemap. 
      2. Form and implement a robots.txt file.
      3. Add Google Analytics.
      4. Add Google Search Console.
   2. Website check SEO
      1. Figure out short and descriptive URL. 
      2. Both title and description have to be compelling.
      3. Try using only one H1 tag per page.
      4. Both internal and external resources of yours have to be relevant and of high quality.
      5. Don’t forget about alt tags, too.
      6. Include longer keyword variations throughout your website.
   3. Content SEO checklist
      1. Compelling intro.
      2. Remember about readability.
      3. Write in short sentences.
      4. Strive to deliver the best content on the topic.
   4. Technical checklist
      1. Crawl errors.
      2. Work on your site’s loading speed.
      3. Monitor and fix broken links.
      4. Make sure that your website can be viewed from mobile.
      5. Use HTTPS.
      6. Work on fixing the common duplicated content issue.
7. Final website check
   1. Browser compatibility
      1. Browsershots
   2. Pages loading speed
      1. Google Page Speed
      2. WebPageTest
   3. Performance testing
      1. LoadImpact

   You can also get the checklist in a PDF file and a free 30-minute consultation with me if you’ll fill in the form below.