Meta Tag, Javascript Refresh and Time Delay

Javascript which enables the browser to load a time-delayed target page into an iframe, but omits the loading page from the browser history.

The scripts detailed in this page were combined to create this time-delayed loading file:

See my page for coding to create a perfect iframe and rotating banners as is being incorporated and/or optional, in the sample above.

APPEARS TO BE ONE OF TWO CORRECT & FINAL SOLUTIONS:
this code is inserted in the metatags, between <head> and </head>

content="15" is the variable for number of seconds, until loading target URL.
setTimeout 15000 represents 15*1000 for 15 seconds.


<!-- BEGIN SCRIPT -->
<noscript><meta http-equiv="refresh" content="15; url=target.html"></noscript>
<script><!--  var version = parseInt(navigator.appVersion)  // replace is supported

  if (version>=4 || window.location.replace)  setTimeout("window.location.replace('target.html')",15000); 
else    window.location.href =
"target.html"//
--></script>
<!-- END SCRIPT -->

This script was designed for use in metatags of your target document, inside an iframe to load large ads or other what-nots, after the actual body of the article has had time to fully load. Out of respect for the visitor's time, and convenience to leave the site when they want to, and returning immediately to their point of origin.
They should already be reading the article they came for, when the iframe begins loading.

Using a script like this, I guarantee your visitors will respect you the morning after.

WHY I CHOSE THE FINAL CODE SOLUTION (ABOVE)
From emails over the weekend:

"The traditional method for redirecting a page is to use a "refresh" meta-tag. The biggest problem with using this method is that the redirection page is included in the visitor's page history, and thus when the user selects the "back" button and reaches the redirection page again they will be immediately returned to the redirection-target page".

Myself: and those visitors may not want to return to the site.

COMMENT ON PROBLEMS IN SOME JAVASCRIPT FOR RE-DIRECTION

    Using a plain metatag, the frame loads immediately, and then the redirect refreshes to the frame of animated gifs.
    Click on the back button and see where you go however.
    I need a script where they can hit the back button and get back to point of origin if they want, by-passing the metatag refresh in their browser.
  • If I set those large graphics to initiate immediately, it drags down the loading time and our visitors don't like that. I've noticed an increase in our traffic since delaying the amount of time for the graphics to load. I placed a meta refresh tag into a tiny html file, that after 15 or 20 seconds, it loads the actual html page containing the graphics with delayed loading.

  • The drawback is, when the visitor clicks on their back button to return to their point of origins, they won't return there --the "loading page with the meta refresh tag" is brought up, and it'll send them right back to graphics loading.

I did find one script on the web which erases that loading page out of the browser's history, so when the visitor clicks on their back button, they can go straight back to where they first entered... but the drawback is, despite the script supposedly allowing x*1000 (each x is suppose to be a second) -- it disregards that, and immediately loads the page, and that totally defeats the purpose of allowing the page to load before the graphics.

A CORRECT JAVASCRIPT
Here is a partially correct script for this *specific* problem (above). <-- small correct script, still the problem with time.

<script><!--  var version = parseInt(navigator.appVersion)
  // replace is supported
if (version>=4 || window.location.replace)    window.location.replace("target.html") 
else    window.location.href = "target.html"// --></script>

However, he does not cover how to get the javascript to delay loading. It still loads immediately.

META HTTP-EQUIV="Refresh" CONTENT="2; http://www.insideDHTML.com/home.asp"

the 'content="2' is suppose to set the amount of seconds before redirecting, normally it will, but not with the javascript in the head.

Yep, my browser button says "Back to Google", but the image frame loaded immediately, no delay. That also defeats the purpose.

Concerning advice located here.

The information is *perfect*, except... how to set delayed loading time?

This code automatically refreshes to the page that's targeted, but gives no delay time. I noticed in my search all over the web a majority of webmasters seem to overlook that aspect.

If our visitors want to click on the back button and leave our website, I don't want to trap them with a disabled back button. I want them to be able to return right back to wherever they came from in one click. Having to make multiple clicks on the back button is aggravating and confusing).

So, how to set a time delay in the javascript?


As a last resort... post in a forum and be specific of what you're after.

Above all, if you're a webmaster please always spell out the complete code and not parts of it. *please*. That was part of my difficulty. It took about three days or more surfing the web, piecing together what a person should do for this particular javascript. Webmasters were posting only portions of the Javascript.

THE CODE REQUIRED TO FIX THE PROBLEM
This is the code required to fix the problem.

Posted by Kaleb.

<script
type="text/javascript"><!--setTimeout("location.replace('target.html')",15000);--></script>



Browsers with javascript disabled may have trouble, (the frames should load with the meta-refresh tag, but they'll have to click, click, click to get back out) but most users apparently do have javascript enabled.

I tinkered with the script, using the javascript I picked up at webmasterworld.com combined with the script from insidedhtml.com

insidedhtml site states: We recommend one of two solutions. First, we have a short script that solves this problem. JavaScript 1.1 (supported by Netscape 3.0 browser and later and Internet Explorer 4.0) added a method to the location object, replace.
The purpose of the explanation is to cover browsers that do not support JavaScript 1.1. For those browsers, the navigation is not automatic and this page is added to the history. However, since the navigation is manual, the user can easily back through this page. For browsers that support JavaScript 1.1, it is as if this page never existed. The second solution is a compromise for sites that believe they must have automatic redirection whenever possible. For those sites, we use a combined approach...

This seems to work perfectly too:

<script><!--  var version =
parseInt(navigator.appVersion)  // replace is supported

  if (version>=4 || window.location.replace) 
setTimeout("window.location.replace('target.html')",15000); 
else    window.location.href = "target.html"//
--></script>

Now go one more, and tinkering with what http://grizzlyweb.com states about wrapping your meta-refresh tag
in <noscript></noscript>

Grizzly Webmaster's site states: We do use the "refresh" meta-tag nested in a <noscript> block as a backup method to the JavaScript for browsers that do not support JavaScript at all.

<noscript><meta http-equiv="refresh" content="15; url=target.html"></noscript>

The Script Looks Like This


<noscript><meta http-equiv="refresh" content="15; url=target.html"></noscript>
<script><!--  var version = parseInt(navigator.appVersion)  // replace is supported

  if (version>=4 || window.location.replace)  setTimeout("window.location.replace('target.html')",15000); 
else    window.location.href =
"target.html"//
--></script>

Our visitors should have faster loading pages, and if they want to leave, they simply click one time on the back button (instead of back through meta refresh loading pages). This is way cool.

Additional Keywords: make part of document load after specific time, iframe preventing back button reloading refresh meta, iframe meta refresh javascript seconds back button, iframe meta refresh javascript seconds, meta refresh javascript set time, window.location.replace delay refresh inside frame, window.location.replace refresh inside frame, window.location.replace delay load time, window.location.replace refresh, window.location.replace, timed redirect javascript, time redirect javascript, meta refresh javascript document.replace, remove history document.location.replace, javascript reload new page without storing redirect back button meta refresh, visitor leave website back button meta refresh, visitor leave website back button meta


REDIRECTS

Here's an added bonus. ((REDIRECT FILES)). If you are moving to a new web site, and relocating your articles. You can use the following script to redirect your visitors to the new URL. In internet explorer, it will erase history of the old URL in thier browser and replace with the new URL. Once arriving safely at the new URL, if they should click the Back button, there should be no record of the old URL and they should return safely from whence they came.

<html>
<head>
<title>Old Name of Your Page</title>
<meta content="Description Optional" name=description>
<meta content="Keywords Optional" name=keywords>
<meta name="robots" content="index,follow">

<noscript>
<meta http-equiv="refresh" content="1; url=http://example.com/location-of-new-page.html">
</noscript>

<script>
<!--
var version = parseInt(navigator.appVersion)
// replace is supported

if (version>=4 || window.location.replace)
setTimeout("window.location.replace('http://example.com/location-of-new-page.html')",1000);
else
window.location.href = "http://example.com/location-of-new-page.html"
// -->
</script>

</head>

<body bgcolor="#ffffff">

</body>
</html>

No comments:

Post a Comment