Discussion :

[Esther Brulard]

Bonjour,
On se casse le c* à fournir dans un srcset des images deux fois plus grandes adaptées au retina, donc plus lourdes, sur des devices mobiles donc le débit/bande passante est peut être pas ouf. A moins que le navigateur sache reconnaitre ce genre de connexion et repasse sur des images 1x, ça risque de ramer pas mal quand même non? Je cherche des solutions à ce problème au niveau html, ou sinon compression d'image pour réduction de poids, sans que ça fasse cracra affiché en HiDPI, tout en optimisant la vitesse de chargement. Comment faites vous, vous?

[NoSmoking]

Bonjour,

... des images deux fois plus grandes adaptées au retina, donc plus lourdes, ...

ceci devrait te permettre de répondre à ton questionnement :

• Les fondamentaux du Responsive Web Design, voir paragraphe mages compressées ;
• Apprendre à optimiser vos images pour le responsive et les écrans Retina.

[Esther Brulard]

Oui j'vais déjà lu le deuxième, quant au premier qui parle du responsive, pour ma part j'utilise bootstrap.
Quand j'ai posté mon message, il me manquait une clé de connaissance que j'ai trouvées dans diverses lectures depuis : les balises srcset permettent au navigateur non seulement de choisir une image en fonction de la définition, de la résolution de l'écran de l'utilisateur, mais aussi et c'est ça que je ne savais pas, de sa vitesse de chargement. Si je devais donc reformuler maintenant ma question, j'éditerai mon post initial pour ne laisser apparaitre qu'un seul problème : celui du rendu image sur un écran HiDPI alors que la bande passante est mauvaise. En effet dans ce cas là, le navigateur doit logiquement laisser tomber le choix de l'image "2x" et revenir sur l'image "1x" pour l'afficher sur cette résolution supérieure donc. Le rendu sera ainsi dégradé, de net qu'il aurait pu être autrement.