How to Redirect a Web Page in HTML

In this post, we will learn how to redirect a visitor to another web page in HTML automatically.

Redirect

A redirect is when a user visits a URL but is automatically redirected to another URL.

Websites use redirects for many reasons, like to make sure that a user is sent to the correct page, or when a page is accessed without authorization.

HTML Redirect

To perform an HTML redirect, we can use a meta tag and add the http-equiv attribute to it.

	<meta http-equiv="Refresh" content="0; url='https://sabe.io'" />

The value of Refresh tells the browser that it should refresh. However, instead of refreshing the current page, we can turn this into a redirection.

The value of content tells the browser how long it should wait before refreshing but we can add a url to set where to redirect the user.

In this case, setting the time to 0 means that the browser should redirect the user immediately. It will send users to https://sabe.io.

If you want to add a delay before redirecting the user, you can use the content attribute to specify the delay.

Here is a delay of 5 seconds:

	<meta http-equiv="Refresh" content="5; url='https://sabe.io'" />

Here is the general syntax for an HTML redirect, just fill in your SECONDS and URL:

	<meta http-equiv="Refresh" content="SECONDS; url='URL'" />

Here is a full example of redirecting a web page using the meta tag in HTML:

	<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="refresh" content="5; url='https://sabe.io'" />
    </head>
    <body>
        <p>Visit <a href="https://sabe.io">Sabe.io</a>.</p>
    </body>
</html>

Conclusion

We've seen how you can redirect a user to another web page in HTML.

Hopefully this post has been useful to you!

If you want to learn about web development, founding a start-up, bootstrapping a SaaS, and more, follow me on Twitter! You can also join the conversation over at our official Discord!