Dès la photo scannée, plusieurs opérations sont nécessaires avant son incorporation dans une page web. 2 étapes principales peuvent être notées :
- Redimensionner
- Compression
Ces 2 étapes sont décrites à partir des logiciels Photoshop, Firework. Des différences peuvent exister d'une version de logiciel à l'autre, ainsi que pour d'autres logiciels, mais la logique reste identique.
Le traitement chromatique et l'ajout d'effets ne sont pas traités ici.
Redimensionner
Il est important de redimensionner l'image en pixels à la taille qu'elle aura dans le site pour éviter d'ob-tenir une image trop grande, donc trop lourde à charger. Cette technique permet aussi d'atténuer des effets apliqués à l'image originale.
Photoshop : menu « Image -Taille de l'image... »
Fireworks : menu « Modification - Taille de l'image... »
Sélectionner la hauteur ou la largueur de l'image. Si la case à cocher « Conserver les proportions » est cochée, l'autre dimension sera automatiquement ajustée.
Compression
Avec le format JPEG, les principaux paramètres de compression sont :
- Le taux de compression
- Optimisation
- Progressif
Des différences notables existent entre les logiciels. Les outils les plus performants pour un traitement de l'image sur Internet sont Macromedia Fireworks et Adobe ImageReady. Avec le logiciel que vous utilisez vous pouvez suivre les conseils ci-dessous pour optimiser vos images pour Internet, en fonc-tion des caractéristiques du logiciel.
Taux de compression
Le taux de compression (de 1 à 99 dans Paint Shop Pro) est inversement proportionnel à la qualité. La qualité est comprise entre 0 et 12 dans Photoshop et 1 à 99 dans Fireworks.
Pour des images acceptables dans Fireworks, la qualité doit être comprise entre 60% et 80%. Si la compression est inférieure à 50%, elle est trop visible. Au-dessus de 80%, le gain de poids de l'image ne se justifie pas par rapport à l'augmentation de la qualité (voir comparatif de taux de compression).
Optimisation
Plusieurs facteurs d'optimisation sont possibles en fonction du logiciel que vous utilisez.
Avec la plupart des logiciels vous sélectionnez la taille à atteindre et le logiciel gère au mieux les pa-ramètres à sa disposition pour obtenir une image du poids souhaité.
Photoshop
Menu « Fichier - Enregistrer une copie... ».
Dans la liste déroulante « Enregistrer sous » de la boîte de dialogue, choisir JPEG et donner un nom au fichier à enregistrer.
Dans les Options JPEG, il est possible de choisir le format « de base » (format de jpeg classique), de base optimisé (uniquement disponible pour les versions récentes de navigateur) qui permet de diminuer légèrement le poids des fichiers.
Le format « progressif optimisé » permet d'obtenir une image qui s'affichera par passages successifs de l'image (entre 3 et 5 passages). Cette fonctionnalité n'est pas gérée par tous les navigateurs.
Une autre option consiste à utiliser le menu « Fichier - Enregistrer pour le Web » ou ImageReady suivant la version de PhotoShop utilisée.
Les paramètres supplémentaires sont :
Atténuation ou Estomper (correspondant au lissage dans Fireworks)
Détourage (correspondant au matage dans Fireworks)
Paint Shop Pro
Choisir le menu « Fichier - Enregistrer sous... ». Sélectionner le type « JPG - JPEG – JFIF ».
Vous pouvez demander un codage standard ou progressif.
Cliquer sur le bouton « Options... » pour sélectionner le taux de compression utilisé (pour plus d'in-formation, voir le tableau comparatif des taux de compression)
Fireworks
Afficher la fenêtre « Optimiser », sélectionner le type Jpeg et la qualité.
il est possible de choisir :
- Lissage (utilisé au niveau 2 dans le paramètre « JPEG - Fichier réduit »). Il améliore la qualité des images trop compressées, mais ajoute du flou.
- Matage, surtout utilisé pour les dessins vectoriels qui ont un fond transparent.
D'autres options sont disponibles par le menu (triangle orienté vers la droite et qui se situe à droite de la fenêtre flottante). Il est possible de choisir :
- « Supprimer les couleurs non utilisées ». Cette option réduit sensiblement la taille du fichier (fonction de la nature et de la taille de l'image).
- JPEG progressive » permet un affichage en plusieurs passages.
- « Bords des JPEG plus nets » permet de mieux voir les textes et les passages entre des zones fortement contrastées.
- Avec la version 4, il est possible de définir des zones, puis dans le menu « modification - JPEG sélectif - Sauver la sélection comme masque JPEG » de valider ces zones et de traiter différemment le taux de compression pour la zone sélectionnée par rapport au reste de l'image.
Progressif
Les fichiers « Jpeg progressifs » acceptent l'entrelacement (l'image s'affiche en blocs qui deviennent de plus en plus nets comme pour le Gif).
Seuls les navigateurs de classe 4 (globalement) ou supérieurs acceptent le GIF progressif, mais la majorité des navigateurs sont de ce type (vérifier les accès à votre site pour en avoir confirmation).
Comparatif des taux de compresion
Comparatif des taux de compression entre Photoshop, Fireworks et Paint Shop Pro.
Photoshop Qualité | Fireworks Qualité |
12 | 99 |
11 | 97 |
10 | 95 |
9 | 92 |
8 | 89 |
7 | 86 |
6 | 84 |
5 | 82 |
4 | 78 |
3 | 73 |
2 | 63 |
1 | 52 |
0 | 46 |
Paint Shop Pro Taux de compression | Fireworks Qualité |
99 | 6 |
95 | 8 |
90 | 12 |
85 | 16 |
80 | 20 |
75 | 25 |
70 | 30 |
65 | 35 |
60 | 40 |
55 | 45 |
50 | 50 |
45 | 55 |
40 | 60 |
35 | 65 |
30 | 70 |
25 | 75 |
20 | 80 |
15 | 85 |
10 | 90 |
5 | 95 |
1 | 99 |