Open In App

How to redirect to another webpage in HTML?

Last Updated : 24 Apr, 2019
Improve
Improve
Like Article
Like
Save
Share
Report

It is often required to redirect to another webpage on loading a webpage, for example, due to the contents being moved to the new webpage.

Demonstrated here are two simple methods to redirect to another webpage on load.

Method-1: Using http-equiv attribute of the meta tag in HTML.

Syntax:

<meta http-equiv="refresh" content="seconds; url=URL">

Example-1:




<!DOCTYPE HTML>
<html>
  
<head>
    <title>
        Redirect to GeeksforGeeks
    </title>
    <!-- meta tag to redirect to 
     ide.geeksforgeeks.org after 2 seconds -->
    <meta http-equiv="refresh"
          content="2; 
                url=https://ide.geeksforgeeks.org/">
</head>
  
<body>
    <!-- Link to the destination page 
      in case the refresh does not work -->
    You will be redirected to GeeksforGeeks in a moment.
    <br
    If you are not redirected automatically, 
    <a href="https://ide.geeksforgeeks.org/">
      click here
    </a>.
</body>
  
</html>


Output:
Before:

After 2 seconds:

Note: In some older browsers, like Internet Explorer 6, refresh may cause unexpected results and impair the browser’s Back button. This is compensated for in most modern browsers (Internet Explorer 7 and higher, Google Chrome, Mozilla Firefox, Microsoft Edge).

Method-2: Using location.href in JavaScript.

Syntax:

window.location.href = "URL"

Example-2:




<!DOCTYPE HTML>
<html>
  
<head>
    <title>
        Redirect to GeeksforGeeks
    </title>
    <script type="text/javascript">
        
        /* location.href used to
        redirect to ide.geeksforgeeks.org */
        window.location.href =
          "https://ide.geeksforgeeks.org/"
    </script>
</head>
  
<body>
    <!-- Link to the destination page in
     case the redirect does not work -->
    You will be redirected to GeeksforGeeks in a moment.
    <br>
    If you are not redirected automatically, 
    click here 
   </a>.
</body>
  
</html>


Output:

Note: This method works fine for any JavaScript enabled browser.



Similar Reads

Redirect to another webpage using JavaScript
To redirect to another webpage using JavaScript, you can utilize the window.location.href property or the location.replace() method. Below are the methods used to redirect to another webpage using JavaScript: Table of Content Using location.href to redirect to another webpage Using location.replace() to redirect to another webpage Using location.hr
3 min read
How to redirect a page to another page in HTML ?
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. Table of Content Redirect using a meta tag
3 min read
How to Redirect to Another Page After 5 Seconds using jQuery ?
In this article, we will learn, how to redirect to another page or URL after a specified time in jQuery. The built-in function used for performing the action is as follows. The setTimeout(callback, delay) function takes two parameters a callback and a time in milliseconds. When this method is called, the callback function will be executed after the
1 min read
How to redirect to another page in ReactJS ?
Redirect to another page in React JS refers to navigating to different components in the single page react app using the react-router-dom package. To switch between multiple pages react-router-dom t enables you to implement dynamic routing in a web page. ApproachRedirect will be implemented by using the react-router-dom package used to define routi
3 min read
How to Redirect to Another Page in VueJS ?
Redirecting to another page is a common requirement in web development especially in the Vue.js applications. It allows users to navigate seamlessly between the different views or pages within the application. These are the following methods: Table of Content Using router.push() methodUsing the router-link componentUsing router.push() methodThis ap
2 min read
How to Redirects to Another WebPage if User Idle for 10 Seconds in JavaScript ?
In this article, we will create a webpage that redirects to another page if the user is idle for more than one minute. We will use JavaScript to redirect the web page to another web page if the user is ideal for 10 seconds. Approach: To make this, we will use setTimeout() and clearTimeout() methods. The setTimeout() method is used to start the coun
2 min read
How to use Meta Tag to redirect an HTML page?
URL redirection, also called URL forwarding is a way to send users to a different URL from the one they originally requested. The three most commonly used redirects are 301, 302, and Meta Refresh. Meta Refresh Redirect is a client-side redirect. Unlike 301 and 302 redirects that happen on the webserver, Meta Refresh Redirect takes place in a web br
1 min read
How to redirect to a particular section of a page using HTML or jQuery?
Redirection will take the user to the desired page or section of the website that the user wants to visit. We will do it using HTML and jQuery differently. Let us take a look at the practical implementations. Table of Content Using HTMLUsing JQueryMethod 1: Using HTMLOne can use the anchor tag to redirect to a particular section on the same page. Y
3 min read
Which attribute is used to target the webpage to open into a new window in HTML ?
In this article, we will learn how to open a webpage in a new window using the TARGET attribute of HTML. The Target attribute of &lt;a&gt; anchor tag is used to specify the named frame or window the link will open. The &lt;a&gt; is paired tag, so both starting&lt;a&gt; tag must have closing&lt;/a&gt; tag in the HTML document. Anchor tag has many at
2 min read
Design a transparent login/Sign Up webpage using HTML and CSS
Project Introduction: In this article, we will discuss how to design a transparent login webpage using HTML and CSS. Project Structure: index.htmlstyle.css index.html Explanation: We have put the login form in a class called container and we have placed each input tag in a separate div with class row so that each input tag occupies the full line. W
3 min read
Article Tags :