SfC Home > Web Design >
Redirecting to Another Web Page
by Ron Kurtus (updated 21 December 2022)
There are situations where you may want to send the user to another page or website. This typically happens when the present page is no longer being used or has had its web address (URL) change.
You can automatically redirect the user either through a META tag or through JavaScript. Since it is possible that the user may have one or the other disabled, a manual link may be preferred.
Questions you may have include:
- How does using a META tag work in redirecting?
- What JavaScript code is used to redirect?
- What are factors in using a manual link?
This lesson will answer those questions.
Redirect with META tag
You can redirect the user to another page or website with a META tag in the HEAD section of your HTML code.
<META HTTP-EQUIV="Refresh"
CONTENT="5; URL=new_page.htm">
This code will refresh the page and send it to the new page in 5 seconds. You can use any number of seconds from 0 (zero) up. The URL can also be a website, such as URL=http://www.other_site.com/new_page.htm. Note that the quotation marks for CONTENT include both the time and the URL.
Can cause problems
A major problem with this technique is that it "breaks" the BACK button in most browsers. In other words, if the user clicks BACK, he or she will return to the old_page.htm and be automatically redirected to the new_page.htm.
For reasons of good user experience, it is not recommended to redirect with the META tag.
Redirect with JavaScript
You can also redirect by using JavaScript code in the HEAD or the BODY of your HTML code.
<script language="JavaScript">
<!-- setTimeout('Redirect()',4000); function Redirect()
{ location.href = '../new_page.htm';
} // -->
</script>
The 4000 is in milliseconds. 4000 ms = 4 seconds. You can have the location set as another website instead of a page within the existing site. Note that even setting 'Redirect()',1); will take long enough for the page to be displayed before the redirect takes hold.
Problem
The problem with using JavaScript is that some websites and some users have JavaScript disabled. Although the percentage is only about 6%, you still need to take that into consideration.
Using a manual redirect
Since the META redirect is not advised for usability reasons and the fact that some users may have JavaScript disabled, using a manual link to redirect your page is advisable.
Having automatic and manual is wasted effort
Some websites use one of the automatic methods but also include the option to manually use the link. In my experience, I have never waited the indicated time to automatically go to the new page and instead simply clicked on the link. So it seems like a wasted effort.
Consider search engines
One thing to consider on your redirect page is the <TITLE> and using the <H1> tag. Often the search engine will list your old page according to what you have as your title in the <HEAD> section, as well as your first <H1> tag.
I've found that my old page often lists higher in Google than my new page, probably because there are more links to the old page. Instead of leaving the <TITLE> blank or saying that the page moved as the title, I keep the original title.
A sample redirect material I use is:
Old Page has moved
to
www.school-for-champions.com/web/new_page.htm
Sorry for the inconvenience
December 2007
This conveys the needed information and performs the task effectively.
Summary
Redirect is sending the user to another page or website. This typically happens when the present page is no longer being used or has had a name change. You can redirect the user either through a META tag or JavaScript. However, using the META tag is discouraged, and it is possible that the user may have JavaScript disabled. Using a manual redirect link is probably the best. It also can help in your search engine ranking.
Consider all possibilities in your web design
Resources and references
Websites
Books
(Notice: The School for Champions may earn commissions from book purchases)
Top-rated books on Website Design
Students and researchers
The Web address of this page is:
www.school-for-champions.com/web/
redirecting_web_page.htm
Please include it as a link on your website or as a reference in your report, document, or thesis.
Where are you now?
Redirecting to Another Web Page