Log in

Introduction to Technical SEO for 2021

What is technical SEO?

Technical SEO refers to the practice of optimising the development of your website to meet Google’s quality standards. While you don’t need to be a fully fledged web developer to do this, it is important to understand the core concepts and basic principles to ensure you’re not limiting your site from being indexed. The content on your site might be great but if Google can’t crawl, index and render it you won’t rank organically in search engine results.

Why technical SEO still matters in 2021

As the web has become increasingly complex with new technologies, programming languages and requirements, technical SEO has only become more important. However, it’s difficult to give an overarching description of what it means. That’s because technical SEO is a broad subject covering a range of factors including mobile optimisation, page speed, site architecture and many more.

The importance of technical SEO in the broader strategy of your site will depend on the market or location you’re targeting. Some sites will rank perfectly fine with a few pages of static content whereas others, such as ecommerce websites, require management of thousands of product pages or websites.

 

How websites are built (HTML, CSS and JavaScript)

In order to understand how to optimise a site technically you must first understand what a modern website is made of. The three most common programming languages used in web development are:

  • HTML (HyperText Mark-up Language) – Used to define the content of your web page
  • CSS  (Cascading Style Sheets) – The rules for the design of your web page
  • JavaScript – The behaviour and interaction of your web page

We’ll go through each of these individually to define what’s important to your users and to Google.

HTML

HTML (Hypertext Mark-up Language) is fundamental to any webpage. This includes the written content of your site. However, Google won’t inherently know what’s important from a large block of text. To make it clearer, webmasters can mark up certain parts of content differently using tags. These range from elements such as titles and headings to defining links, all of which Google will account for when rendering your page.

CSS

CSS (Cascading Style Sheets) define the visual rules of your content, including which fonts, colours and layout your page follows. While HTML can define some of these things natively, it was never designed to. It was meant purely for describing content. CSS files can sit directly within your HTML – known as in-line CSS – or more commonly as an external resource. Using external style sheets can make a web page less code-heavy, meaning it’s easier to render and faster to load.

JavaScript

In the past, web pages were built purely with HTML and then later optimised using CSS. JavaScript adds a third layer increasing the interactivity and capability of pages which has changed the functionality of the web dramatically. JavaScript is essentially an external file which when executed will achieve a function. This could be a pop-up, an animation or a custom feature.

However, JavaScript is more complicated than HTML & CSS. This is because it can’t simply be crawled; it requires interaction to execute and for the page to be rendered as a user would see. JavaScript can be executed in two ways. First, server-side where your server carries out the processing and sends it back in a fully rendered state. Or you can do it client-side where the user renders it is done directly in the browser on the user’s device.

Google does claim to be able to render both client-side and server-side although it will use a second wave of indexing. They start with just the HTML and CSS, then later they will index the JavaScript. This can lead certain elements to appear ‘invisible’ to crawlers and so we typically recommend using JavaScript to do things HTML and CSS can’t and not to rely on it completely.

Understanding ‘Technical Hygiene’

Websites are ever-changing, often with numerous staff members making changes on a weekly or daily basis. As a result, an optimised site can decay overtime as pages are added, removed and redirected overtime. It’s important to have a structure to this. Making sure problems are fixed and measures put in place to prevent problems in the first place. Below we list a number of common technical SEO issues that could be considered ‘technical hygiene’.

Deadlinks

One of the most common technical hygiene issues is broken pages or deadlinks. This is where your content contains a hyperlink to a page that no longer exists. Google accepts that broken links will occur naturally but it’s still important to review and amend them routinely.

404, 301 and 302 Status Codes

When you remove a page from a site, it will return a 404 status code signalling the server couldn’t find any content at the listed address. If these pages previously ranked well in Google or have a high number of links from external sources, it may be worth setting up a redirect to the replacement page or most similar page.

While there’s a few ways to redirect a page, the most common types are 301 and 302 redirects. 301 redirects are a signal that a page has permanently moved its content to another page and 302 signals it has moved temporarily. Google has stated that after a certain amount of time it may perceive 302s as 301s.

Redirect Chains and Loops

A redirect chain is caused by redirecting a URL to a URL that also redirects. This is bad for SEO as it adds an additional step that both users and search engine bots must hit before reaching the intended destination. In some cases, two URLs can redirect back to one another which is known as a redirect loop. This will cause an endless cycle of redirects causing search bots and browsers to timeout.

Missing Metadata

A page is not required to have metadata, but it is useful for search engines. In some cases, the authors of the content may know they should include meta titles or descriptions as it isn’t directly on the page itself. It’s important to check regularly that all important indexable pages have metadata.

Hreflang tags

A Hreflang tag is used to define which country and language a page is intended for and what the equivalent pages are in another language or country. In multi-national sites these are important to include to ensure pages with similar content aren’t registered as duplicate and are ranking for the right audience. Every page must reference its equivalent page in each region and have a responding reference from those regional pages.

How to improve technical SEO in 2021

Technical SEO incorporates a number of optimisations that you’ll need to consider. This can include everything from reviewing your code base to adding additional functionality.

This guide focuses on four core elements of technical SEO:

Site Speed – The time in which it takes a user to load your content

Schema – An opensource form of structured data used by search engines to define values to properties

Crawling and Indexing – Fixing crawl errors and ensuring search engines can discover and index all relevant pages

Information Architecture – Creating a logical site structure that’s both human and search engine friendly

Trusted by

Case Studies

Read about some our recent successes with some of our fantastic clients.