We’ve talked about SEO in the past, and we’ve always emphasized the importance of maintaining your website because SEO is ever-changing and it will always be. Previously, we talked about the general guidelines on how to make sure your website can be optimized in terms of search rankings. In this article, we will focus on the importance of code and how the quality of code can make a difference in your search rankings.
Quick refresher: how does SEO work
Search engines have bots such as Googlebot that crawl your website. When the bot is reading your website, it gathers some basic information such as headers, sub-headers, title, metatags, media...etc.
Ideally, you want the bot to read every page of your website (other than pages that contain private information) to have the optimal amount of information so when someone searches for some keywords, your site shows up as high as possible on the search engines.
If, however, your website has poor code quality, it makes the bots’ job much harder to gather the information it needs and when that happens, unfortunately, hurts your ranking.
What determines if the code is good or poor?
So what exactly is code quality? Well, to start, poor code quality is something you want to avoid regardless of its’ impact on SEO. Poor code quality makes your site more difficult to maintain, update, or add new features. Here are some examples of poor-quality code.
- Code that results in glitchy behaviour.
- Unmaintainable code.
- Usage of obsolete libraries or frameworks.
- Unnecessary code repetition.
Why my code quality is poor?
There are many reasons why a project ends up with bad quality code. In some cases, it was caused by the developer or development team that doesn’t really care. When the development teams’ end goal is to complete the project without caring how to get there, or that they are not responsible for maintaining the website going forward, they might not care about the code quality as long as it seems fine on the frontend.
When the project is tight on budget for the features it needs, the developers that were tasked with the project might not have the skills or expertise to avoid writing bad code. When the project is tight on time, the developers might not have enough time to make sure everything is best-practice and well maintained.
Sometimes, it is not any particular developer’s fault, a legacy website that was built a long time ago may have outdated practices in the current trend. These older projects often have new features added on by different developers over the course of its life and grew organically to something that is extremely difficult or even impossible to refactor or maintain due to the deprecated libraries or frameworks. In these cases, the best way is often to rebuild the site.
So why does poor code hurt your SEO?
If we isolate the code itself, it generally does not have too much of an impact on your ranking. However, poor code quality often leads to slower performance, confusing content for search engines when they crawl your website and poor accessibility. These are some of the factors that poor code quality can hurt your SEO. Let’s dig a little deeper.
A common situation of bad quality code is using the wrong tags or bad syntax for your HTML. For example, having more than one <title> tag per page, or have duplicate meta tags, then you will get penalized and have a lower SEO score than you could have. Fortunately, this is a relatively easy fix. If you have a smaller website, it doesn’t take much time to update the HTML to have the correct tags. If you have a large website, chances are there are some templates that you can update to fix the HTML across the board.
Here is a list of common mistakes that makes your HTML messy or “not beautiful”
- DOCTYPE not properly declared.
- Head section not tidy:
- The title is not correctly set.
- Stylesheets are not linked properly.
- Scripts linked in full or don’t have their own folder.
- The content of the page is not in the main DIV.
- Ending tags are not properly set up.
- Having duplications that are not visible to the user.
- <h1> tag is not engaging to a real person.
- Links posted by users do not have <nofollow> tags.
Another area of poor code often comes from the styles. Legacy sites that grew organically over a long period of time often have different developers working on the site over the course of its lifespan. These websites often have CSS over-writing each other all over the place because developers don’t want to touch the old styles.
The problem with this is that there are often duplicated styles that should be refactored. Sometimes there are some styles that have been overridden and not used at all but are still being rendered. This not only will affect your SEO score but also makes the website very hard to maintain.
The other part that styles may hurt your SEO score is when the responsive viewports are not styled properly. With so many people browsing websites on their tablet or phone, it is essential to have a responsive website. Even in a world where this doesn’t affect the SEO score, having no responsive design or have a bad responsive design is definitely a deterrent for users to continue using your website and this often hurts the conversion rate and at the end of the day, hurts the companies bottom line. It just doesn’t seem professional if you don’t have a responsive website in 2021.
Other benefits of clean code
Let’s not overlook the difficulty to have clean code. There is a reason why plenty of websites don’t have clean code. However, this is exactly why you should try to make the code on your website as clean as possible. Because it will give you that slight edge over your competitors and make the effort worthwhile.
SEO is not the only reason why you should maintain a clean code on your website. Clean code is easily maintained. When a developer tasked with updating the website is not the developer that built the website, it makes things much easier if the code was clean, which translates to time and money saved.
Clean code also makes extending your functionality and features easier. Less duplication, less overriding each other makes it more future-proof. As mentioned above, the developer that is tasked with adding a new feature to your website will have an easier time doing so if the code is not messy. Last but not least, cleaner codes are more reliable and easier to debug when issues arise. The less downtime your site experience, the better it is for your business.
In conclusion, there is no downside to have cleaner code, whether it is HTML or CSS. The higher SEO scores, the easy maintenance and easier extension are all the reasons you need to ensure your website has clean codes. The only problem is that is it often not easy to achieve. So make sure you do that from the start to save yourself a lot of effort and money down the road. If you have a website that you want to clean up some code and refactor some duplicated styles but are not quite sure where to start, feel free to shoot us a message and we will be more than happy to help.