SEO Checklist for Web Developers
Web developers are oftentimes not well versed with best practices in SEO as compared to actual SEOs. However, since they are tasked with creating well optimized websites, they need to design websites that are compliant with most SEO practices to make their clients rank their content.
While one could have all the technical skills to develop a beautiful and functional website it is critical to have a good grasp of SEO guidelines in designing websites. Most of the essentials are found in the Google Webmaster guidelines and it is critical to have a checklist just to ensure everything is covered.
The checklist will typically include aspects such as cross platform compatibility, HTML optimization, structured data, site speed, and site structure optimization among others. The following is a checklist for web developers.
In 2015, Google announced that mobile friendliness would become a critical component of its ranking algorithm in an update that came to be known as “Mobilegeddon”. Since the implementation of the update, sites that were not mobile friendly risk ranking lower than their mobile optimized competitors.
Mobile friendliness could mean two things for the web developer.
- Is the site compliant with standard development protocols such as responsive CSS stylesheets
- Is the mobile site build on a separate mobile subdomain (typically m.example.com)? While this is common practice it is not recommended given that it may complicate SEO.
When you use a subdomain for your mobile website, Google will typically assume the mobile domain is a totally different website. As such, the mobile site may suffer from not getting links that are going to the main website or even from duplicate content issues.
Developing a sub-folder is therefore recommended practice. A subfolder as the mobile site will be deemed an extension of the main website and hence there will no issues with supplicate content or splitting of links between two sites.
Google provides the Mobile Friendly Test tool which you can always use to test how mobile friendly a website is.
Schema is very important for websites, as it helps Google understand structured data better which can be good for SEO. As a web developer it is critical to properly code a website to make it easy to add schema and structured data for almost any kind of website. Schema can be used to tell the search engines what the content is and could be used for anything from:
- Local businesses
- Software applications
- TV ratings and episodes
- Book reviews
You can check that structured markup is coded properly into the client’s website using Schema.org. It is a free validation tool that you can use to ensure that everything about your structured markup code is compliant with Google guidelines. Not validating your schema could result in data that confuses the search engines, which will make it harder for the website to rank.
Even as the validation tool will unearth most common errors, some may go unnoticed and hence it is important to be vigilant. Go through the code with a fine toothcomb and ensure that everything is coded as it should be.
For instance, assume you are coding a site for eateries and need to include local information and the name of the restaurant. You run the code through Schema and discover some unusual contextual and punctuation errors in the data such as:
<div itemscope itemtype=”Chitos”><span name=”business”>Trademark Starbucks, Copyright</span></div>
<div itemscope itemtype=”Chitos”> Trademark <span name=”business”>Starbucks </span>, Copyright</div>
As you can see the first code includes the trademark declaration within the tags. In the next code, the name Starbucks is appropriately located between the closing and opening span tags. The second code is what is appropriate.
Such errors are not easy to diagnose using Schema.org and will not even show up in Search Console. As such, you need to go through the code manually to find contextual errors such as these. If the first code were used on the website, Google will show it as Starbucks Copyright, rather than showing the rich snippet as just Starbucks, which is what we want.
A thorough manual check before the site goes live will ensure there are no such errors that could interfere with the SEO of the site.
Proper Site Structure
Proper site structure is not only great for user but also for SEO. The search engines and the user are looking for a lot of the same things though you need to ensure that you satisfy the unique needs of both the user and the search engine.
Proper site structure may include proper navigation that allows your visitors to move between important pages on the site. It also allows the search engine spider to move from the important pages spreading juice around the website. This will allow trust and authority to be distributed across the site making other pages rank.
Not having easy navigation links means the search engine will not be able to pass link juice around the site and users may have hard time finding critical content.
Some of the most important aspects of site structure include footer tags, section tags, header tags, sidebar links and categories. These help users determine the important elements such as headers and categories, which makes using the website easier.
Proper site structure is particularly important for mobile as small screens can result in more frustration when users cannot easily find the information they need.
Web developers have to move pages and content around the website when required for SEO or navigational purposes. For instance, redirects are a necessary part of development since the client may stop selling some product, delete some pages or merge them with others. Redirects improve SEO since they tell the search engines that the page has moved and where it can be found.
They will thus ensure that the search engines do not confuse the new pages as duplicate content but rather rank them just as they did before the move. Redirects will also help users find your old pages as it is not only the search engines that will be pointed to the new pages but also the users’ browsers.
Not using redirects could make the search engines serve 404 pages, which could create a bad user experience, while also assigning authority and trust to nonexistent or outdated URLs.
Developers should make provisions for temporary redirects (302 Found) and permanent redirects (301 moved permanently). Since 2016, all redirects will pass page rank though you should still make provisions for the recommended permanent redirect – the 301.
Overall the website should only return a 404 when the URL cannot be found by the web server. You can also use 404 pages to spread link equity around the website by linking to all important pages on the site or to related pages.
Create Efficient Code Layouts
The way the code is laid out is very important as it impacts a lot of aspects including overall site speed and rendering times, all of which can impact the ranking of the site. Having inefficient code layouts could result in a slow loading speed, which can get the website penalized by Google for poor UX on mobile devices.
It cannot be much of a problem if the inefficient code is on the backend but it could be huge if it is client side. While you could find inefficient code layouts of 2400 columns and 2400 rows when the internet was in its infancy, such code could destroy your SEO in the modern internet world. The lean CSS codes of the contemporary internet use as few as 50 columns and 50 rows nested in DIVs.
You can you can also go as far as stripping that down even further by compressing the DIVs to two or even one nested layout comprised of the footer, header and the content. This makes for highly efficient client side code that loads fast.
In a world in which mobile is increasingly the favorite device that users use to access the internet, it is important that you make the website load fast. Page load times are a critical component of mobile friendliness as it has been shown that up to 40% of visitors will click back if a page loads in more than three seconds. On the other hand, Google expects above the fold content to render in a second or less.
Once the normal process of HTTP request, TCP handshake, and DNS lookup is done , you only have 0.4 seconds to load the above the fold content and hence it needs to be highly optimized. Do the following to optimize webpages for faster page load:
- Implement Google AMP – Google will store your website’s pages as Accelerated Mobile Page markup and will then serve them from a dedicated server and cache. Since they are served from a dedicated server, the user will have the page load on their browser instantly.
- Integrate Browser Caching – Ensure that the website is designed for browser caching. This will reduce the number of requests made by returning clients. With fewer requests, the pages will load faster.
- Optimize Images – Images need to not only be in the correct format but they also need to be compressed so that they do not take too much time to load. Images can be optimized either using images editors such as Photoshop or compressed first before they are uploaded to the website.
- Reduce Above the Fold Content – The number of packets that can be sent on the first roundtrip is typically, limited since the first TCP connection will not use the entirety of the connection’s bandwidth. Above the fold content will typically render fully if it is 148 kb or less.
Google provides the Google Page Speed Insights tool that developers can use to measure the speed of their pages on both desktop and mobile devices. With the tool you can get the page speed of the different pages on the website including time to render the entire page and time to render above the folder content. Alternatively, you could use Tool Console in Internet Explorer, Web Console on Firefox or Developer Console in Chrome to measure page speed.
The words and structure of the URLs on a website are critical for SEO performance. The URL path are critical for the search engines, which use them to understand the importance and relationship of a page to other pages or categories on the website. The search engines also use URLs to determine the relevance of a page to a particular keyword or topic. Follow these guidelines to have optimized URL structures:
- Make them Descriptive and Short – The best URLs should describe the keywords of the page and be as short as possible. Short URLs that are descriptive tend to be better for users since they are more memorable and easy to understand.
- Front Keywords – The most important keywords for the website need to be fronted in the URL. The search engines tend to put more weight on keywords appearing at the beginning of the URL. This also ties in with the need to have short URLs as you can have your keywords very near the beginning for more punch.
- Use Hyphens not Underscores – The search engines are designed to understand hyphens as word separators and hence it is always important to separate words in URLs with hyphens. Underscores may not be recognizable and hence you can lose some ranking signal by writing URLs with underscores rather than hyphens. This is because some of your words may not be recognizable.
Nonetheless you, should still ensure that you are using the target keywords naturally to ensure that the website does not look spammy or low quality. If any of the pages will be targeting long tail keywords, you should strip the subcategory and category names to keep the URLs as short as possible. Another SEO benefit of optimizing URLs by fronting keywords is that webmasters are more likely to use them as anchor text, which will make the content rank better.
What can you add to this SEO checklist for web developers?