Base de connaissances

 HTML – Retouche d’images.

  Problème :

Comment réduire le poids des images utilisées pour les pages HTML de manière à réduire le temps de chargement.

  Solution :

Le processus ci-après concerne Paint Shop Pro, mais il peut être transposé pour tout autre logiciel de retouche d’images. Il faut considérer au départ une image scannée type tirage papier, format 13 x 8.5 cm.

• Réduire la résolution à 72 ppp qui est celle de l’écran du moniteur : Menu « Images » / « Redimensionner ».
• Cocher ensuite la case « Taille réelle d’impression ».
• « Résolution » mettre 72 à la place de la valeur existante et valider par OK.
• Sauvegarder au format Jpeg par menu « Fichier » / « Enregistrer sous … » mais cliquer sur « Options ».
• Mettre le taux de compression à « 1 » et valider par OK.
• Enregistrer l’image par « OK ».

Cette première manipulation a sensiblement réduit le nombre d’octets sans dégrader la qualité de l’image.

• Menu « Image », sélectionner « Redimensionner ».
• Cocher « Taille en pixels ».
• « Largeur » mettre la valeur 1024 (ou autre correspondant à la définition du moniteur). La hauteur devrait se situer à 683 (si le rapport « largeur /hauteur » est coché). Valider par OK.
• Enregistrer.
• Ramener le taux de compression à 20 % pour réduire encore le poids : Menu « Image » / « Redimensionner », cocher « Pourcentage de l’original », mettre 20 % et valider par OK.
• Enregistrer.

L’image devrait avoir 819 x 546 pixels pour environ 50 Ko. Elle conserve une bonne lisibilité sans trop de dégradations de teintes ou de netteté.

Pour l’incorporer dans une page HTML, ne pas contraindre l’image dans un cadre plus petit mais réduire sa taille au nombre de pixels voulus. Ceci aura pour effet de réduire encore son poids en Ko.