List of Topics

SfC Home > Web Design >

 

Redirecting to Another Web Page

by Ron Kurtus (revised 5 August 2011)

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:

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

Click Here

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

Ron Kurtus' Credentials

Websites

Web Design Resources

Books

Top-rated books on Website Design


Questions and comments

Do you have any questions, comments, or opinions on this subject? If so, send an email with your feedback. I will try to get back to you as soon as possible.


Share

Click on a button to bookmark or share this page through Twitter, Facebook, email, or other services:

 

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.

Copyright © Restrictions


Where are you now?

School for Champions

Web Design topics

Redirecting to Another Web Page




Web Design topics

Goals

Purpose

Preliminaries

Content with HTML

Format with CSS

Navigation

Usability

Responsive websites

Visibility

Also see



Let's make the world a better place

Be the best that you can be.

Use your knowledge and skills to help others succeed.

Don't be wasteful; protect our environment.

You CAN influence the world.





Live Your Life as a Champion:

Take care of your health

Seek knowledge and gain skills

Do excellent work

Be valuable to others

Have utmost character

Be a Champion!



The School for Champions helps you become the type of person who can be called a Champion.