Redirect Url to Another Page With HTML & JavaScript

You can redirect a URL to another page using HTML or JavaScript. Here are two methods to achieve this:

Method 1: Using HTML `<meta>` Tag

You can use the `<meta>` tag with the `http-equiv` attribute set to `”refresh”` to achieve a redirect in HTML. Here’s how you can do it:

redirect.html

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="refresh" content="0;url=http://www.example.com/new_page.html">
<title>Redirecting...</title>
</head>
<body>
<p>This page has moved. You will be redirected to the new page shortly.</p>
</body>
</html>

In this example, the `content` attribute specifies the time delay (in seconds) before the redirection occurs (`0` for immediate), followed by the URL of the destination page.

Method 2: Using JavaScript `window.location` Property

You can use JavaScript to perform a redirect by setting the `window.location` property to the URL of the destination page. Here’s how you can do it:

redirect.html

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Redirecting...</title>
<script>
// Redirect to the new page
window.location.replace("http://www.example.com/new_page.html");
</script>
</head>
<body>
<p>This page has moved. You will be redirected to the new page shortly.</p>
</body>
</html>

In this example, the `window.location.replace()` method is called with the URL of the destination page as an argument. This method performs a redirect without adding an entry to the browser’s history, effectively replacing the current page.

Both methods achieve the same result, but the JavaScript approach provides more flexibility, especially if you need to conditionally redirect based on certain criteria or perform other actions before redirecting.