1ère Etape : Préparation des photos pour les intégrer dans votre boutique d’ecommerce

Nous avons vu dans notre précédent billet : Comment optimiser les photos des fiches produits de votre ecommerce
qu’il était nécessaire de retravailler vos photos pour obtenir un chargement rapide des pages et qu’ainsi la navigation sur votre site soit plus fluide.

En effet même si maintenant la plupart des utilisateurs ont l’ADSL, il est impossible pour un de vos futurs acheteurs d’attendre plusieurs secondes avant l’affichage d’une des pages de votre site et je ne vous parle pas de vos clients n’ayant pas l’ADSL !

Nous allons donc voir comment retravailler vos images pour avoir un chargement de vos pages rapides en utilisant un très bon produit développé par Pierre-Emmanuel Gougelet : Xnview que vous pouvez télécharger ici. Ce produit est gratuit pour une utilisation non commerciale, sinon il vous en coûtera 26€ (à  la date de ce billet).

Après avoir téléchargé et installé le produit, lancez le (je ne m’attarde pas sur l’installation du produit qui ne présente pas de difficultés particulières).

Allez dans le menu Outils -> Conversion multiples :

Xnview conversion multiple

Dans Ajouter ou Ajouter répertoire, vous pouvez ajouter vos fichiers ou votre répertoire de photos à  convertir.

Dans Répertoire indiquez le répertoire de destination de vos photos converties.

Dans Format, sélectionnez : JPG où JPEG / JFIF.

Cliquez sur le bouton Options et choisissez une qualité de 70 (ce qui vous permet d’obtenir un chargement rapide pour une qualité correcte de photo).

Cliquez sur l’onglet Transformations, choisissez Redimensionner dans Images et cliquez sur le bouton Ajouter :

Xnview redimensionner

Indiquez dans Largeur et Hauteur les dimension maximales que vous souhaitez pour votre image en laissant coché : Garder les proportions. Le logiciel va choisir automatiquement la plus petite des 2 dimensions et adapter l’autre en gardant les proportions de l’image.

Ajouter ensuite Modifier les DPI et laisser les valeurs par défauts 72 x 72 qui sont largement suffisantes pour une image sur Internet, mais ce n’est pas indispensable.

Xnview modifier les dpi

Vous n’avez plus ensuite qu’à  cliquer sur Lancer pour récupérer vos images dans votre répertoire de destination.

Remarque pour les utilisateurs de Magento :

Si vous êtes un utilisateur de Magento et que vous souhaitez générez vos 3 photos dans le même dossier et donnez un nom différent à  vos 3 tailles de photographies, je vous conseille d’utiliser l’autre option du menu Outils -> Conversion de Séquence :

Xnview conversion séquence

Qui va vous permettre de faire la même opération que pour la conversion multiple, mais en plus de lui rajouter un nom commun, comme ici global600×600.

Test du gain obtenu :

Pour vous donner une idée du gain que vous pouvez attendre de cette opération, nous allons faire un petit test. Prenons une photo d’un objet avec un appareil photo numérique, nous obtenons la photo ci-dessous :

Lampe a huile

Nous avons une photo de 855 x 2304 pixels et une résolution de 230 dpi, ce qui nous donne un fichier avec une taille de 717 ko.
Après passage dans le système de conversion multiple de Xn-view, nous obtenons une image de 222 x 600 pixels et une résolution de 72 dpi, ce qui nous donne un fichier avec une taille de 14 ko. Je vous ais sélectionné une partie de la photo pour vous montrer que à  l’affichage en grand de la photo vous ne verrez pas ou peux la différence.

Avant :

ecommerce - Lampe a huile avant

Après :

ecommerce - Lampe a huile après

Vous voyez donc mieux le gain que vous pouvez obtenir, si vous effectuer cette opération pour toutes les photos de votre boutique.

Nous verrons dans notre prochain billet comment effectuer cette même opération avec un autre logiciel : The Gimp.

    Articles sur le même sujet :

  1. Optimisation des photos des articles de votre boutique avec Gimp N'hésitez pas à vous inscrire au flux RSS pour ne rater aucun article.Nous avons vu dans notre précédent billet, qu’il était nécessaire de retravailler vos photographies, pour obtenir un chargement rapide des pages de votre site de ecommerce et qu’ainsi...
  2. Comment bien préparer la création de votre boutique en ligne avec Magento ou Prestashop N'hésitez pas à vous inscrire au flux RSS pour ne rater aucun article.Vous souhaitez vous lancer dans le ecommerce et mettre une boutique en ligne, 2 possibilités s’offrent à  vous : Vous avez déjà  un commerce et souhaitez développer votre...
  3. Comment améliorer l’affichage de ses photos dans Magento avec Lightbox N'hésitez pas à vous inscrire au flux RSS pour ne rater aucun article.Lorsque vous concevez votre site de commerce en ligne, l’aspect visuel de votre site est très important. C’est la première impression qui va donner envie ou pas à ...

2 commentaires pourquoi ne pas laisser le vôtre ?

Nous n'apporterons pas de support par commentaire pour un problème technique avec l'un de nos modules. Merci de nous contacter directement avec notre formulaire de contact!

Ecrire un commentaire