Pon esto antes a continuación de la etiqueta <HTML>
Código HTML:
<div ID="waitDiv" style="position:absolute;left:100;top:80;visibility:hidden">
<table cellpadding="6" cellspacing="0" border="0">
<tr><td align=center>
<font color="#777777" face="Arial, Verdana" size="2">CARGANDO ...</font><br><br>
<img src="img/cargando.gif" border="0">
</td>
</tr></table>
</div>
<SCRIPT>
<!--
var DHTML = (document.getElementById || document.all || document.layers);
function ap_getObj(name) {
if (document.getElementById)
{ return document.getElementById(name).style; }
else if (document.all)
{ return document.all[name].style; }
else if (document.layers)
{ return document.layers[name]; }
}
function ap_showWaitMessage(div,flag) {
if (!DHTML) return;
var x = ap_getObj(div); x.visibility = (flag) ? 'visible':'hidden'
if(! document.getElementById) if(document.layers) x.left=280/2; return true; } ap_showWaitMessage('waitDiv', 3);
//-->
</SCRIPT> -----------------------------------------------------------------------------
Y esto antes de la etiqueta </HTML>
Código HTML:
<SCRIPT language=javascript>
<!--
ap_showWaitMessage('waitDiv', 0);
//-->
</SCRIPT> Este código crea una capa invisible que se vuelve visible solo al completar la despcarga completa de tu página por lo cual debes crear esta primera capa te recomiendo descargar alguna imagen dinámica como un gif que simule una barra de cargando, pero trata de que esta no pese mucho