We all remember what it was like to bring up web pages before fast access.  We swore alot.  We were much more uptight.  Life on the internet was a much less pleasurable experience.  Shop online?  We were lucky if we could check the weather before the weather changed! 

Hey, guess what?!  There are still people out there using dial-up.  No, seriously, I'm not kidding!  Some of them are just not interested in the web.  Others haven't yet been hooked by experiencing it in all its new speedy glory.  Still others are outside of the service boundries of fast service providers.  This is really a tragedy and I do feel sorrow for these poor souls who not only live far from cultural epicenters and stimulation but can't even while away the time surfing for their digital self.  They are forced to resort to the propaganda box, the tv, and watch what they are told to.  No choice by click.  Sorry y'all, blame the phone company for being slack.

Internet product managers and producers have to make a choice as to whether they should continue to cater to the slow lane or embrace new technologies which bloat the size of each page, thereby decreasing its loading quickness but increasing its boom, bang, zoom... 

Of course, they could do both, create an adaptable website that only delivers the content the user can tolerate.  Unfortunately, that significantly increases the development cost, even when well thought out, because focus must be directed in duplicity.  One site that loads fast, one site that does or has a lot of cool stuff.

After this long introduction, I finally approach a point and some technical experience.  

Images are used for all kinds of things.  Some images are for display.  Some of them are advertisements (which we hate but need at the same time - unless you want to pay to surf a site...) Others are for holding space.  A purist will tell you not to do that, don't use images as stretchers, placeholders or background colors.  Use stylesheets and WC3 compliant html.  Anyone whose worked in the real world will agree that this is not always possible.  If some of your customers are still on Windows 98 and some of them use netscape, you have to support their choice of browser.  Therefore, to make the page look nice, you have to stick an image here or there to make things align and lay out nicely.

Here's the trouble.  Images are requested independently from the page.  The page starts to load in the browser and in comes an image reference.  It must now make a seperate request to the web site to get that image.  The image loads and is placed where it belongs.  This presents a problem but also a solution...

If you have some javascript that fires onLoad, the page may wait for all the images before it runs the javascript.  If that javascript is important, a dial-up user may never actually see what it does. 

If the javascript references some image on the page or some part of the DOM, it may not be able to execute until the images are finished loading. 

<script>

function RunMyCoolJavascriptfunction(){
var iLeftLocation=document.getElementById('holdspace').offsetLeft;
//the above requres the images be loaded before it can get info about it.
}

</script>

Moving the call to execute the javascript from the page load to some location in the page causes the entire page to wait for the images

...some html content
<script>
RunMyCoolJavascriptfunction();
</script>

...some more html content

What to do?!

I don't want to wait for the entire page load to fire my javascript but I also really want to start that very important javascript!  The images aren't necessary for the javascript to do its thing so let's make this work in a more desireable order of execution.

first of all, we need to remove the reference to the image in the javascript.  We need a left position.  If we know where we are putting that placeholder image then why can't we figure out programatically where that is?

this worked for my situation, yours might be slightly different...

function RunMyCoolJavascriptfunction(){
    var iBodyWidth=document.body.clientWidth;
    if(iBodyWidth<(iMyWidth+166)){ 
        iMyLeft = 166;
    }else{ 
        iMyLeft = ((iBodyWidth - (iMyWidth+166)) / 2) + (166-12) ;
        //body minus module width plus width of left nav divided by two then shifted over half of left nav width mnus scroll bar
    }
}

Now that the image ref is gone from the javascript, lets call it...  where? 

You could probably place this inline but, just to be sure, lets find something that will ensure that the page html is there before we call the function.

<IMG src="/images/clear-dot.gif" onload="if(typeof(RunMyCoolJavascriptfunction)!='undefined') RunMyCoolJavascriptfunction();"
   WIDTH="1" HEIGHT="1"  STYLE="visibility:hidden; position:relative;display:none;">

this will first make sure the function is there and then execute it when this image loads.  This is a small image and should return more quickly then, say, the huge, stupid, annoying flash ad that takes over the screen in  a moment.  Yes, you'd better get your cool stuff to fire first because that flash ad is about to make them leave.

I duplicate this call in the body onload just in case the image doesn't fire and ad a flag that only allows the start to happen once

var bStarted = false;

function RunMyCoolJavascriptfunction(){
    if(!bStarted ){
        var iBodyWidth=document.body.clientWidth; 
        if(iBodyWidth<(iMyWidth+166)){ 
            iMyLeft = 166; 
        }else{ 
            iMyLeft = ((iBodyWidth - (iMyWidth+166)) / 2) + (166-12) ; 
            //body minus module width plus width of left nav divided by two then shifted over half of left nav width mnus scroll bar 
        }
        bStarted = true;
    }
}

Cool!  Now the page loads.  The html displays.  Then, as the images begin to download, a small image causes the javascript to start.  Our spiining, flaming logo does its most excellent stuff, and the rest of the images come down in turn.

The bottom line is that you have to think about the impact each page item has on your user, the order you want things to load and execute and what the overall user experience will be in different browsing situations.  Someday everyone will have fast connections, standards compliant browsers and advertisers will stop believing that pop ups, pop unders and take overs are good things.

Until then, good luck