You are here:About>Computing & Technology>Web Design / HTML> About.com Web Design A to Z> Books> About Web Design Book> AWD: Chapter 10> Meta Refresh Tag
About.comWeb Design / HTML
Newsletters & RSSEmail to a friendSubmit to Digg
More Meta Tags

Basic Meta TagsMeta Tags for PromotionMore Meta Tags

More Meta Tags

Even More Meta TagsMeta Tag GeneratorMeta Tag Links

Meta Refresh Tag

From Jennifer Kyrnin,
Your Guide to Web Design / HTML.
FREE Newsletter. Sign Up Now!

Redirecting Your Customers

One of the most common uses of the meta tag is to reload and redirect Web pages. This tag is easy to use and misuse.

The Meta Refresh Tag

The meta tag belongs within the <head> of your HTML document. When used to refresh the current page, the syntax looks like this:

<meta http-equiv="refresh" content="600">

meta
This is the actual HTML tag. It belongs in the <head> of your HTML document. You can learn more about the meta tag in my tag library.

http-equiv="refresh"
This attribute tells the browser that this meta tag is sending an HTTP command rather than a standard meta tag. Refresh is an actual HTTP header used by the Web server. It tells the server that the page is going to be reloaded or sent somewhere else.

content="600"
This is the amount of time, in seconds, until the browser should reload the current page.

Some of the more common uses of the reload version of the refresh tag is to reload a page that has dynamic content on it. For example: a stock ticker or weather map. Some people also use them to reload ads, but that can annoy your readers.

Redirecting to a New Page

While the reload option is useful, it is usually not what people want from the meta refresh tag. To redirect to a new page, the syntax is nearly the same:

<meta http-equiv="refresh" content="2;url=http://webdesign.about.com">

The only difference is in the content attribute.

content="2;url=http://webdesign.about.com"
The number is the time, in seconds, until the page should be redirected. Then, separated by a semi-colon (;) is the URL that should be loaded.

Keep In Mind

Meta refresh tags have some drawbacks:

  • If the redirect happens quickly (less than 2-3 seconds), readers with older browsers can't hit the "Back" button. This is a usability problem.
  • If the redirect happens quickly and goes to a non-existant page, your readers won't be able to hit the "Back" button. This is a usability problem that will cause people to completely leave your site.
  • Refreshing the current page can confuse people. If they didn't request the reload, some people can get concerned about security.

Previous Features
Las Vegas on a Budget

Find a BargainHotel DealsCheap EatsFree AttractionsEntertainment for Less

 All Topics | Email Article | | |
Advertising Info | News & Events | Work at About | SiteMap | Reprints | HelpOur Story | Be a Guide
User Agreement | Ethics Policy | Patent Info. | Privacy Policy©2008 About, Inc., A part of The New York Times Company. All rights reserved.