February 3, 2015

How to Redirect a Web Page?

How to Redirect a Web Page

A redirect is done when a web page is visited at a certain URL, it changes to a different URL. For example, when a person visits the page "www.thelittletechie.com/page-a.html" in their browser and they are redirected to "www.thelittletechie.com/page-b.html" instead. This is very very useful if you want to redirect a certain page to a new location, change the URL structure of a site or even redirect users to another website entirely.

Let's say we have just moved our website and we want to shut down the old one. However we don't want all those pages from the old site to give a dreaded 404 Not Found. What we need is for those old links to redirect to the same content on our new site.

For example: we want old-website.com/blog/post to redirect to new-website.com/blog/post, along with all the other posts that use that same URL format. Also it would be nice if our redirects would report to search engines that this change is permanent so they should update accordingly.

HTML redirects

Perhaps the simplest way to redirect to another URL is with the Meta Refresh tag. We can place this meta tag inside the head section in an HTML page like this:

<meta http-equiv="refresh" content="0; URL='http://www.thelittletechie.com'" />

The content attribute is 0 seconds. That means the page will get redirected in 0 seconds.

This method is the easiest method to redirect a website to another. Although this method is the easiest way to redirect to a web page there are a few disadvantages.

Keeping the disadvantages in mind, JavaScript is the safer option to redirect the website. Lets lookout how JavaScript helps in redirecting a website.

JavaScript redirects

Redirecting to another URL with JavaScript is pretty easy, we simply have to change the location property on the window object as shown below:

window.location = "http://www.thelittletechie.com";

There are also many other ways to do this. Lets see those too.

window.location = "http://www.thelittletechie.com";
window.location.href = "http://www.thelittletechie.com";

With the location object we can do a lot of other neat stuff too like reload the page or change the path and origin of the URL.

No comments:

Post a Comment

Popular Posts