Leçon 8Optimisation des images et chargement différé
- Notion 47 - La différence entre les images matricielles et vectorielles.
- Notion 48 - Sélectionnez le bon type de fichier
- Notion 49 - Ajuster la qualité d'une image.
- Notion 50 - Comprendre la compression d'image
- Notion 51 - Utiliser les sprites CSS
- Notion 52 - Qu'est-ce que le nouveau format WebP?
- Notion 53 - Outils pour l'optimisation d'image.
- Notion 54 - Révision/ évaluation
Notion 50
Comprendre la compression d'image
Compétences ciblées
Dans ce module, nous allons aborder le principe de la compression d'images sur le web.
La compression d'image est un procédé qui consiste à réduire le poids des données sans détériorer la qualité de l'image. En d'autres termes, elle élimine la répétition des données dans une image afin de pouvoir la stocker sans prendre beaucoup de place et/ou la transmettre rapidement.
Il existe deux types de compression d'images :
- La méthode dite « sans perte » : permet de restituer l'image à l'identique de l'original ;
- La méthode dite « avec perte » : permet de réduire l'espace couleur aux couleurs les plus courantes d'une image. Les couleurs choisies sont indiquées dans la palette de couleurs située dans l'en-tête de l'image compressée.
Voici une liste non exhaustive d'outils recommandés pour la compression de différents formats d'images web.
Format JPEG
- Apowersoft Image Compressor disponible en ligne, permet de convertir des fichiers sans limitation de nombre ou de taille. Voici le lien pour y accéder : http://www.apowersoft.fr
- JPEG COMPRESSEUR est également disponible en ligne et proposé en différentes langues, mais les fichiers téléchargeables sont limités à 20. Voici le lien pour y accéder : http://www.compressjpeg.com
- TinyJPG est une application qui vous permet de réduire la taille de vos fichiers jusqu'à 70%. Voici le lien pour y accéder : http://tinyjpg.com
Format GIF
Des outils de compression pour le format GIF sont disponibles gratuitement en ligne et peuvent réduire la taille des fichiers de 50% ou plus. Ils optimisent la taille du fichier GIF pour économiser de l'espace disque.
- Optimiseur GIF
- Optimiseur de fichiers
- Compressor.io
Format PNG
- PngOptimizer est un outil gratuit. Il vous permet de réduire la taille des fichiers d'images et peut également les convertir dans d'autres formats d'images. Voici le lien pour y accéder : https://www.01net.com/telecharger/multimedia/encodeurs_et_decodeurs/pngoptimizer.html
- PNGOUTWin est un outil qui vous permet d'avoir des images plus petites. Voici le lien pour y accéder :
https://www.01net.com/telecharger/multimedia/creation_graphique/pngoutwin.html