Bonjour,
 
Je suis en train de réaliser un site et je suis confronté à un probleme de taille, qui est loin d'etre original mais neanmoins tres prise de tete. Mon site est constitué de nombreuses images et de quelques scripts js et jquery. par contre pas de flash de prevu.
les images sont optimisées, cependant comme c'est un site destiné à montrer des creations graphiques je peux pas trop renier sur la qualité non plus.
qd les pages se chargent cest vraiment laid, car chaque image s'affiche une par une. donc ce que je voudrais c'est une page de prechargement (avec une barre de chargement si possible) qui chargent toutes les images du site et tous les scripts dans le cache, de maniere a ce que la navigation par la suite se fasse sans aucun chargement.
 
jai beaucoup fouille le net. et jai trouve des barres de chargement mais qui ne sont relies a rien ... en gros cest juste decoratif ...
 
jai aussi trouvé des solutions de prechargement mais qui concerne malheureusement le flash or mon site nest pas en flash ...
donc je suis pas sur que je puisse les utiliser (elles se trouvent sur le site de mediabox)
 
je vois a peu pres comment faire mais je suis pas capable de le coder. ma connaissance du javascript est trop mauvaise. donc avez vous un script sous la main ou des pistes a me suggérer ?
 
merci d'avance

Sinon, bon, c'est pas franchement une solution,
mais faute de mieux, tu peux toujours tenter un
truc : ce serait d'enregistrer toutes tes images
en progressif (comme tu parle de « qualité », je
suppose que tu as opté pour du PNG plutôt que
pour du JPG) ; à ce moment-là, tu peux choisir
de l'encoder en PNG qui s'affiche petit à petit
(donc de haut en bas), et là, c'est moche ;
mais tu peux aussi les encoder en progressif,  
c'est-à-dire que ça s'affichera par couche (en
gros, ça fait une sorte d'image floue qui se  
précise petit à petit), c'est donc moins laid...
 
Voilà ! Je sais que ça ne répond pas  
franchement à ta question, mais ce sera  
mieux que rien (ou pas)... ! :-)

un truc dans le genre de http://www.outcut.de/MooFlow/  ?

quelquechose de ce genre du moins juste pour le prechargement et le gif animé du debut. car je ne veux pas non plus de gallery.
 
l'histoire du png m'interesse pas mal.  
 
sinon jai fini par trouve ce script :
 
http://www.patrickperron.com/2008/ [...] avascript/
 
il fonctionne tres bien. en fait il repere tous les elements de la page et les charge et affiche tout d'un coup. probleme : il ne le fait que pour la premiere page du site, or il faudrait qu'il charge toutes les images du site. voila le code, vous auriez une idee de comment le modifier pour qu'il charge en plus un liste d'image ?
 
// Vous pouvez changer la vitesse (speed) (1 == tres rapide)
// Vous pouvez changer la qualité de la transition (1 == best)
// Plus la transition est de qualité, plus la rapidité ralenti et doit être augmenté
var speed = 10;
var transition = 10;
 
// Dimensions du preloader en GIF animé
var GIFpreloadLargeur = 20;
var GIFpreloadHauteur = 20;
 
var timer= 0;
var opaciT = 100;
 
function opacity()
{
    opaciT = opaciT - transition;
 
    var object = document.getElementById("preloader" ).style;
    object.opacity = (opaciT / 100);
    object.MozOpacity = (opaciT / 100);
    object.KhtmlOpacity = (opaciT / 100);
    object.filter = "alpha(opacity=" + opaciT + " )";
     
     if (opaciT <= 0)
     {
          document.getElementById("preloader" ).style.visibility="hidden";
          clearInterval(timer);
     }
 
}
 
function preload()
{
     if (document.getElementById)
     {
          document.getElementById("preloadIMG" ).style.visibility="hidden";
          timer = setInterval("opacity()",speed);
     }
     
     else
     {
          if (document.layers)
          {    
               document.preloadIMG.visibility = "hidden";
               timer = setInterval("opacity()",speed);
         }
             else
          {
               document.all.preloadIMG.style.visibility = "hidden";
               timer = setInterval("opacity()",speed);
          }
     }
}
 
// GÉNÉRER LE CSS POUR LE PRELOADER
var myCSS;
myCSS = "<style type=\"text/css\">";
 
myCSS += "html, body { height:auto; margin:0px; padding:0px;}";
 
myCSS += "#preloader {";
myCSS += "position:fixed;";
myCSS += "background-color:white;";
myCSS += "width:100%;";
myCSS += "height:100%; ";
myCSS += "display:block;";
myCSS += "z-index:100000;";
myCSS += "}";
 
myCSS += "#preloadIMG {";
myCSS += "position:absolute;";
myCSS += "left:50%;";
myCSS += "width:" + GIFpreloadLargeur + "px;";
myCSS += "height:" + GIFpreloadHauteur + "px;";
myCSS += "margin-left:-" + (GIFpreloadLargeur / 2) + "px;";
myCSS += "top:150px;";
myCSS += "}";
 
myCSS += "</style>";
 
// ÉCRITURE DES CSS
window.document.write(myCSS);
 
// ÉXÉCUTION
window.onload = function() { preload(); }

Ce que tu demandes est en gros un système de "prefetch" ( "link prefetch" dans google )
 
J'ai vu passé un bon lien sur le sujet il y a quelques jours. Je te préviens dès que je peux si je le retrouve.
 
Au fait, il faut faire attention à ne pas indiquer trop de fichier à précharger pour trois raisons :
1) ça augmente la bande passante utilisé (il risque de précharger des fichiers que le navigateur n'aura jamais besoin d'afficher) ce qui peut être gênant pour le serveur et le visiteur (risque de dépassement de quotas journalier/mensuel/autre)
2) le préchargement s'arrête dès que l'utilisateur demande une nouvelle page ou que la page courante demande des données sur le net (ajax, récupération dynamique par une animation en flash, etc)
3) si le serveur ne lui indique pas de durée de validité pour les fichiers alors le navigateur vérifiera s'il y a une nouvelle version des fichiers à chaque fois qu'il affiche une page qui demande le préchargement du fichier même si la page s'indique elle même dans la liste des fichiers à précharger.
 
Les fichiers qu'il faut mettre en préchargement sont donc les fichiers qui seront demandé sur la page suivante (distance de 1 clic par rapport à la page courante) et qui ne risquent pas de changer avant d'être redemandé.
Les fichiers qu'il ne faut surtout pas mettre en préchargement sont :
- les fichiers perdu dans des pages lointaines (peu de chance d'être consulté)
- les fichiers qui changent souvent (ça ne sert à rien de précharger une photo qui est remplacé toutes les 30 secondes, comme par exemple les photos diffusé sur un site web par une webcam)
- les fichiers qui ne sont quasiment jamais affiché (c'est en regardant les statistiques du site qu'on peut repérer les pages les moins consultés)
 
En résumé : tout précharger depuis la page d'accueil de ton site est une grossière erreur. Mieux vaut précharger progressivement les différents fichiers surtout qu'on est jamais sur que les visiteurs passent par la page d'accueil.