Article Categories
- All Categories
-
Data Structure
-
Networking
-
RDBMS
-
Operating System
-
Java
-
MS Excel
-
iOS
-
HTML
-
CSS
-
Android
-
Python
-
C Programming
-
C++
-
C#
-
MongoDB
-
MySQL
-
Javascript
-
PHP
-
Economics & Finance
How to redirect URL to the different website after few seconds?
Page redirection is a situation where you click a URL to reach page X but are automatically directed to another page Y. This happens due to page redirection configured by the website developer.
To redirect a URL to a different website after a few seconds, use the META tag with the http-equiv="refresh" attribute and the content attribute. The content attribute sets the delay in seconds before the redirect occurs.
Syntax
Following is the syntax for URL redirection using the META tag −
<meta http-equiv="refresh" content="seconds; url=destination_url">
Where −
- seconds − The number of seconds to wait before redirecting
- destination_url − The URL of the target website or page
How It Works
The http-equiv="refresh" attribute tells the browser to refresh or redirect the page. The content attribute contains two parts separated by a semicolon: the delay time in seconds and the target URL. When the page loads, the browser waits for the specified time and then automatically navigates to the new URL.
Example − 10 Second Redirect
Following example demonstrates redirecting the current page to TutorialsPoint website after 10 seconds −
<!DOCTYPE html> <html> <head> <title>Page Redirect Example</title> <meta http-equiv="refresh" content="10; url=https://www.tutorialspoint.com"> </head> <body style="font-family: Arial, sans-serif; text-align: center; padding: 50px;"> <h1>Redirecting...</h1> <p>You will be redirected to TutorialsPoint in 10 seconds.</p> <p>If you are not redirected automatically, <a href="https://www.tutorialspoint.com">click here</a>.</p> </body> </html>
When this page loads, users see a message indicating they will be redirected, and after 10 seconds, the browser automatically navigates to TutorialsPoint.
Example − 3 Second Redirect
Following example shows a faster redirect to a different website after just 3 seconds −
<!DOCTYPE html>
<html>
<head>
<title>Quick Redirect</title>
<meta http-equiv="refresh" content="3; url=https://www.google.com">
</head>
<body style="font-family: Arial, sans-serif; text-align: center; padding: 50px; background-color: #f8f9fa;">
<h2 style="color: #007bff;">Page Moved</h2>
<p>This page has moved to a new location.</p>
<p>Redirecting in 3 seconds...</p>
<div style="margin-top: 20px;">
<a href="https://www.google.com" style="color: #007bff; text-decoration: none; padding: 10px 20px; border: 1px solid #007bff; border-radius: 5px;">Go Now</a>
</div>
</body>
</html>
This example provides a styled message with a manual link option, giving users control if they want to navigate immediately instead of waiting.
Example − Immediate Redirect
Following example shows an immediate redirect with 0 seconds delay −
<!DOCTYPE html> <html> <head> <title>Immediate Redirect</title> <meta http-equiv="refresh" content="0; url=https://www.tutorialspoint.com/html/index.htm"> </head> <body style="font-family: Arial, sans-serif; text-align: center; padding: 50px;"> <p>Redirecting immediately...</p> </body> </html>
With content="0", the redirect happens instantly as soon as the page loads, similar to a permanent redirect.
Common Use Cases
URL redirection using META tags is commonly used in the following scenarios −
- Website Migration − When moving to a new domain, redirect old pages to new URLs
- Maintenance Pages − Temporarily redirect users while performing site maintenance
- Thank You Pages − Redirect users to the homepage after form submission
- URL Changes − When page locations change, redirect to the new location
- Mobile Redirects − Redirect desktop users to mobile versions of websites
Alternative Methods
While META refresh is simple and widely supported, other redirect methods include −
JavaScript Redirect
setTimeout(function() {
window.location.href = "https://www.tutorialspoint.com";
}, 5000);
Server-Side Redirects
Server-side redirects using HTTP status codes (301, 302) are preferred for SEO purposes as they properly inform search engines about the redirect.
Best Practices
- Always provide a manual link as a fallback option
- Use appropriate delay times − too short may confuse users, too long may frustrate them
- Inform users about the redirect with clear messaging
- For SEO purposes, consider server-side redirects (301/302) instead of META refresh
- Test redirects across different browsers to ensure compatibility
Conclusion
The META refresh tag provides a simple client-side method to redirect URLs after a specified delay. Use <meta http-equiv="refresh" content="seconds; url=destination"> in the document head, always provide user-friendly messaging and fallback links, and consider server-side redirects for better SEO performance.
7K+ Views
