Optimisation des images .png et .jpg, compression Deflate extrême des fichiers statiques

Le sujet

À l'heure où l'on accède de plus en plus souvent au Web en mobilité, les images représentent une part conséquente des données émises par les serveurs ou proxy HTTP. Pour autant les ténors de la production d'images tels Photoshop ou Fireworks ne génèrent pas toujours des fichiers parfaitement optimisés ou ne laissent pas l'utilisateur agir sur certains paramètres.

Après un rapide retour sur les spécifications PNG (type, couche alpha, filtrage etc.) et JPEG (sous-échantillonnage de la chrominance, baseline vs extended, transmission progressive etc.) cet atelier va vous familiariser avec quelques outils d'analyse (JPEGSnoop, TweakPNG etc.) afin d'y débusquer d'éventuelles métadonnées superflues (vignette de prévisualisation, commentaire, profil colorimétrique etc.) ou erreurs de ciblage (image noir et blanc ou 256 couleurs enregistrée en millions de couleurs).

Les meilleurs moteurs de compression Deflate (utilisables également sur les fichiers .css, .js ou .svg) ainsi que le nettoyage de la couche alpha et le filtrage automatique seront mis en œuvre pour (re)compresser des PNGs.

Du côté du JPEG le réglage fin de la transmission progressive et l'utilisation de régions d'intérêt seront expérimentés.

L'automatisation des optimisations par des scripts sera également pratiquée.

Présenté par Frédéric Kayser

Frédéric Kayser

Ancien technicien de l'atelier numérique de l'École supérieure des arts décoratifs de Strasbourg et ancien administrateur système dans le pré-presse je suis aujourd'hui opérateur grand système IBM, mais surtout féru de compression et auteur de deux petits hacks pour optimiser les images PNG (cryopng et huffmix).