How to redirect from an HTML page?

Front End Technology HTML Web Development

Page redirection is a situation where you clicked a URL to reach a page X but internally you were directed to another page Y. It happens due to page redirection. Website designers rely on redirection when there is a need to change the layout of a particular website or the location of a specific page.

To redirect from an HTML page, we use the META Tag. Along with this, we also use the http-equiv attribute to provide an HTTP header for the value of the content attribute. The value in the content is the number of seconds; you want the page to redirect after.

Set the content attribute to 0, if you want it to load immediately. Otherwise, assign a time in seconds if you want to delay the redirection for a bit.

Syntax

<meta http-equiv="refresh" content="time; URL=new_url" />

As we can observe that redirect requires two parameters −

Time: represents the delay before the browser redirects the user to a different page.
New_url: represents the URL address we need to redirect user to after the delay.

Following are the examples….

Example

In the following example we are redirecting the page to another page by specifying the URL link in the <meta tag>.


<!DOCTYPE html>
<html>
<head>
   <title>HTML Redirect</title>
   <meta http-equiv="refresh" content="5; url = https://www.tutorialspoint.com/index.htm" />
</head>
<body>
   <h1>WELCOME TO Tutorialspoint</h1>
   <p>you'll be redirected to Tutorialspoint Homepage, in 5 seconds.</p>
</body>
</html>

As soon as you run the code the browser window opens and waits for 5 seconds before automatically redirecting to the tutorials point homepage

Delay A Redirect HTML Page

If we face any error while redirecting to the another page or delay of redirect page sometimes, it might happen if we are using old browsers.inspite to over this we will mention a new link to the web page.


<!DOCTYPE html>
<html>
<head>
   <meta http-equiv="refresh" content="5; URL=https://www.tutorialspoint.com/index.htm" />
</head>
<body>
   <p>If you are not redirected in five seconds, <a href="https://www.tutorialspoint.com/index.htm">click here</a>.</p>
</body>
</html>