Quels sont les différents formats d’image et ceux adaptés pour le web ?
Connaissez-vous tous les formats d’image et leurs utilisations ? JPEG, PNG, SVG, AI… avec tous ces sigles, on a tendance à s’y perdre. Bien choisir son format d’image est important, celui-ci va définir l’utilisation que vous ferez de votre fichier. Si vous comptez publier une image sur le web il vous faudra choisir le bon format, un fichier qui ne s’affiche pas ou qui est trop lourd et c’est votre SEO en paiera le prix. Dans cet article nous reviendrons sur les principaux formats et leurs caractéristiques qui leur sont propres, donc plus d’excuses !
Différents formats et leurs utilisations
- Ai (Adobe Illustrator) : Le format Ai est le format qui fait référence à illustrator (l’un des logiciels de design vectoriel le plus connu au monde). Ces designs vectoriels basés sur des tracés et des formes géométriques ont pour avantage de conserver la netteté de l’illustration et conserver sa qualité même lors d’une redimension de l’image. Ce format est plus adapté à la création de logos ainsi qu’à la création d’images destinées aux supports de communication. En revanche vous serez forcé de posséder Adobe Illustrator pour avoir accès à ce genre d’image.
- PSD (Adobe Photoshop) : Le PSD est le format d’enregistrement de base du logiciel de retouche d’image Photoshop. C’est un fichier matriciel, composé de pixels et donc non vectoriel. Plus la résolution de votre image sera mauvaise, plus les pixels seront gros et plus l’image sera floue. Le PSD est souvent utilisé pour les images qui ne peuvent pas être vectorisées. Ce format permet de retravailler une image de manière très précise mais il reste un format lourd uniquement adapté à la retouche d’images.
- SVG (Scalable Vector Graphics) : Le SVG est un format qui permet de sauvegarder et afficher des images vectorielles. Ce format est léger et permet de redimensionner les images sans perte de qualité. Il ne s’utilise que sur les navigateurs et n’est pas supporté par les réseaux sociaux.
- JPEG (Joint Photographic Expert Group) : JPEG est le format photo le plus répandu, il est notamment utilisé par les appareils photo numériques. Ce format est réputé pour sa compression de données, il ne va garder que les informations visibles pour notre œil et supprimer celles que l’on ne peut pas voir. Ainsi vous obtenez un fichier léger et qui possède une qualité suffisante pour une utilisation digitale. Qui dit fichier léger dit temps de chargement optimisé, ce format charge plus rapidement et est utilisé sur toutes les plateformes ayant une limite de taille. C’est un format universel qui peut être lu sur n’importe quel support et qui ne nécessite pas de logiciel ou d’outil particulier. Notez tout de même que sa qualité diminue à chaque nouvelle sauvegarde.
- PNG (Portable Network Graphics) : Le PNG est reconnu pour sa compression sans perte qui supporte de grande qualité d’image tout en conservant la netteté et les couleurs initiales de l’image originale. Ce format supporte les fonds transparents, idéale pour des logos, incrustation, et autres photos au fonds transparent, chose que le JPEG ne supporte pas. Le PNG est un format lourd mais qui est adapté pour le web, il faut bien sûr l’utiliser avec parcimonie dans une page web afin de ne pas trop l’alourdir.
- GIF (Graphics Interchange Format) : Ce format est très populaire sur internet et notamment sur les réseaux sociaux. Le GIF est une animation qui utilise LZW un algorithme de compression sans perte. De petite taille, ce format s’adapte à toutes les plateformes, cependant à cause de la limitation du format certaine couleur peuvent être déformés. Ce format peut supporter les fonds transparents tout comme le format PNG.
- PDF (Portable Document Format) : Créé par Adobe le PDF est maintenant toujours utilisé pour la mise en ligne de fichiers ou l’impression de ces fichiers. Ce format permet de partager et d’enregistrer un fichier sans qu’il puisse être modifié et en gardant le même affichage sur n’importe quel support. Ce format peut contenir, texte, vidéo, photo, image vectorielle et éléments interactifs créés à l’aide d’outils tels que Photoshop, illustrator et bien d’autres. La seule contrainte pour pouvoir ouvrir un fichier au format PDF vous devez posséder PDF Reader sur votre ordinateur.
- EPS (Encapsulated Postscript) : Prédécesseur du PDF, le format EPS est un fichier de partage. Ce format supporte également les images vectorielles, et a l’avantage de pouvoir être ouvert via plusieurs logiciels. C’est en revanche un fichier lourd et il est aujourd’hui remplacé par le format PDF.
- TIFF (Tagged Image File Format) : Le format TIFF est le format de référence pour les images de haute qualité. Principalement utilisé par les professionnels, il est utilisé dans le domaine commercial et de l’impression. C’est un fichier lourd mais supporté par tous les systèmes d’exploitation. Ce format est généralement utilisé pour de l’impression très haute qualité.
- MP4 (Moving Picture Expert Group) : Le MP4 est un format multimédia, un format de vidéo très répandu sur le net et notamment sur les réseaux sociaux. Ce format supporte de la vidéo, du texte et de l’audio. C’est un format léger car compressé qui s’adapte à plusieurs plateformes et plusieurs lecteurs vidéo. C’est le format parfait pour publier vos vidéos sur votre site ou vos réseaux sociaux.
Bien adapter ses formats et optimiser ses images pour le web c’est important !
Vous l’aurez surement compris, les formats d’image ont tous leurs caractéristiques qui leur sont propres. Ici ce qui va nous intéresser ce sont les formats qui sont adaptés au Web et l’usage que l’on peut en faire.
JPEG : Parfait pour les images et visuels colorés, c’est le format le plus utilisé sur le web.
PNG : Idéal pour les images à fond transparent, graphique et logo.
SVG : Format adapté aux images vectorielles, permet de les déformer sans altérer la qualité.
GIF : Images animées idéale pour illustrer vos propos, fortement utilisé sur les réseaux sociaux.
MP4 : Format vidéo idéal pour le web, léger il supporte la vidéo, le son et le texte.
Les nouveaux formats adaptés pour le Web
Depuis peu nous assistons à l’émergence de nouveaux formats adaptés pour le Web, le WebP, le Jpeg 2000 et le Jpeg XR mais que valent ces nouveaux formats ?
- WebP : Créé en 2010 par Google, le format WebP à pour objectif de réduire la taille des images autant que possible. En général la taille des images WebP est environ 30% plus petite que celle des images PNG ou Jpeg avec la même qualité d’image. Le WebP réunit les caractéristiques des deux formats, compression sans perte (comme pour le PNG) et compression avec perte (comme pour le Jpeg). Ce format offre une multitude d’utilisation : photo, image animée et graphique. Le format WebP n’est compatible qu’avec les navigateurs Chrome, Chrome pour Android, Opera, Opera, Opera Mini, le navigateur Android, firefox, firefox android, edge, Android Browser, UC Browser for Android, Samsung Internet, QQ Browser et Baidu Browser.
- Jpeg 2000 et Jpeg XR : Ces deux formats sont des évolutions du format Jpeg que nous connaissons. Ils offrents une taille de fichier plus petite pour la même qualité. Mention spéciale pour le format Jpeg XR qui comme le format PNG supporte la transparence. Le format Jpeg 2000 est compatible avec les navigateurs safari et IOS safari, Tandis que le Jpeg XR est compatible lui avec Internet explorer, Edge, et internet explorer mobile
Des alternatives dédiés au Web, plus adaptés que les formats que nous connaissons, mais qui ne sont pas supportés par tous les navigateurs et qui ont besoin d’être démocratisé sur tous les navigateurs afin d’étendre leur utilisation.
Bien choisir son format d’image à publié sur le web est essentiel, plus un fichier sera lourd plus il mettra de temps à charger et votre page en paiera les conséquences. Une page trop lourde qui met trop de temps à charger sera pénalisé au niveau SEO par Google il est donc essentiel pour vous de faire attention à la taille et au format des images que vous publiez sur le web. Veillez donc à ce que vos fichiers ne soient pas trop lourds (de préférence moins d’1 Mo) et que votre format est adapté à son utilisation et à votre moteur de recherche.
Lire plus d’articles : 5 outils gratuits de gestion des réseaux sociaux – Qu’est-ce qu’un audit de site web et pourquoi est-il si important ? – Écologie et Web : Comment créer des sites Web bas carbone