FROM CACHE - fr_header

Pb de qualité d'image (bannière home)

niko-iko
Nouveau membre
3 0 0

Bonjour à tou(te)s, 

 

Je ne saisis pas bien un truc...

Je suis sur le thème Dawn et souhaite intégrer une image large en bannière sur la home.

J'utilise la fonction "bannière avec image" intégrée dans Dawn. Rien de sorcier en principe.

 

Sauf que l'image une fois mise en ligne devient "crade".

 

Voici l'image affichée que j'ai uploadée, qualité nickel (2000px de large, 72 dpi, jpg): 

https://cdn.shopify.com/s/files/1/0624/3772/0213/files/ikonik-iles-hyeres-2000.jpg?v=1659976292

 

Et voici son rendu sur la home en bannière, avec une définition bcp moins clean 😞

https://ikonik.design

 

Est-ce qu'il y a une moulinette cachée qui resize les images ou diminue leur poids ou autre ?

 

Merci pour vos lumières ! 😉

 

++

niko

 

5 RÉPONSES 5
Nass
Shopify Staff
Shopify Staff
649 169 62

Bonjour @niko-iko, et bienvenue sur le forum !

 

Je regrette d’apprendre que vous rencontrez des difficultés concernant la résolution de votre image de bannière. 

 

Tout d’abord, afin de mieux comprendre vos besoins, je souhaiterais en savoir plus sur votre situation :

  • Cela s’applique-t-il à cette photo uniquement, ou bien d’autres images sont-elles également impactées ?
  • Est-ce un phénomène que vous aviez déjà pu observer par le passé ? Si non, avez-vous installé une nouvelle application ou fait des changements à votre boutique dernièrement ?
  • Par ailleurs, avez-vous déjà lancé votre boutique ou bien êtes-vous encore en phase de réflexion ?

 

Dans l’attente de votre réponse, sachez que Shopify s’engage à offrir aux personnes visitant votre boutique une expérience de navigation la plus agréable possible, notamment en termes de vitesse de chargement. Pour parvenir à ce résultat, le système procède à une compression des images qui peut, effectivement, dans certains cas, donner lieu à une perte de qualité des images

 

Le format JPEG est particulièrement concerné par ce phénomène, puisque le niveau de qualité d'une image compressée dépendra de plusieurs facteurs, dont la qualité de l'image JPEG à l’origine et la taille de sortie. C’est pourquoi je vous inviterais au maximum à utiliser par exemple le format PNG pour lequel la compression n’a pas d’effets majeurs sur la qualité finale de vos images lorsqu’elles sont affichées sur votre boutique. Vous en saurez plus à ce sujet en consultant cet article de notre Centre d’aide.

 

Sachez également qu’il existe des limites de téléchargement pour les images dans une boutique Shopify, celles-ci étant soumises à des limites en termes de mégapixels et de taille de fichier (en mégaoctets). Les mégapixels sont utilisés pour indiquer combien de pixels composent une image. Les mégaoctets sont utilisés pour indiquer combien d'octets de mémoire ou d'espace disque occupe une image. Ainsi, les images mises en ligne sur Shopify ne peuvent dépasser ni l'une ni l'autre des limites suivantes : 20 mégapixels ou 20 mégaoctets.

 

Si ces options ne correspondent pas à ce que vous recherchez, n'hésitez pas à me donner plus de détails concernant vos besoins. Je serai heureux d'étudier avec vous d’autres solutions !

Nass | Shopify 
 - Ma réponse est-elle utile ? Cliquez sur J'aime pour me le faire savoir! 
 - Votre question a-t-elle été répondue ? Sélectionnez Accepter comme solution
 - Pour en savoir plus, visitez notre Centre d'aide en français ou le Blog Shopify

niko-iko
Nouveau membre
3 0 0

Bonjour @Nass

Merci de votre retour. 😉

 

En réponse à vos questions  :

1. Je n'ai constaté ce souci que sur l'image de bannière + texte (en l'occurence de la home).

2. Je viens de sortir ma boutique sur Shopify donc ce n'est pas lié à un changement d'appli.

3. La boutique est en ligne et opérationnelle.

 

J'ignorais que Shopify appliquait une compression supplémentaire... Ceci expliquerait cela. 😞

 

Par défaut, une photo produits est censée sortir en JPEG. Comme vous le notez d'ailleurs dans votre aide. J'ai testé, à la suite de votre remarque, le format PNG, que je réserve aux graphismes en principe, comme il est de coutume, mais aucun changement sur la qualité de la bannière qui manque toujours de netteté. Ce n'est donc pas lié au seul algorithme de compression des JPEG.

 

L'image JPEG actuellement en ligne fait 2,3 Mo et 2,6 Mpx (2000px x 1333px) donc je suis dans les cordes.

 

Cette histoire est super gênante pour une bannière de une qui doit témoigner de la qualité de mes affiches, dont le rendu graphique se doit d'être nickel...

 

Merci de votre retour. 😉

 

Nass
Shopify Staff
Shopify Staff
649 169 62

Merci pour vos retours, @niko-iko ! Je comprends mieux votre situation. Je vous inviterais à essayer d’utiliser notre outil d'optimisation des images afin de voir si le résultat final correspondrait plus à vos attentes.

 

Afin d’approfondir le sujet de l’optimisation, j’ai également trouvé cet article issu de notre blog anglophone qui pourrait vous intéresser. Vous pourriez également utiliser une application telle que Image Optimizer & SEO Audit.

 

Enfin, si toutes ces options ne résolvent pas le problème, et puisque vous utilisez l’un des thèmes Shopify, je vous inviterais à contacter notre assistance par email afin de leur faire part de votre demande.

 

En tout cas, je tiens à vous féliciter pour la qualité de votre boutique ! Le style épuré correspond bien à vos œuvres et la navigation est très fluide. 

Nass | Shopify 
 - Ma réponse est-elle utile ? Cliquez sur J'aime pour me le faire savoir! 
 - Votre question a-t-elle été répondue ? Sélectionnez Accepter comme solution
 - Pour en savoir plus, visitez notre Centre d'aide en français ou le Blog Shopify

niko-iko
Nouveau membre
3 0 0

Merci pour votre retour @Nass. Pour l'instant rien ne me convient dans tout ça mais je vais continuer à creuser l'affaire. En tout cas merci pour vos compliments à l'égard de ma boutique 😉 🙏

Nass
Shopify Staff
Shopify Staff
649 169 62

Bonjour et merci pour votre retour, @niko-iko ! Avec grand plaisir, n’hésitez pas à revenir vers nous en cas de besoin ou si vous réussissez à trouver une solution qui pourrait aider le reste de la communauté. 

Nass | Shopify 
 - Ma réponse est-elle utile ? Cliquez sur J'aime pour me le faire savoir! 
 - Votre question a-t-elle été répondue ? Sélectionnez Accepter comme solution
 - Pour en savoir plus, visitez notre Centre d'aide en français ou le Blog Shopify