I want to implement a JavaScript redirect but I don’t know how it works?
Yes, more difficult to implement than standard redirects.
Ideally, implementations should use 301, 302, or 307 based redirects. This is normal best practice.
But… what if you don’t have that level of access? What if you’re having trouble creating standard redirects in a way that’s beneficial to the whole site?
This is where using JavaScript redirects can help.
However, these are not best practices that should be used exclusively.
However, there are situations where using JavaScript redirects is unavoidable.
Below is a basic primer on JavaScript redirects, when to use them, how to use them, and the best practices you should use when utilizing these types of redirects for SEO.
What are JavaScript redirects?
Basically, JavaScript redirects are one of several ways to notify users and web crawlers that a page is available elsewhere.
Often used to notify users of changes in URL structure, but can be used for just about anything.
Most modern websites use these types of redirects to redirect to the HTTPS version of the webpage.
Then, whenever someone visits the original URL, the browser loads the JavaScript file and executes the code inside. This is done automatically if the script contains instructions to open another URL.
Redirecting in this manner helps in several ways.
For example, you can switch URLs without having to manually update every URL on your site. Additionally, JavaScript redirects make it easier for search engines to find your own content.
Overview of redirect types
There are a few basic redirect types, all of which are useful in some situations.
Server-side redirect
Ideally, most redirects will be server-side redirects.
These types of redirects occur on the server, and the server decides where to redirect the user or search engine on page load. And the server does this by returning her 3xx HTTP status code.
For SEO reasons, most likely you will use server-side redirects. Client-side redirects have some drawbacks and are usually better suited for more specific situations.
client-side redirection
A client-side redirect is one in which the browser determines where to send the user. You don’t need to use them unless you have no other choice.
meta refresh redirect
Meta refresh redirects have a bad and bad reputation within the SEO community.
There are good reasons for this. They are not supported by all browsers and can confuse users. We recommend using server-side 301 redirects instead of meta refresh redirects.
JavaScript redirects
However, a JavaScript redirect uses the JavaScript language to send instructions to the browser and redirect the user to another URL. There is a popular belief that JavaScript redirects cause problems for his SEO.
Google has great JavaScript rendering capabilities these days, but JavaScript can still cause problems. This also applies to other types of platforms such as Spotify and other e-commerce platforms.
However, if you are in a situation where only JavaScript redirects are available, you can only use JavaScript.
And Google’s Gary Illyes said in 2020 that JavaScript redirects are “probably not a good idea.”
However, JS redirects are probably not a good idea.
— Gary Kujiri/경리 Illyes (@methode) July 8, 2020
Best practices for SEO-friendly JavaScript redirects
Whether you’re using traditional redirects or JavaScript redirects, there are some best practices you should follow to avoid ruining your SEO.
These best practices include avoiding redirect chains and redirect loops.
What’s the difference?
Avoid redirect chains
A redirect chain is a long chain of redirect hops and refers to situations where there are multiple redirects in the chain.
Example redirect chain:
Redirect 1 > Redirect 2 > Redirect 3 > Redirect 4 > Redirect 5
why are these bad? Google can only handle a maximum of 3 redirects, but has been known to handle more.
Google’s John Mueller recommends less than 5 hops per redirect.
“It doesn’t matter. The only thing I want to note is that frequently crawled URLs have less than 5 hops. If you have multiple hops, the main impact is a bit slower for users. Search. The engine just follows the redirect chain (Google: max 5 hops in the chain for each crawl attempt).”
Ideally, webmasters aim for one hop or less.
What happens when you add another hop? It slows down the user experience. And five or more causes significant confusion in that Googlebot can’t understand your site at all.
Repairing a redirect chain can be a lot of work depending on its complexity and how it’s set up.
However, the main principles that drive redirect chain repair are: Make sure you have completed the two steps.
First, remove the extra hops in the redirect so that it’s less than 5 hops.
Then implement a redirect that redirects the previous URL.
Avoid redirect loops
A redirect loop, on the other hand, is essentially an infinite loop of redirects. These loops occur when redirecting a URL to itself. Or incorrectly redirecting a URL in a redirect chain to a URL that occurs earlier in the chain.
Example redirect loop: redirect 1 > redirect 2 > redirect 3 > redirect 2
This is why website redirects and URL monitoring are so important. You don’t want a situation where, three months after you implement a redirect, you discover that a redirect you created months ago is causing the problem. redirect loop.
There are several reasons why these loops are destructive.
As far as the user is concerned, the redirect loop removes all access to the particular resource at the URL and causes the browser to display the “There are too many redirects for this page” error.
For search engines, redirect loops can waste a lot of crawl budget. It also creates confusion for bots.
This creates what’s called a crawler trap, and the crawler can’t easily get out of it unless you manually point it somewhere else.
Fixing redirect loops is pretty easy. Just remove the redirect that is causing the chain to loop and replace it with a 200 OK URL that works.
Want to use JavaScript redirects for SEO? Not so soon…
Be careful with creating JavaScript redirects, as they may not be the best solution for redirects, depending on what you have access to.
These other types of redirects take precedence, so if you have access to other redirects, they shouldn’t be your go-to solution.
But if those are your only options, you may not be shooting yourself in the leg.
Other resources:
Featured Image: Rose Rodionova/Shutterstock
