Comment configurer les réglages des médias : taille d'image petite, moyenne et grande, taille du canevas, images nettes, vitesse de page et liste de contrôle dans un panneau e-commerce

Vous avez passé des heures à photographier le produit en studio et vous l'avez importé dans le panneau, mais en vitrine il paraît flou, dans le panier il est énorme, ou sur la fiche produit il semble recadré. Quelle que soit la qualité du produit, c'est l'image qui crée la première impression ; le client ne fait pas confiance à une photo floue et n'attend pas non plus une page qui charge lentement. Le plus souvent, le problème ne vient pas de la photo elle-même, mais des paramètres qui déterminent la taille et la qualité avec lesquelles elle est affichée sur le site.

Dans ce guide, nous abordons les paramètres médias sur l'écran réel du panneau Faprika : à quoi servent les tailles d'image petite, moyenne et grande, ce que déterminent la largeur et la hauteur du canevas, que saisir dans le champ CDN et pourquoi une modification ne s'applique qu'aux nouveaux produits. Au-delà du panneau, nous proposons aussi un regard pratique : un petit outil qui calcule le nombre de pixels nécessaires pour qu'une image remplisse son cadre, et une liste de contrôle en huit points. La préparation, le redimensionnement et le nommage de la photo elle-même sont traités dans d'autres articles : optimisation des images produit et import en masse des images produit. Ici, nous nous concentrons uniquement sur la bonne configuration des paramètres médias dans le panneau.

Que sont les paramètres des médias ?

Les paramètres médias déterminent les dimensions en pixels et la qualité avec lesquelles les images importées dans le panneau sont stockées et affichées sur le site. C'est dans cette zone que vous gérez les dimensions et la résolution du canevas sur lequel reposent les images, c'est-à-dire leurs proportions en pixels.

Dans Faprika, ces paramètres se trouvent dans le panneau de contrôle, sous Configuration > Paramètres > Paramètres médias. L'écran comprend trois tailles d'image (petite, moyenne, grande), deux dimensions de canevas (largeur et hauteur) et un champ CDN. Ces six champs sont les réglages de base qui déterminent la manière dont votre site affiche les images produit.

Nous vous recommandons de lireFormation à la gestion des paramètres médias

À quoi servent les paramètres des médias ?

Les paramètres médias servent à afficher chaque image à une taille adaptée à son emplacement. Lorsque vous importez une image dans le panneau, le système la convertit et l'enregistre en trois tailles et qualités différentes ; ces paramètres déterminent le nombre de pixels de chaque taille.

Concrètement, la même photo apparaît à trois endroits de votre site, à trois tailles différentes : dans le petit aperçu du panier, dans la grille de produits de la page catégorie et sur la fiche produit. Utiliser le même fichier pour les trois sacrifie soit la vitesse, soit la netteté. Afficher un gros fichier dans un petit cadre alourdit inutilement la page ; afficher un petit fichier dans un grand cadre crée du flou. Trois tailles distinctes résolvent ce dilemme.

Ce paramètre est surtout utile lorsque votre photo d'origine est en haute résolution mais paraît de faible qualité dans le panneau. Dans ce cas, inutile de la reprendre en photo ; il suffit le plus souvent d'augmenter la valeur en pixels de la taille concernée.

Pourquoi les paramètres médias sont-ils importants ?

Les paramètres médias sont importants, car l'image produit est l'élément central du moment de décision en e-commerce, et une image à la fois nette et rapide à charger influence directement les ventes. Le client ne peut pas toucher le produit ; il le regarde. Le confort de ce regard dépend de la netteté de l'image et de la rapidité avec laquelle elle s'affiche.

Trois raisons se démarquent :

• Confiance. Une photo floue ou pixellisée fait douter de la qualité du produit et de la boutique.
• Rapidité. Chaque image alourdit la page ; des fichiers plus gros que nécessaire ralentissent son ouverture. Pour le lien entre vitesse et ventes, consultez l'article pourquoi la vitesse du site est importante en e-commerce.
• Cohérence. Lorsque les produits apparaissent dans le même cadre et à la même taille sur la page catégorie, la boutique paraît soignée ; la taille du canevas le garantit.

Le sujet prend encore plus d'importance pour les boutiques à fort trafic mobile, car l'écran d'un téléphone est petit et la connexion souvent plus faible que sur ordinateur. Pour le comportement général sur téléphone, l'article e-ticaret sitesinde mobil uyumun önemi est un bon complément.

Comment configurer les paramètres médias dans Faprika ?

Dans Faprika, les paramètres médias se configurent dans le panneau de contrôle, sous Configuration > Paramètres > Paramètres médias. L'écran comprend trois tailles d'image, la largeur du canevas, la hauteur du canevas et un champ CDN ; vous ajustez chacun selon vos besoins puis vous enregistrez.

Suivez cet ordre pour avancer pas à pas :

1. Dans le panneau de contrôle, ouvrez l'écran Configuration > Paramètres > Paramètres médias.
2. Repérez quelle image paraît floue ou plus grande que nécessaire sur quel écran, puis trouvez le champ de taille correspondant.
3. Ajustez la valeur en pixels de ce champ selon vos besoins.
4. Vérifiez que la taille du canevas correspond aux proportions de vos produits.
5. Si vous utilisez un CDN, saisissez son adresse dans le champ CDN.
6. Enregistrez, puis importez un nouveau produit et testez le résultat sur les trois écrans.

La sixième étape est essentielle : les paramètres ne s'appliquent qu'aux produits ajoutés à partir de ce moment ; il faut donc ajouter un nouveau produit pour en voir l'effet. Nous revenons sur ce point dans une section dédiée.

Taille de la petite image

La petite taille d'image détermine les images affichées dans l'aperçu du panier et sur les écrans de finalisation de commande. Sur ces écrans, le produit apparaît dans un petit cadre à titre d'identification ; le client n'examine pas le produit avec cette photo, il vérifie simplement qu'il voit le bon produit dans son panier.

Il est donc inutile de la garder plus grande que nécessaire. Mais la réduire à l'excès n'est pas non plus judicieux : sur les téléphones et les écrans haute densité, une image minuscule paraît molle et délavée une fois étirée dans le cadre. La bonne valeur correspond à un multiple de la taille réelle du cadre dans le panier ; l'outil ci-dessous vous aide à la calculer.

Taille de l’image moyenne

La taille d'image moyenne détermine les images de la vitrine et des pages de liste de catégories. C'est l'un des endroits où le client passe le plus de temps : il parcourt les produits et décide le plus souvent sur quoi cliquer en regardant l'image.

Sur une page catégorie, des dizaines d'images se chargent en même temps. La taille moyenne doit donc être à la fois nette et mesurée : si la netteté est insuffisante, la boutique paraît négligée ; si la taille est inutilement élevée, la page s'alourdit. Lorsque vous voulez améliorer la qualité des images, c'est souvent le premier champ à examiner.

Taille de la grande image

La grande taille d'image détermine la qualité de l'image sur la fiche produit. C'est là que le client observe le produit de plus près : il examine la matière, les détails, la couleur, et peut-être zoome. La décision d'achat repose souvent sur le pouvoir de persuasion de cette image.

Sur la fiche produit, seules quelques images d'un même produit sont chargées, et non des dizaines comme sur la page catégorie. On peut donc se montrer plus généreux avec la grande taille. Il existe pourtant une limite haute : un fichier énorme qui ne tient pas à l'écran n'apporte aucune netteté supplémentaire et ne fait qu'allonger le temps de chargement.

Que sont la largeur et la hauteur du canevas ?

La largeur et la hauteur du canevas sont les dimensions du cadre dans lequel figurent les produits. Indépendamment de l'image elle-même, ces deux champs définissent la largeur et la hauteur de la zone où le produit sera placé.

Imaginez le canevas comme un cadre photo : quelle que soit la photo, la taille du cadre est fixe. Lorsque tous les produits d'une page catégorie figurent dans un cadre de même taille, la grille paraît ordonnée ; si les cadres différaient, les lignes se disloqueraient. La taille du canevas est donc un élément discret mais puissant de l'ordre visuel de la boutique.

Pour choisir la taille du canevas, soyez attentif à deux points. Premièrement, le ratio de vos photos produit : si vous photographiez surtout en portrait, un cadre horizontal laisse beaucoup de vide, et l'inverse comprime le produit. Deuxièmement, l'utilisation du même ratio de prise de vue pour tous les produits : des photos aux ratios mélangés créent trop de vide sur certains produits, quel que soit le canevas. Le flux de travail décrit dans le guide import en masse des images produit aide à garder cette cohérence dès la prise de vue.

À quoi sert le champ CDN ?

Le champ CDN (réseau de diffusion de contenu) sert à saisir l'adresse d'un service CDN, si vous en utilisez un, afin que les images se chargent plus vite. Un réseau de diffusion de contenu vise à raccourcir le temps de chargement en livrant les fichiers depuis des serveurs plus proches du visiteur.

Ce champ est facultatif. Si vous n'utilisez pas de CDN, laissez-le vide. Si vous en utilisez un, il est indispensable de saisir correctement l'adresse : une adresse erronée peut empêcher totalement le chargement des images. Après avoir ajouté l'adresse du CDN, ouvrez donc immédiatement votre site et vérifiez que les images s'affichent. L'article sur la vitesse du site constitue un point de départ pour comprendre la logique générale d'un CDN et les autres mesures de rapidité.

À lire aussiPourquoi la vitesse du site est-elle importante en e-commerce ?

Pourquoi une modification des paramètres ne s'applique-t-elle qu'aux nouveaux produits ?

Les modifications des paramètres de canevas et de taille ne s'appliquent qu'aux produits ajoutés ensuite, car une image est convertie et enregistrée aux tailles concernées au moment où elle est importée dans le panneau. Les images des produits déjà présents dans le panneau ont été générées avec les anciens paramètres et ne sont pas touchées par ce changement.

L'avertissement clair de la formation est le suivant : si vous souhaitez modifier les dimensions des produits existants, vous devez supprimer les produits et les importer à nouveau. En pratique, cela a deux conséquences :

• Configurez-le avant d'importer les produits. Si vous montez une nouvelle boutique ou lancez un import de produits en masse, réglez d'abord les paramètres médias. Corriger plus tard signifie réimporter tous les produits déjà importés.
• Pour les produits existants, essayez d'abord avec un seul produit. Ne supprimez pas et ne réimportez pas des centaines de produits sans être certain que la nouvelle valeur fonctionne. Réimportez d'abord un produit, observez le résultat sur trois écrans, puis prenez votre décision.

Supprimer puis réimporter peut affecter d'autres informations liées au produit ; planifiez donc l'opération. Déterminez à l'avance comment seront conservés les informations produit, le code de stock et l'ordre des images. Pour la méthode sûre de traitement en masse, vous pouvez suivre les étapes de l'article import en masse des images produit.

Nous vous recommandons de lireComment optimiser les images produits ?

De combien de pixels une image a-t-elle besoin pour remplir son cadre ?

La largeur dont une image a besoin pour paraître nette est le produit de la largeur du cadre à l'écran par la densité de pixels de l'écran. Sur un écran haute densité, un pixel est dessiné avec plusieurs points physiques ; un cadre qui apparaît large de 300 pixels exige donc une image de 600 pixels.

Connaître ce calcul est le moyen le plus sûr de choisir la valeur à saisir dans les paramètres médias. L'outil ci-dessous prend trois valeurs : la largeur du cadre à l'écran, le facteur de densité de l'écran cible et la largeur de l'image que vous avez réglée dans le panneau ou importée. Il vous indique en retour la largeur requise et si l'image est suffisante.

Gardez trois points à l'esprit en utilisant l'outil. Premièrement, le calcul repose sur la largeur du cadre à l'écran ; les largeurs diffèrent dans le panier, sur la page catégorie et sur la fiche produit, saisissez donc une valeur distincte pour chacun. Deuxièmement, lorsque l'image atteint plusieurs fois la largeur requise, la netteté n'augmente pas, seul le fichier grossit. Troisièmement, la taille du cadre peut différer sur l'écran le plus large et sur téléphone ; vérifiez les deux et décidez d'après la plus grande.

Les erreurs les plus fréquentes dans les paramètres médias

Les erreurs les plus fréquentes dans les paramètres médias consistent à laisser des tailles plus grandes ou plus petites que nécessaire, à configurer le paramètre après l'import des produits et à tester la modification sur un seul écran. La plupart ne viennent pas de l'écran de paramétrage, mais du fait de ne pas regarder le résultat du réglage côté client.

Tout régler sur la valeur maximale

Garder les trois tailles élevées « au cas où » paraît tentant. Mais afficher une image haute résolution dans le petit cadre du panier ne fait que ralentir la page. Réglez chaque taille en fonction du cadre où elle est utilisée.

Oublier la petite image

C'est une erreur courante de s'occuper des images de vitrine et de fiche produit et d'oublier la petite image du panier et de l'écran de commande. Le client regarde cette petite image au moment le plus proche du paiement ; si elle paraît floue, la confiance est entamée précisément à cet instant.

Modifier le paramètre après l'import des produits

Comme le paramètre ne s'applique qu'aux nouveaux produits, modifier une valeur après l'import de milliers de produits ne corrige rien ; les produits existants restent tels quels. Les paramètres médias font partie de la préparation avant l'import des produits.

Ne pas adapter le ratio du canevas à celui des produits

Garder un cadre horizontal alors que les produits sont photographiés en portrait donne des images petites entourées de larges espaces vides. Le ratio de prise de vue et celui du canevas doivent correspondre.

Tester uniquement sur ordinateur

Une image qui paraît nette sur ordinateur peut rester molle sur un téléphone haute densité. Après la modification, regardez impérativement aussi sur téléphone.

Enregistrer l'adresse du CDN sans la vérifier

Une adresse CDN mal saisie peut empêcher l'affichage des images. Après avoir enregistré l'adresse, ouvrez trois écrans et vérifiez que les images s'affichent.

Chercher le problème dans les réglages en négligeant le fichier d'origine

Si la photo d'origine est déjà en basse résolution, aucun réglage ne peut la rendre plus nette. Même en augmentant la taille de la grande image, un petit fichier ne donnera pas une image grande et nette. Assurez-vous d'abord que l'original est assez grand.

Okumanızı öneririzE-Ticaret Sitesinde Mobil Uyumun Önemi

Tableau de dépannage des paramètres médias

La plupart des problèmes liés aux paramètres médias peuvent être rattachés au bon champ en observant le symptôme. Le tableau ci-dessous résume quel réglage vérifier pour chaque symptôme.

Ce qu'il faut retenir du tableau : regardez d'abord sur quel écran le symptôme apparaît. L'écran indique immédiatement quel réglage de taille est en cause.

Liste de contrôle des paramètres médias

La liste de contrôle des paramètres médias rassemble les huit points à passer en revue avant de publier vos réglages, puis à intervalles réguliers. Le visuel et l'outil ci-dessous présentent les mêmes points sous une autre forme ; le tableau donne la même information sous forme de texte.

Quand revoir les paramètres médias ?

Les paramètres médias doivent être revus dès que votre mise en page visuelle ou votre méthode de prise de vue change : lorsque vous appliquez un nouveau design, modifiez le ratio de vos photos produit, passez à des prises de vue en plus haute résolution ou constatez que les images semblent floues ou lentes. Ce n'est pas un réglage à faire une fois pour toutes, mais une configuration qui évolue avec la croissance de la boutique.

Un point ne doit pas être oublié : modifier le réglage ne convertit pas automatiquement les produits existants. Planifiez donc votre décision non seulement en fonction du réglage, mais aussi des produits que cette modification touchera. Préserver l'équilibre entre qualité d'image et rapidité est un gain durable, aussi bien dans les résultats de recherche que pour l'expérience client.

Les autres détails concernant l'image elle-même, à savoir le nom de fichier, le texte alternatif et le choix du format, sont expliqués dans l'article sur l'optimisation des images produit. En appliquant les deux articles ensemble, le réglage du panneau et la préparation de l'image se complètent : l'un détermine les tailles de stockage de l'image, l'autre la qualité de sa préparation.

Les paramètres médias avec Faprika

Dans Faprika, les paramètres médias sont regroupés sur un seul écran : Configuration > Paramètres > Paramètres médias. Vous y gérez les tailles de petite, moyenne et grande image, la largeur et la hauteur du canevas ainsi que le champ CDN. Comme chaque image importée dans le panneau est enregistrée en trois tailles, la même photo s'affiche dans le panier, sur la page catégorie et sur la fiche produit à la taille adaptée à chaque emplacement.

Vous pouvez ainsi améliorer la qualité des images depuis le panneau, sans toucher au code et sans refaire la prise de vue. Pour savoir comment utiliser les paramètres médias dans votre offre et quelles possibilités vous avez avec les autres fonctionnalités, consultez nos offres ou demandez une démo.

Questions fréquentes

Que sont les paramètres des médias ?

Les paramètres des médias sont les réglages qui déterminent à quelles dimensions en pixels les images importées dans le panneau sont enregistrées et affichées sur le site. Dans Faprika, ils comprennent la taille de petite, moyenne et grande image, la largeur du canevas, la hauteur du canevas et le champ CDN.

Où trouver les paramètres des médias dans Faprika ?

On y accède dans le panneau de contrôle par Configuration, Paramètres, Paramètres des médias. Le même écran regroupe les trois tailles d’image, les deux dimensions du canevas et le champ CDN.

À quoi servent les tailles de petite, moyenne et grande image ?

La taille de la petite image détermine les images de l’aperçu du panier et des écrans de finalisation de commande, celle de l’image moyenne détermine l’affichage en vitrine et la liste de catégorie, et celle de la grande image détermine la qualité de l’image sur la page détail produit. Une image importée dans le panneau est enregistrée dans ces trois tailles.

Pourquoi l’image que j’ai importée paraît-elle floue dans le panneau ?

Si l’image originale est en haute résolution mais paraît de mauvaise qualité dans le panneau, la valeur en pixels de la taille d’image concernée est peut-être trop basse. Augmenter la taille correspondante dans les Paramètres des médias résout souvent le problème. Si le fichier original est déjà petit, le réglage seul ne le rendra pas plus net.

J’ai modifié les paramètres des médias mais les anciens produits n’ont pas changé. Pourquoi ?

Les modifications des réglages du canevas et des tailles ne s’appliquent qu’aux produits nouvellement ajoutés ; elles n’affectent pas les tailles des produits existants dans le panneau. Pour modifier des produits existants, il faut les supprimer puis les importer à nouveau. Tester d’abord avec un seul produit est la méthode la plus sûre.

Le champ CDN est-il obligatoire ?

Non. Si vous utilisez un service CDN pour que vos images se chargent plus vite, vous saisissez son adresse dans ce champ ; sinon, il reste vide. Après avoir saisi l’adresse, vérifiez impérativement que les images s’affichent sur le site.

Articles qui peuvent vous intéresser

• Comment optimiser les images de produits ?
• Comment importer des images produit en masse
• Pourquoi la vitesse du site est-elle importante en e-commerce ?
• E-Ticaret Sitesinde Mobil Uyumun Önemi