Redirecting a page in HTML involves sending users to a different web page automatically or upon interaction. This is typically achieved using the anchor tag’s href attribute or the meta tag with the HTTP-equiv attribute set to refresh and the content attribute specifying the time delay and destination URL.
Redirect to another page with HTML meta Tag
HTML <meta> tag contains attributes “http-equiv” set to “refresh” and “content” specifying the time delay and the destination URL. Upon page load, the browser reads this meta tag and automatically redirects the user to the specified URL after the specified time delay.
Syntax:
<meta http-equiv = "refresh" content = " time ; url = link"/>Example: Here is an example of using a meta tag to redirect one page to another page.
<!DOCTYPE html><html>
<head>
<title>Redirecting to Another page in HTML</title>
<!-- Redirecting to another page using meta tag -->
<meta http-equiv="refresh"
</head>
<body>
<h3>
Redirecting to Another page in HTML
</h3>
<p><strong>Note:</strong> If your browser supports Refresh, you'll be
redirected to GeeksforGeeks Homepage, in 5 seconds.
</p>
</body>
</html>
|
Output:
Redirect to another page with HTML meta Tag example output
Explanation:
- In the above example we are using the <meta> tag within the <head> section of the HTML document.
- Specifies the redirection behavior with http-equiv=”refresh” attribute and a 5-second delay specified in the content attribute.
- Informs users of the impending redirection in a centered paragraph.
- Improves navigation by automatically redirecting users to the GeeksforGeeks homepage.
Redirect to another page with HTML <a> Tag
Redirecting a page using the anchor tag involves specifying the destination URL in the href attribute. Upon clicking the anchor link, the browser navigates to the provided URL, facilitating seamless page redirection within the web application.
Syntax:
<a href = "link">Link Name </a>Example: Here we are using anchor tag to redirect our one page to another page.
<!DOCTYPE html><html>
<head>
<title>Redirecting to Another page in HTML</title>
</head>
<body>
<h3>
Redirecting to Another page in HTML
</h3>
<p>Click the below link to be redirected:
</p>
</body>
</html>
|
Output:
Redirect to another page with HTML Tag example output
Explanation:
- In the above example we display “GeeksforGeeks” and a link for redirection.
- using JavaScript on click we redirect.
- user clicks the link, the page will wait for 3 seconds before redirecting to the specified URL.
If you wants to redirect to another page using JavaScript please go through this article: Redirect to another webpage using JavaScript