In a hangout, an SEO professional asked John Mueller about JavaScript redirects and HTTP redirects.
Their question was: what is the difference between JavaScript vs 301 redirects or HTTP status code redirects, and which one would John suggest for short links?
John answered that when it comes to redirects, if there’s a server-side redirect, where you can give Google a result code as quickly as possible, this is strongly preferred.
The reason why this is strongly preferred is just that it can be processed immediately.
Any request that goes to your server to one of those URLs, Google will see the redirect URL. They will see the link to the new location, then Google can follow that right away.
However, if you use JavaScript to generate a redirect, then Google first has to render the JavaScript to see what the JavaScript actually does.
Then they will see “Oh, there’s actually a redirect there. And then they will go off and follow that.”
If at all possible, John recommends using a server-side redirect for any kind of redirect that you are doing on your website.
If you cannot do server-side redirects, then sometimes you have to make do and a JavaScript redirect will also get processed. It just takes a little bit longer.
The meta refresh type of redirect is another option that you can use and this also takes a little bit longer.
The reason why it takes longer is because Google has to figure that out on the page. But server side redirects are great.
And there are different server side redirect types.
There’s 301 and 302. Then there are also 306, 307, 308. Essentially the differences are whether or not it’s a permanent redirect or a temporary redirect.
A permanent redirect tells Google that they should focus on the destination page. A temporary redirect tells Google they should focus on the current page that is redirecting, and keep going back to that one.
The difference between the 301, 302, and 307, John forgot what the other one was, is more of a technical difference regarding different types of server requests.
So, if you enter a URL in your browser, than you do a get request for that URL. Whereas if you send something to a form or use specific types of API requests, then that can be a post request.
The 301, 302 type redirect would only redirect the normal browser requests and not the forms and the API requests.
So if you have an API on your site that uses POST requests, or if you have forms where you suspect someone might be submitting something to a URL that you’re redirecting, then obviously you use the other types.
For the most part, however, you want to use a 301 or 302 redirect, and the differences there are very minimal.
This happens at approximately the 11:25 mark in the video.
John Mueller Hangout Transcript
John (Question)
Okay, and now a question about redirects, again, about the differences between JavaScript versus 301 HTTP status code redirects, and which one would I suggest for short links.
John (Answer)
So in general, when it comes to redirects, if there’s a server side redirect, where you can give us a result code as quickly as possible, that is strongly preferred. The reason that is strongly preferred is just that it can be processed immediately. So any request that goes to your server to one of those URLs, that we’ll see that redirect URL, we will see the link to the new location, we can follow that right away. Whereas if you use JavaScript to generate a redirect, then we first have to render the JavaScript and see what the JavaScript does. And then we’ll see oh, there’s actually a redirect here, and then we’ll go off and follow that.
So if at all possible, I would recommend using a server side redirect, for any kind of redirect that you’re doing on your website. If you can’t do a server side redirect, then sometimes you have to make do and a JavaScript redirect will also get processed. It just takes a little bit longer. The Meta refresh type redirect is another option that you can use, it also takes a little bit longer, because we kind of have to figure that out on the page. But server side redirects are great. And there are different server side redirect types.
So there’s 301 and 302. And I think, what is it, 306, 307, 308, something along those lines. Essentially, the differences there are, whether or not it’s a permanent redirect or a temporary redirect. A permanent redirect tells us that we should focus on the destination page, a temporary redirect tells us we should focus on the current page that is redirecting, and kind of keep going back to that one. And the difference between the 301, 302 and the 307.
And I forgot what the other one was, is more of a kind of a technical difference with regards to different request types. So if you enter a URL in your browser, then you do what’s called a get request for that URL. Whereas if you send something to a form or use specific types of API requests, and then that can be a post request. And the 301, 302 TYPE redirect, they would only redirect the normal browser requests and not the forms and the API requests.
So if you have an API on your website that uses POST requests, or if you have forms where you suspect someone might be submitting something to a URL that you’re redirecting them, then obviously you use the other types. But for the most part, it’s usually 301 or 302. And the differences there are very minimal.