Cluster C5 : Traitement d'image
Optimisation d'image pour le web : workflow complet
Optimiser une image ne se résume pas à compresser un fichier. Il faut une méthode répétable qui couvre taille d'affichage, format et contrôle avant publication.
Partir des contraintes d'affichage
Le bon point de départ n'est pas le taux de compression mais la taille réelle d'affichage dans la page. Définir largeur et ratio évite d'envoyer des fichiers inutilement énormes.
Hero, carte, miniature et icône doivent avoir des règles d'export distinctes selon leur rôle.
Associer politique de format et garde-fous de release
- Réserver les formats modernes avec perte aux photos, et garder les visuels UI en lossless ou en SVG.
- Ajouter budgets de poids, variantes responsive et contrôle visuel au process de release.
- Conserver un exemple volontairement hors budget pour vérifier que la QA bloque bien le fichier.
Exemple pratique entrée/sortie
Entrée
Image hero : 3840x2160, PNG 5.4MB Image carte : 1920x1080, JPG 1.3MB
Sortie
Hero : variantes responsives en 1920x1080 Carte : 800x450 compressé avec cible <180KB