[Résolu] problème affichage images sur FF3.01

fablang · Message par **fablang** » 29 août 2008, 20:54

Bonjour,
Ma société vient de terminer le développement d’un gros projet de site WEB (8 mois de développement). Je termine l’audit de sécurité du projet avant d’en donner l’accès aux internautes.
Ce projet a été développé très sérieusement : XHTML strict, codage utf8. Le codage est sémantique. Le contenu est dissocié de la mise en forme ainsi que du comportement.
Il a donc été simple de rendre ce projet compatible sur les navigateurs les plus classiques : IE7, FF2, Opera et Safari.
Ce projet a été développé avec l’aide de FF2 car il présente un bon comportement et il dispose d’outils de développement utiles.
Je précise aussi que chaque page est validée par le W3C (0 bug dans le code HTML renvoyé sur le client).
Tout ce travail en fait un outil de communication très performant (notamment le temps de réponse très faible pour l’affichage des pages sur le client).
Je suis en train de tester le comportement du projet avec FF3.01 :
Le test est réalisé sur 3 OS : XP, VISTA et MAC.
Le résultat est le même sur tous les OS : très mauvais. Tous les essais n’y changent rien (toutes les recommandations de Mozilla, mode sans échec, javascripts désactivés, etc.).
Le problème semble lié à la balise <img>. Certaines images ne s’affichent pas après un temps de chargement qui peut aller jusqu’à 50 secondes (une éternité pour l’affichage d’une page).
J’avoue ne pas comprendre, ce système est très performant sur le client FF2.0.16. La seule action que je peux mener est de signaler ce comportement auprès de Mozilla lors de la mise en ligne du projet.
Jusqu’à preuve du contraire, ce bug provient de FF3.01 ce qui ne m'avance guère. Un bug aussi important rend la navigation impossible, ce qui nuit considérablement à la réputation de ce projet et donc à son référencement. La réputation de mon entreprise est aussi mise à l’épreuve fasse à une telle situation.
Bien que le cahier des charges stipule une compatibilité avec le navigateur FF2.0.7, j’avoue ne pas me sentir très à l’aise face à mon client pour lui expliquer la situation.
Si quelqu'un possède des informations sur ce sujet, j'aimerais bien les connaître.
Merci

Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 6.0; fr; rv:1.8.1.16) Gecko/20080702 Firefox/2.0.0.16

Message par **nico@nc** » 29 août 2008, 22:58

Bonjour,

Ça va être dur de savoir sans un petit exemple, mais je suppose que ce n'est pas possible.

Tu es au moins bien sûr que ça vient de Firefox et pas de la sa configuration (extensions notamment) ? Tu as par exemple essayé sur un profil neuf : http://www.geckozone.org/forum/viewtopi ... 299#444299 ?

fablang · Message par **fablang** » 30 août 2008, 01:09

oui, tous ces tests qui proviennent de www.mozilla-europe.org sont déjà testés.
Le problème persiste en supprimant tous les js et tous les css de la page ainsi que la plus grande partie du contenu même de la page.
Seul reste le listing de 10 items d'un catalogue avec une photo/item. Le problème persiste et sans aucun bug ds le code source.

Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 6.0; fr; rv:1.8.1.16) Gecko/20080702 Firefox/2.0.0.16

Message par **jpj** » 30 août 2008, 01:45

Bonsoir,

fablang a écrit :... Seul reste le listing de 10 items d'un catalogue avec une photo/item. Le problème persiste et sans aucun bug ds le code source.

Ne serait-il pas possible d'avoir une adresse d'une page en ligne "bidon" (texte et les photos sans rapport avec le site du client). La validation W3C n'est pas toujours fiable à 100% pour le rendu final.

fablang · Message par **fablang** » 30 août 2008, 12:51

je ne peux pas présenter d'extrait en ligne.

J'ai fait un test en ramenant une page à sa plus simple expression et le problème persiste (uniquement sur FF3.01). le temps de chargement de la page dure environ une minute et 1, 2, ou 3 images ne s'affichent pas. Elles sont remplacées par le texte de l'attribut 'alt' (ici c'est testff3) de la balise 'img'. Plusieurs essais (ctrl F5) montrent que "la ou les'images deffectueuses" sont aléatoires.
les dimentions d'une image sont les suivantes : 118x130 px. Toutes les URL des images existent (puisqu'elles sont visible dans FF2.0.0.16)

Je présente ci-dessous le code source de cette page. Vous pouvez constater qu'elle est ramenée à sa plus simple expression. Pas ce css, pas de js. Je précise que dans cet extrait le nom de domaine a été remplacé par le domaine "somedomain" afin de préserver la confidentialité de ce projet.
Si il y a une erreur, alors je suis passé à coté.

code :

<!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" lang="fr">
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta content="fr" http-equiv="Content-Language" />
</head>
<body>
<div>
<a href="http://www.somedomain.com/index.php?uni ... IdPack=270">
<img src="./tmp/imageSize/catalog/img0.jpg" alt="testff3" />
</a></div>

<div>
<a href="http://www.somedomain.com/index.php?uni ... IdPack=212">
<img src="./tmp/imageSize/catalog/img1.jpg" alt="testff3" />
</a></div>

<div>
<a href="http://www.somedomain.com/index.php?uni ... IdPack=236">
<img src="./tmp/imageSize/catalog/img2.jpg" alt="testff3" />
</a></div>

<div>
<a href="http://www.somedomain.com/index.php?uni ... IdPack=213">
<img src="./tmp/imageSize/catalog/img3.jpg" alt="testff3" />
</a></div>

<div>
<a href="http://www.somedomain.com/index.php?uni ... IdPack=237">
<img src="./tmp/imageSize/catalog/img4.jpg" alt="testff3" />
</a></div>
</body>
</html>

Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 6.0; fr; rv:1.8.1.16) Gecko/20080702 Firefox/2.0.0.16

fablang · Message par **fablang** » 30 août 2008, 13:07

le problème persiste avec le code de la page encore simplifiée :

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr">
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta content="fr" http-equiv="Content-Language" />
</head>
<body>
<div>
<img src="./tmp/imageSize/catalog/img0.jpg" alt="testff3" />
</div>
<div>
<img src="./tmp/imageSize/catalog/img1.jpg" alt="testff3" />
</div><div>
<img src="./tmp/imageSize/catalog/img2.jpg" alt="testff3" />
</div><div>
<img src="./tmp/imageSize/catalog/img3.jpg" alt="testff3" />
</div><div>
<img src="./tmp/imageSize/catalog/img4.jpg" alt="testff3" />
</div>
</body>
</html>

Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 6.0; fr; rv:1.8.1.16) Gecko/20080702 Firefox/2.0.0.16

fablang · Message par **fablang** » 30 août 2008, 13:40

le problème disparait si le supprime les containers <div> :

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr">
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta content="fr" http-equiv="Content-Language" />
</head>
<body>
<img src="./tmp/imageSize/catalog/img0.jpg" alt="testff3" />
<img src="./tmp/imageSize/catalog/img1.jpg" alt="testff3" />
<img src="./tmp/imageSize/catalog/img2.jpg" alt="testff3" />
<img src="./tmp/imageSize/catalog/img3.jpg" alt="testff3" />
<img src="./tmp/imageSize/catalog/img4.jpg" alt="testff3" />
</body>
</html>

Y aurait-il un bug avec la balise <div> ?

Coté serveur, il n'y a rien dans les logs

Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 6.0; fr; rv:1.8.1.16) Gecko/20080702 Firefox/2.0.0.16

fablang · Message par **fablang** » 30 août 2008, 13:47

l'erreur persiste avec le code source suivant (mais elle est moins fréquente). La balise <div> n'y ait pour rien...

<!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" lang="fr">
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta content="fr" http-equiv="Content-Language" />
</head>
<body>
<img src="./tmp/imageSize/catalog/img0.jpg" alt="testff3" />
<img src="./tmp/imageSize/catalog/img1.jpg" alt="testff3" />
<img src="./tmp/imageSize/catalog/img2.jpg" alt="testff3" />
<img src="./tmp/imageSize/catalog/img3.jpg" alt="testff3" />

<img src="./tmp/imageSize/catalog/img4.jpg" alt="testff3" />
</body>
</html>

je ne comprends pas

Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 6.0; fr; rv:1.8.1.16) Gecko/20080702 Firefox/2.0.0.16

fablang · Message par **fablang** » 30 août 2008, 14:23

Je constate le même problème à l'URL suivante :

http://spirale.aneantis.com/message-Bas ... 37868.html

en faisant ctrl F5, une image est remplacée par le contenu de l'attribut "alt" (Cliquez pour agrandir)

une autre personne a constaté ce problème. la discussion de ce sujet se trouve ici :
http://spirale.aneantis.com/message--la ... 38445.html

Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 6.0; fr; rv:1.8.1.16) Gecko/20080702 Firefox/2.0.0.16

Message par **jpj** » 30 août 2008, 17:39

Bonjour,

Il y a deux problèmes différents. Dans la discusssion que tu cites, c'est un problème de défilement de la page (scrolling) et il y a effectivement plusieurs bugs dans Firefox 3.0.x (voir par exemple cette discussion). À noter que sur la page spirale.aneantis.com, avec ma vieille carte nvidia, le défilement est normal.

Pour la page http://spirale.aneantis.com/message-Bas ... 37868.html, je vois en effet apparaître furtivement le Cliquez pour agrandir avant l'affichage des images (Athlon 64 3200+, GeForce FX 5600 XT, Win XP SP2, Firefox 3.0.1, modem-router ethernet, ADSL environ 6Mb). Je suppose que c'est en partie dû à la taille des images. Elles ne sont pas affichées à leur taille réelle mais elles sont redimensionnées. La page est plus lourde et donc plus lente à se charger que si les images étaient à la bonne taille et, de plus, le navigateur et l'UC sont plus sollicités par ce redimensionnement.

Je déplace dans la section Développement web car ce n'est pas ici, dans la section Firefox, que l'on pourra résoudre le problème.

fablang · Message par **fablang** » 30 août 2008, 19:19

Il n'y a pour moi que le problème de l'affichage que j'ai évoqué. Je ne parle pas du scrolling.

Je confirme que sur le site que j'ai cité précédemment, il arrive qu'une image soit remplacée par le contenu de l'attribut alt et c'est tout. Je répète que mon projet présente le même problème.

Je constate simplement que FF3.01 est incapable d'afficher correctement une suite de 5 images.

Quand a déplacer ce sujet ds la partie développement WEB, tu fais ce que tu veux.

C'est à mon sens un pb de navigateur et non de dev.

Ce problème que je constate depuis une semaine n'a rien avoir avec du développement. FF3.01 est simplement actuellement incapable d'afficher correctement une suite de 5 images. Et tu n'as pas la réponse à ce problème. Ton renvoies vers le sujet sur le scrolling est hors sujet.

Pourquoi la version 2.0.0.16 fonctionne très bien ?
Pourquoi même IE7 et sa léthargie fonctionne aussi ?
Pourquoi Opera et Safari fonctionnent-ils aussi ?

Tu es incapable de répondre à ces questions.

C'est bien beau de modéré et déplacer le sujet, mais tu ne réponds pas à ma question.

Je me casse

Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 6.0; fr; rv:1.8.1.16) Gecko/20080702 Firefox/2.0.0.16

calimo · Message par **calimo** » 30 août 2008, 19:44

Sur la page http://spirale.aneantis.com/message-Bas ... 37868.html les 13 images "Bastard Magazine" s'affichent en un temps raisonnable.

Je pense que tu as un souci avec ton Firefox (pare-feu, filtre adblock)

Message envoyé avec : Mozilla/5.0 (X11; U; Linux i686; fr; rv:1.9.0.1) Gecko/2008072820 Firefox/3.0.1

Fabrice.Tres.Net · Message par **Fabrice.Tres.Net** » 30 août 2008, 20:16

fablang a écrit : Tu es incapable de répondre à ces questions.

C'est bien beau de modéré et déplacer le sujet, mais tu ne réponds pas à ma question.

Je me casse

Boouuuuuuh ! le vilain.

Il faudrait adopter une attitude un peu + pro, non ?

Par exemple, en reproduisant ton cas sur un cas d'école qui pourra servir à documenter un rapport de bug.

A mon avis, il est fort possible que ton problème soit lié à une combinaison défaillante ( matos, OS, driver, et FF).

Je viens de tester avec Linux et Windows XP sur la page de spirale et je n'ai aucun problème avec FF 3.0 .

Message par **jpj** » 30 août 2008, 22:24

Il n'y avait pas de hors-sujet de ma part :

jpj a écrit :Il y a deux problèmes différents. Dans la discussion que tu cites, c'est un problème de défilement de la page (scrolling)
car, premier problème :
- katie [url=http://spirale.aneantis.com/message--lastpage-238445.html]ici[/url] a écrit :Les GRANDES images pas forcément lourdes, sont lentes à s'afficher chez moi.
  par expérience au-delà de 500px de large. y a pas vraiment de règle.
  C'est aussi le cas avec une multitude d'images de dimensions moyennes dans une page.
  
  J'ai fait l'essai d'afficher la même page dans les principaux navigateurs: IE 6, FF et Safari 3.1.
  J'ai choisi la page de Ka.brouk
  Aucun problème avec IE et safari, c'est fluide.
  Avec FF 3 (firefox 3.01) le défilement de la page est haché, alors que les images sont en cache.
  Et avec 2 Go de RAM, ça devrait être confortable normalement.

Le second problème (le tien en fait) :

jpj a écrit :Pour la page http://spirale.aneantis.com/message-Bas ... 37868.html, je vois en effet apparaître furtivement le "Cliquez pour agrandir" avant l'affichage des images (Athlon 64 3200+, GeForce FX 5600 XT, Win XP SP2, Firefox 3.0.1, modem-router ethernet, ADSL environ 6Mb). Je suppose que c'est en partie dû à la taille des images. Elles ne sont pas affichées à leur taille réelle mais elles sont redimensionnées.

J'ai exactement le même comportement avec Opera 9.5 sur cette page. Avec Firefox 2, Safari 3.1.2 et IE7, pas d'affichage de la balise alt mais le chargement est désespérément lent. Ce qui, je suppose, est dû au fait que les images sont redimensionnées au lieu d'avoir été mise à la bonne taille d'affichage. Donc, vu le comportement des différents navigateurs sur la page http://spirale.aneantis.com/message-Bas ... 37868.html, Firefox 3.0.1 n'a pas de problème particulier pour moi (juste un webmestre qui ne veux pas se fatiguer à créer des vignettes à la bonne taille afin d'alléger ses pages).

fablang a écrit :Tu es incapable de répondre à ces questions.

Absolument. Encore une fois, je rappelle qu'il n'y a pas de développeurs Mozilla ici. Geckozone n'est en rien un site de la Fondation Mozilla mais "un forum d'entraide pour les logiciels de la grande famille Mozilla : Firefox, Thunderbird, NVU, Seamonkey, etc." Entraide essentiellement tournée vers les utilisateurs.
Si tu considères qu'il s'agit d'un bug de Firefox, c'est sur bugzilla ou hendrix qu'il faut poster pour avoir une chance de toucher les développeurs de Firefox. Encore faudrait-il que le bug soit avéré et reproductible, ce qui n'est absolument pas le cas avec le site donné en exemple. Il est possible que le code de ton site fasse effectivement apparaître un vrai bug mais sans avoir le code et sans pouvoir vérifier, on ne pourra pas le savoir.

fablang a écrit :C'est bien beau de modéré et déplacer le sujet, mais tu ne réponds pas à ma question.

La raison est simple.
Si j'ai déplacer ce sujet, c'était en espérant que des développeurs (de sites web, pas de Firefox) puissent te donner des pistes pour trouver une solution quand bien même Firefox3 et Gecko 1.9 serait en cause (ce que nous ne pourrions vérifier que si nous avions une page d'exemple).

fablang · Message par **fablang** » 31 août 2008, 10:40

Bonjour,

je vous demande de bien vouloir m'excuser de mon comportement agressif, ça ne se reproduira plus. Ce problème m'a rendu très à cran.

Effectivement, l'URL que j'ai citée en exemple illustre un autre problème. Ce problème n'est d'ailleurs pas le miens.

Le miens est toujours le même et c'est incompréhensible :

Il apparaît lorsque je parcours les pages d'un catalogue (un basique site marchand pour simplifier). Il y a 10 items/page. Chaque item contient :
1 titre.
1 début de texte.
1 image.

Chaque image a une dimension de 118x130 px. Le poids d'une image est de 4 Ko.

Chaque image qui appartient à un item est tirée au sort dans un ensemble. Autrement dit, ce n'est jamais la même qui apparaît.

Quel est le problème :

Il y a toujours un item parmi les 10 pour lequel l'image ne s'affiche pas et elle remplacée par le contenu de l'attribut "alt".

Qu'est-ce que j'ai fait :

Afin de déterminer l'origine du problème, j'ai ramené la page à sa plus simple expression i.e. une page html, qui contient uniquement 10 images, pas de css, pas de js, rien. Le code source de cette page est présenté plus haut. Si vous le parcourez, vous constaterez qu'il n'y a rien dedans. Et le problème persiste.

Voilà où j'en suis. Il se trouve que ce problème apparaît uniquement sur FF3.0.1.

J'ai fait le test cette nuit sur les versions beta de FF3.1 et FF3.2 et le problème est toujours là.

Pour les autres navigateurs (FF2, IE7, safari et opera) tout fonctionne parfaitement.

Que puis-je faire de plus...je ne sais pas.

Coté serveur (dédié). Rien dans les logs.

Maintenant si quelqu'un a une idée...Je veux bien prendre le risque de montrer ce problème à quelqu'un à condition qu'il me donne son adresse ip
afin que je puisse lui donner accès au serveur.

En tous cas, merci de votre attention.

Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 6.0; fr; rv:1.8.1.16) Gecko/20080702 Firefox/2.0.0.16

Geckozone

[Résolu] problème affichage images sur FF3.01

[Résolu] problème affichage images sur FF3.01

code source

code source

codage simplifié

correction

problème constaté sur un autre site

Qui est en ligne ?