Do JavaScript redirects work for SEO?

A new article on Search Engine Journal explains how to implement Javascript redirects while mitigating as much risk as possible based on Google documentation.



JavaScript redirects are one of the methods available to webmasters in communicating to both users and search engines that the requested URL is unavailable, either permanently or temporarily. The URL you are then served should be seen as the alternative or new permanent.

In terms of how JavaScript redirects work, they are typically implemented through the window.location.replace function, and work well for users. But how well search engines interpret them is open to debate

In Google's Search Central documentation, the search engine warns that you should "Only use JavaScript redirects if you can't do server side or meta refresh redirects."

And with their inclusion, it eludes that they work for Google and from an SEO perspective (anecdotally speaking, this is definitely the interpretation that many developers have had). But by contrast, as recently as 2020, Google's Gary Illyes has publicly stated that JavaScript redirects "are probably not a good idea."

How To Implement JavaScript Redirects

The most common method of implementing JavaScript redirects is through window.location.replace, for example:

If you open Dev Tools (CTRL + SHIFT + I) and enter the above line in Console, you'll go to a website homepage.

Another method of implementation is through window.location.href, but this can cause user issues.

With the replace method, when a user clicks back, the browser will load the previous page - but with the href method, the browser will load and redirect the user back to the same page they were just trying to leave (as it's stored in the navigation history).

This causes a UX redirect loop/trap, leading the user to close the tab and have a negative experience with the website. For many popular headless platforms, like Gatsby, there are pre-built methods of handling and implementing redirects.

In Gatsby, you can install the gatsby-plugin-gatsby-cloud, and implement 1:1 redirects, wildcard redirects, and "splat" redirects. Similarly, popular headless CMSs like Jekyll and Strapi come with prebuilt modules and plugins to ease the implementation of redirects.

So, Do JavaScript Redirects Even Work For SEO?

Referring back to Google's Search Central documentation and the implementation of JavaScript redirects, it extends the warning around using JavaScript redirects with the following:

While Google attempts to render every URL Googlebot crawled, rendering may fail for various reasons. This means that if you set a JavaScript redirect, Google might never see it if rendering of the content failed.

This ties in with another technical SEO favorite: rendering.

More specifically, what can happen should the Web Rendering Service fail to execute and render the JavaScript for the redirect? If, for some reason, Google fails to execute/render the JavaScript, then Google will load the initial request URL.

Depending on your setup, two things could happen:

• It will either be blank or result in a soft 404 error in Google Search Console.
• It will return the original page content, process it, and then begin to process it as "normal," which isn't ideal if you want that content to no longer be accessible.

To mitigate as much risk as possible, when implementing JavaScript redirects, you should:

• Remember that Google is stateless; any front-end redirects shouldn't rely on local storage or HTTP cookies (aka data persistence).
• Don't rely on user permissions to initiate the redirects, as Google declines user permission requests.
• Don't use fragment URLs.
• Reduce internal linking to the "original" URL and remove it from the XML sitemap, ensuring the new "destination" URL is there instead to give consistent signals to search engines.