Note utilisateur: 5 / 5

Etoiles activesEtoiles activesEtoiles activesEtoiles activesEtoiles actives
 

 

 

Pour un JPEG non progressif, l'image n'est affichée dans le navigateur que lorsqu'elle est totalement téléchargée.

La particularité d'une image JPEG progressive, est que l'image est immédiatement affichée dans le navigateur : l'image s'affiche tout d'abord en faible résolution, puis s'affine peu à peu.

Dans ce tutoriel, je vais vous montrer comment rendre vos JPEG progressif, très facilement, à l'aide d'une commande MS-DOS

 

Comprendre la différence

Voici par exemple, une photo, volontairement volumineuse (1.54 mo), au format JPEG non progressif : lien (dans un nouvel onglet)

Voyez maintenant la même photo, sans aucune perte de qualité, mais cette fois-ci au format JPEG progressif : lien (dans un nouvel onglet)

Vous remarquez la différence ?

Si vous n'avez pas eu le temps de bien la constater, appuyez sur la touche Ctrl+F5 afin de recharger la page en vidant le cache de votre navigateur et diminuez le zoom (Ctrl+roulette souris) pour voir l'image dans son ensemble

 

 

Avec un JPEG progressif, le navigateur peut très rapidement calculer et afficher la page, et ce sans aucune manipulation de code HTML ou javascript.

Un JPEG pogressif est également un peu plus léger qu'un JPEG qui ne l'est pas : toujours pour ma photo d'exemple, et à qualité rigoureusement identique :

  • Non progressif : 1 622 016 octets
  • Progressif : 1 549 503 octets

 

 

 

Télécharger ImageMagick

ImageMagick est un formidable outil en ligne de commande qui permet de traiter les images.

Il dispose de beaucoup de fonctions, que nous verrons ensemble dans des tutoriels futurs, et nous allons aujourd'hui nous concentrer sur sa capacité à rendre les JPEG progressifs.

Rendez-vous sur le site officiel

 

 

Téléchargez la version d'ImageMagick adapté à votre système d'exploitation

 

 

Une fois téléchargé, lancez l'installation

 

 

Cliquez sur "Exécuter"

 

 

Next...

 

 

Acceptez les termes de la licence d'utilisation, puis Next

 

 

Encore Next

 

 

Modifier le chemin d'installation si vous le souhaitez, puis.... Next :)

 

 

Toujours Next

 

 

Veillez à ce que l'option "Add application directory to your system path" soit bien cochée, les autres sont options sont facultatives, puis Next

 

 

Cliquez sur Install

 

 

L'installation est lancée...

 

 

Encore un petit next

 

 

Puis Finish

 

 

Nous allons maintenant vérifier qu'ImageMagick fonctionne correctement.

Pour cela, cliquez sur le bouton Start, puis entrez la commande cmd et validez avec la touche ENTREE

 

 

Ceci permet d'ouvrir une fenêtre de commande MS-DOS.

Saisissez la commande :

convert -version

Puis appuyez sur la touche ENTREE

 

 

Si ImageMagick fonctionne correctement, vous obtenez ce message.

Si vous ne l'obtenez pas, redémarrez votre ordinateur et revérifiez

 

 

 

Création du script de commande

Nous allons créer un petit script de commande qui nous permettra de traiter toutes les images d'un dossier en un clin d'oeil.

Ouvrez le Bloc-Notes de Windows

 

 

Entrez la commande :

FOR %%G IN (*.jpg) DO convert "%%G" -interlace line "output/%%G"

"output" est le nom du dossier qui recevra les images traitées

 

 

Cliquez ensuite sur le menu "Fichier", puis "Enregistrer sous..."

 

 

Dans le champ "Type", sélectionnez "Tous les fichiers"

 

 

Puis nommez votre fichier "traitement.cmd" ou "progressif.cmd" si vous voulez. Bref, ce que vous voulez mais .cmd à la fin :)

 

 

Cliquez enfin sur le bouton "Enregistrer"

 

 

Vous obtenez un fichier représentant une roue dentée : c'est notre script de commande :)

 

 

 

Utiliser le script de commande

Pour utiliser le script, il vous suffit de le déplacer...

 

 

A l'intérieur du dossier contenant les images que vous souhaitez rendre progressives

 

 

Créez un dossier vide nommé "output" qui contiendra vos images traitées

 

 

Puis double-cliquez sur le script de commande afin de le lancer

 

 

Si votre dossier contient peu d'images, vous ne verrez la fenêtre ci-dessous qu'une fraction de secondes :)

 

 

Votre dossier "output" contient à présent une version progressive de toutes vos images JPEG

 

 

 

 

 

Conclusion

Si vos images JPEG doivent être mises en ligne, prenez l'habitude de les rendre progressives : vous donnerez une impression de chargement plus rapide de vos pages

 

 

 

 

 

Ajouter un Commentaire

Code de sécurité
Rafraîchir