non ha molto senso realizzare una progress bar per il caricamento di una pagina perché il lavoro lo esegue si php, ma quello che il browser riceve da web è veramente poco

se vuoi un consiglio può fare una cosa...ovvero metti tutto quello che devi visualizzare dentro un div a cui dai la larghezza del body, in questo modo non dovrebbe scombussolarti molte cose, dopo di che imposti lo stile display: none e visibility: hidden

dopo di che metti un altro DIV che centri nella pagina html.
e li dentro metti del testo e una ipotetica progress bar

tramite JS puoi verificare lo stato di caricamento delle immagini tramite la propietà complete...l'elenco delle immagini lo trovi nell'array images di document

in pratica o imposti l'evento onload, onerror e onabort su dei tuoi hanlder specifici

imposti un timeout e ogni 200 millisecondi (ad es) ti cicli l'array e fai apparire una barra (a cui, ad es, ti basta aumentare o diminuire la lunghezza) che indica il progresso del caricamento...fatto questo quando si verifica la propietà onload del body vuol dire che il loader deve sparire...quindi fai riempire tutta la barra, aspetti, ad es altri 400 millisecondi cosi si vede che il caricamento è eseguito e poi nasconde il div del loader e fa apparire l'altro

cmq questo è un problema specifico di html o scripting ^^