HTML redirect. HTML meta refresh redirection code.
HTML meta refresh redirect is a client side redirect and is not 301 permanent redirect.
The HTML meta refresh with 0 seconds time interval, is considered by Google as a hint for 301 redirect for pagerank transfer.
If you want to do real 301 permanent redirect, you can do it with PHP redirect after enabling PHP code in HTML files.
HTML meta refresh redirect
The redirection is done with the meta refresh in the head section.
The link in the body section for fallback purposes.
Replace old page with redirection code with the URL of the page you want to redirect to.
old-page.html:
<!DOCTYPE html>
<html>
<head>
<!-- HTML meta refresh URL redirection -->
<meta http-equiv="refresh"
content="0; url=http://www.mydomain.com/new-page.html">
</head>
<body>
<p>The page has moved to:
<a href="http://www.mydomain.com/new-page.html">this page</a></p>
</body>
</html>
<html>
<head>
<!-- HTML meta refresh URL redirection -->
<meta http-equiv="refresh"
content="0; url=http://www.mydomain.com/new-page.html">
</head>
<body>
<p>The page has moved to:
<a href="http://www.mydomain.com/new-page.html">this page</a></p>
</body>
</html>
HTML meta refresh redirect example
html-redirect-test.htm:
<!DOCTYPE html>
<html>
<head>
<!-- HTML meta refresh URL redirection -->
<meta http-equiv="refresh"
content="0; url=http://www.rapidtables.com/web/dev/html-redirect.htm">
</head>
<body>
<p>The page has moved to:
<a href="http://www.rapidtables.com/web/dev/html-redirect.htm">this page</a></p>
</body>
</html>
<html>
<head>
<!-- HTML meta refresh URL redirection -->
<meta http-equiv="refresh"
content="0; url=http://www.rapidtables.com/web/dev/html-redirect.htm">
</head>
<body>
<p>The page has moved to:
<a href="http://www.rapidtables.com/web/dev/html-redirect.htm">this page</a></p>
</body>
</html>
Press this link to redirect from html-redirect-test.htm back to this page:
HTML canonical link tag redirect
The canonical link does not redirect to the preffred URL, but it can be an alternative to URL redirection for websites that most of the traffic arrives from search engines.
HTML canonical link tag can be used when there are several pages with similar content and you want to tell the search engines which page you preffer to use in the search results.
Canonical link tag can link to the same domain and also cross-domain.
Add the canonical link tag to the old page to link to the new page.
Add the canonical link tag to the pages that you preffer not to get search engines traffic to link to the preffered page.
The canonical link tag should be added in the <head> section.
old-page.html:
<link rel="canonical" href="http://www.mydomain.com/new-page.html">
URL redirection ►
URL HTTP Redirection
URL http redirection is an automatic URL change operation from one URL to another URL.
- URL redirect
- Redirect options
- PHP redirect
- Apache .htaccess redirect
- ASP redirect
- ASP.NET redirect
- Meta refresh redirect
- Javascript redirect
- jQuery redirect
- Canonical link redirect
- Frame redirect
URL redirection
URL page redirection is an automatic URL change operation from one URL to another URL.
This redirection is done for the following reasons:
- Redirect from old obsolete URL to a new updated URL.
- Redirect from old obsolete domain to a new domain.
- Redirect from non www domain name to a www domain name.
- Redirect from short URL name to a long URL name - URL shortening service.
- URL shortening service will allow the user to insert a short URL and be redirected the the long URL that has the real page contents.
The user may reach the old URL from an old external links or a bookmark.
by the site's webmaster who adds a script.
Server side redirect
Server side redirection is done in the server, by configuring the Apache / IIS server software or by using PHP / ASP / ASP.NET script.
This is the preferred way to redirect URLs, since you can return HTTP 301 Moved Permanently status code.
Search engines use the 301 status to transfer the page rank from the old URL to the new URL.
Client side redirect
Client side redirection is done in the web browser of the user, by using HTML meta refresh tag or by Javascript code.
Client redirect is less preferred, since it does not return HTTP 301 status code.
Where to put redirect code
| Domain name | Hosting server | Redirect code placement |
|---|---|---|
| not changed | not changed | old page on same server |
| not changed | changed | old page on new server |
| changed | not changed | old page on same server |
| changed | changed | old page on old server |
* Only with .htaccess redirect: add redirect code to httpd.conf file or to .htaccess file.
HTTP status codes
| Status code | Status code name | Description |
|---|---|---|
| 200 | OK | successful HTTP request |
| 300 | Multiple Choices | |
| 301 | Moved Permanently | permanent URL redirection |
| 302 | Found | temporary URL redirection |
| 303 | See Other | |
| 304 | Not Modified | |
| 305 | Use Proxy | |
| 307 | Temporary Redirect | |
| 404 | Not Found | URL not found |
HTTP 301 redirect
HTTP 301 Moved Permanently status code means a permanent URL redirection.
The 301 redirect is the preferred way to redirect URLs, since it informs search engines that the URL has moved for good, and search engines should put the new URL page in the search results instead of the old URL page and transfer the new URL page, the page rank of the old URL page.
The 301 redirect can be done across domains or on the same domain.
Google recommends to use 301 redirect.
Redirect options
| Redirect script | Redirect side | Old page file type | Redirect URL or domain | Old URL server type | 301 redirect support |
|---|---|---|---|---|---|
| PHP | Server-side | .php | URL | Apache / Linux | yes |
| ASP | Server-side | .asp | URL | IIS / Windows | yes |
| ASP.NET | Server-side | .aspx | URL | IIS / Windows | yes |
| .htaccess | Server-side | all | URL / Domain | Apache / Linux | yes |
| IIS | Server-side | all | URL / Domain | IIS / Windows | yes |
| HTML canonical link tag | Client-side | .html | URL | all | no |
| HTML meta refresh | Client-side | .html | URL | all | no |
| HTML frame | Client-side | .html | URL | all | no |
| Javascript | Client-side | .html | URL | all | no |
| jQuery | Client-side | .html | URL | all | no |
redirect script - the scripting language that is used for the redirection.
redirect side - where the redirection takes place - server-side or client-side.
old page file type - the type of the old URL page that can can contain the scripting language of the redirect code.
redirect URL or domain - does support URL redirection of a single web page or domain redirection of a whole website.
typical old URL server type - the typical software and operating system of the server.
301 redirect support - indicates whether permanent 301 redirect status response can be returned.
PHP redirect
Replace old-page.php code with redirection code to new-page.php.
old_page.php:
<?php
// PHP permanent URL redirection
header("Location: http://www.mydomain.com/new-page.php", true, 301);
exit();
?>
// PHP permanent URL redirection
header("Location: http://www.mydomain.com/new-page.php", true, 301);
exit();
?>
The old page must have .php file extension.
The new page can be with any extension.
See: PHP redirect
Apache .htaccess redirect
.htaccess file is a local configuration file of the Apache server.
If you have permission the change the httpd.conf file, it is better to add the Redirect directive in thehttpd.conf instead of the .htaccess file.
Single URL redirect
Permanent redirect from old-page.html to new-page.html.
.htaccess:
Redirect 301 /old-page.html http://www.mydomain.com/new-page.html
Entire domain redirect
Permanent redirect from all domain pages to newdomain.com.
.htaccess file should be at the old website's root directory.
.htaccess:
Redirect 301 / http://www.newdomain.com/
ASP redirect
old-page.asp:
<%@ Language="VBScript" %>
<%
' ASP permanent URL redirection
Response.Status="301 Moved Permanently"
Response.AddHeader "Location", "http://www.mydomain.com/new-page.html"
Response.End
%>
<%
' ASP permanent URL redirection
Response.Status="301 Moved Permanently"
Response.AddHeader "Location", "http://www.mydomain.com/new-page.html"
Response.End
%>
ASP.NET redirect
old-page.aspx:
<script language="C#" runat="server">
// ASP.net permanent URL redirection
private void Page_Load(object sender, EventArgs e)
{
Response.Status = "301 Moved Permanently";
Response.AddHeader("Location","http://www.mydomain.com/new-page.html");
Response.End();
}
</script>
// ASP.net permanent URL redirection
private void Page_Load(object sender, EventArgs e)
{
Response.Status = "301 Moved Permanently";
Response.AddHeader("Location","http://www.mydomain.com/new-page.html");
Response.End();
}
</script>
HTML meta refresh redirect
HTML meta refresh tag redirection does not return 301 permanent redirect status code, but considered by Google as a 301 redirect.
Replace old page with redirection code with the URL of the page you want to redirect to.
old-page.html:
<!-- HTML meta refresh URL redirection -->
<html>
<head>
<meta http-equiv="refresh"
content="0; url=http://www.mydomain.com/new-page.html">
</head>
<body>
<p>The page has moved to:
<a href="http://www.mydomain.com/new-page.html">this page</a></p>
</body>
</html>
<html>
<head>
<meta http-equiv="refresh"
content="0; url=http://www.mydomain.com/new-page.html">
</head>
<body>
<p>The page has moved to:
<a href="http://www.mydomain.com/new-page.html">this page</a></p>
</body>
</html>
See: HTML redirection
Javascript redirect
Javascript redirect does not return 301 permanent redirect status code.
Replace old page with redirection code with the URL of the page you want to redirect to.
old-page.html:
<html>
<body>
<script type="text/javascript">
// Javascript URL redirection
window.location.replace("http://www.mydomain.com/new-page.html");
</script>
</body>
</html>
<body>
<script type="text/javascript">
// Javascript URL redirection
window.location.replace("http://www.mydomain.com/new-page.html");
</script>
</body>
</html>
jQuery redirect
jQuery redirect is actually another type of Javascript redirect.
jQuery redirect does not return 301 permanent redirect status code.
Replace old page with redirection code with the URL of the page you want to redirect to.
old-page.html:
<!DOCTYPE html>
<html>
<body>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script type="text/javascript">
// jQuery URL redirection
$(document).ready( function() {
url = "http://www.mydomain.com/new-page.html";
$( location ).attr("href", url);
});
</script>
</body>
</html>
<html>
<body>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script type="text/javascript">
// jQuery URL redirection
$(document).ready( function() {
url = "http://www.mydomain.com/new-page.html";
$( location ).attr("href", url);
});
</script>
</body>
</html>
See: jQuery redirection
HTML canonical link tag redirect
The canonical link does not redirect to the preffred URL, but it can be an alternative to URL redirection for websites that most of the traffic arrives from search engines.
HTML canonical link tag can be used when there are several pages with similar content and you want to tell the search engines which page you preffer to use in the search results.
Canonical link tag can link to the same domain and also cross-domain.
Add the canonical link tag to the old page to link to the new page.
Add the canonical link tag to the pages that you preffer not to get search engines traffic to link to the preffered page.
The canonical link tag should be added in the <head> section.
old-page.html:
<link rel="canonical" href="http://www.mydomain.com/new-page.html">
See: Canonical URL link
HTML frame redirect
In frame redirection the new-page.html file is viewed by an html frame.
This is not a real URL redirection.
Frame redirection is not search engines friendly and is not recommended.
old-page.html:
<!-- HTML frame redirection -->
<html>
<head>
<title>Title of new page</title>
</head>
<frameset cols="100%">
<frame src="http://www.mydomain.com/new-page.html">
<noframes>
<a href="http://www.mydomain.com/new-page.html">Link to new page</a>
</noframes>
</frameset>
</html>
<html>
<head>
<title>Title of new page</title>
</head>
<frameset cols="100%">
<frame src="http://www.mydomain.com/new-page.html">
<noframes>
<a href="http://www.mydomain.com/new-page.html">Link to new page</a>
</noframes>
</frameset>
</html>
No comments:
Post a Comment