Highslide : chargement des images lent
Bonjour,
Je m'occupe actuellement du site d'un proche, et je rencontre quelques difficultés avec le module highslide (un image viewer en JS, pour ceux qui ne connaissent pas) : en effet, le chargement des images (les zoomé, pas les thumbnails) est trèèèèèès long.
Voilà le site en question : http://stephaneprotic.free.fr/
et le code source d'une page type des images :
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
| <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" >
<head>
<title>Stéphane Protic - Works</title>
<meta name="description" content="Site web de Stéphane Protic, artiste plasticien."/>
<meta name="keywords" content="Stephane,Stéphane,STEPHANE,Protic,PROTIC,protic,stephane,artiste,Artiste,plasticien,Plasticien"/>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link rel="icon" type="image/png" href="Design-ressources/favicon32.png" />
<link rel="stylesheet" media="screen" type="text/css" title="Blacknight" href="design-stf.css" />
<script type="text/javascript" src="highslide/highslide-with-gallery.packed.js"></script>
<script type="text/javascript" src="highslide/highslide.config.js" charset="utf-8"></script>
<link rel="stylesheet" type="text/css" href="highslide/highslide.css" />
<!--[if lt IE 7]>
<link rel="stylesheet" type="text/css" href="highslide/highslide-ie6.css" />
<![endif]-->
</head>
<body>
<div id="entete">
<br/><p><a id="linkback" href="index.html"><img class="entete" src="Design-ressources/stfprotic.png" alt="Stephane Protic" /></a></p>
</div>
<div id="menu">
<ul>
<li><a href="Text.htm"><span class="normalmenu"> Texte</span></a></li>
<li><a href="Travaux.htm"><span class="currentmenu"> Travaux/Works</span></a></li>
<li><a href="Expositions.htm"><span class="normalmenu"> Expositions/Exhibitions</span></a></li>
<li><a href="Contact.htm"><span class="normalmenu"> Contact</span></a></li>
<li><a href="liens.htm"><span class="normalmenu"> Liens/Links</span></a></li>
<li><a href="Support.htm"><span class="normalmenu"> Support</span></a></li>
</ul>
</div>
<div id="back"><a href="Travaux.htm"> <p> < BACK </p> </a></div>
<div class="corps">
<a href="images/GINGER_LYNN.jpg" class="highslide, idoles" onclick="return hs.expand(this)">
<img src="images/GINGER_LYNN_MINI.jpg"
alt="Cliquez pour agrandir" />
</a>
<div class="highslide-caption">
Ginger Lynn<br/>
Techniques mixtes sur bois<br/>
20x30 cm 2009
</div>
<a href="images/SEKA.jpg" class="highslide, idoles" onclick="return hs.expand(this)">
<img src="images/SEKA_MINI.jpg"
alt="Cliquez pour agrandir" />
</a>
<div class="highslide-caption">
Seka<br/>
Techniques mixtes sur bois<br/>
20x30 cm 2009
</div><br/><br/>
<a href="images/TRACY_LORDS.jpg" class="highslide, idoles2" onclick="return hs.expand(this)">
<img src="images/TRACY_LORDS_MINI.jpg"
alt="Cliquez pour agrandir" />
</a>
<div class="highslide-caption">
Tracy Lords<br/>
Techniques mixtes sur bois<br/>
20x30 cm 2009
</div>
<a href="images/CHRISTY_CANYON.jpg" class="highslide, idoles" onclick="return hs.expand(this)">
<img src="images/CHRISTY_CANYON_MINI.jpg"
alt="Cliquez pour agrandir" />
</a>
<div class="highslide-caption">
Christy Canyon<br/>
Techniques mixtes sur bois<br/>
20x30 cm 2009
</div>
</div>
<script type="text/javascript">
var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www.");
document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E"));
</script>
<script type="text/javascript">
try {
var pageTracker = _gat._getTracker("UA-12625063-1");
pageTracker._trackPageview();
} catch(err) {}</script>
</body>
</html> |
Par logique, j'ai pensé que cela venait de leur poids, et après bien des allègement, des pertes de qualité, cela ne change pas beaucoup, alors que bien d'autre sites web utilise highslide, ou d'autre image viewer avec des images 10 fois plus lourde, et leurs chargements est quasi-instantané.
Je pense donc que cela est du au redimensionnement automatique de l'image, mais je ne peut pas me permettre d'enlever cette option : c'est bien trop utile, et tout les sites que j'ai visité ont cette option sans pour autant perdre en fluidité.
Je demande donc de l'aide pour savoir s'il n'y aurais pas un moyen d'accélérer le processus de "zoom", si j'ai fais une erreur (bien possible), ou si cela viens d'autre chose (hébergeur, incompatibilité des navigateurs...)
Si cela vient de highslide, et qu'il n'y a pas de solution, auriez-vous un autre image viewer plus léger, plus rapide, à me conseiller ?
Merci d'avance.
