Tuesday, 5 March 2013

How to make page Redirection in HTML and JavaScript

 Hi friends..

Today we will see Page Redirection in HTML and JavaScript.

What is Page Redirection?

The page will be redirected please wait! this message will see many websites. Did you see in any website? For example you login in gmail the page will be redirected in your gmail page.

Ok

Defn:
When you decide click one link or URL the page will reach destination link or URL. But internally the page redirected to another link or URL that is called "page redirection".

In JavaScript it achieve window.location ( ) readymade method.

Syntax:
window.location="redirect link or URL" ;

Example:




<html>
<head>
<title>Untitled Document</title>
<script type="text/javascript">
function reDirect()
{
document.getElementById("res").innerHTML="Page will be redirected!"
setTimeout("redi()",5000);

}
function redi()
{
window.location="http://www.google.com";
}
</script>
</head>

<body>
<h1 id="res"></h1>
<img src="images (14).jpg" onmouseover="reDirect()" />
</body>
</html>

Output:




Refresh metatag:

In HTML

We can done in HTML we can use meta tag.

Lets come how to make in html? And am explain all briefly in HTML Meta tag uses

HTML Meta Tag:

                  HTML Meta tag to be placed in <head> tag. In following way. In HTML the code automatically generated in Dreamviewer. Like

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
</head>

<body>
</body>
</html>

What is Meta tag?

  • The Meta tag provides information about author and keywords and description of page details.
  • Many more meta tag used in <head> tag.


Why use Meta tag?

  • A few year ago the meta tag using keyword is used to SEO.
  • But now SEO not considered the meta tag keyword. Now only considered in keyword and content of the of page only.


Meta tag Attributes?

Name
Its content property value
http-equiv
It contents  HTTP response header name
content
Its associated data
Scheme
Its optional of content  data


Name: author
  • This attributes provide property value of content attribute.

Ex:

<meta name=author  content="Mariz" />

Name: keyword and description
  • The Meta tag provides information about author and keywords and description of page details.

Ex:

<meta name="description" content="A description HTML tutorials"/>

http-equiv="Content-Type"
  • Set the client side scripting language

http-equiv="Content-Type"  CONTENT="text/html; charset=””
  • sets the character encoding for the document 

Ex:

http=equiv="Content-Type" content="text.html; charset=shift_JIS"
http=equiv="Content-Type" content="text.html; charset=iso-8859-1


http-equiv="Content-Style-Type" content ="text/css"
  • sets the style language in your document.

http-equiv="refresh"
  • this is used re direction purpose

http-equiv="expires"
  • To sets the expiry date of the document



HTML Page Re-Direction:

We can make page redirection in HTML, use meta tag


<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="refresh" CONTENT="10; URL=http://www.google.com"/>
<title>Untitled Document</title>
</head>

<body>
<p> page will be redirected in 10 seconds</p>
</body>
</html>

Output:




I hope its more useful..

Thanks




No comments:

Post a Comment

What is AI- Artificial Intelligence - தமிழில்

Artificial Intelligence : Artificial intelligence leverages computers and machines to mimic the problem-solving and decision-making capabili...