#Conseils clients

#Marketing

#Technique

Quels formats d’images utiliser pour votre site web ?

une femme devant son ordinateur choisit des photos sur une banque d'images en Bretagne

Pour votre site web, il est conseillé d’utiliser les images les plus légères possibles afin que votre site soit le plus performant possible.

Voici donc quelques conseils sur les formats des images que vous pouvez utiliser sur votre site internet :

  • Quel format pour les images matricielles ?

Tout d’abord, les formats BMP sont à proscrire car ils ne se compressent pas et sont donc très lourds.

Le format GIF est un format plutôt ancien et peu recommandé en photo car il ne peut enregistrer que 256 couleurs. Cela donne des photos très pixellisées et pas vraiment valorisantes. Ce format et plus adapté pour des pictos ou des petites illustrations. L’intérêt de ce format est qu’il gère les fonds transparents et qu’il permet de faire des petites animations plus légères qu’une vidéo. Un gif animé permet de « réveiller » votre communication et d’attirer l’œil de vos internautes.

Le format JPEG ou JPG est le plus courant. C’est un format versatil, très utilisé sur le web. Il enregistre 16 millions de couleurs, permet de compresser les images en maintenant la qualité, et surtout c’est un format compatible avec tous les matériels informatiques. Seul bémol : lorsque le visuel contient des lignes droites ou du texte, les contours sont parfois légèrement pixellisés lors de la compression…

Le format PNG est intéressant pour le web : en plus d’avoir les qualités du jpeg, le png peut sauvegarder la transparence. Il est également idéal pour mettre en ligne des visuels qui contiennent des lignes droites ou du texte : ces éléments resteront nets.

Le format Webp, peu connu, a été créé par Google dans le but de remplacer les différents formats d’images standard : jpeg, jpg, png, gif, tiff… Son objectif est de conserver une bonne qualité d’image tout en réduisant leur poids de 25 % à 30 % afin d’optimiser la vitesse de chargement d’un site web. Grâce à une appli comme tinywow, vous pouvez compresser votre image en réduisant la taille de façon considérable et avec une qualité comparable à l’orignal. Ce format prend même en charge les images animées (ex. gif) et la transparence (ex. png). Un inconvénient de taille : tous les navigateurs ne prennent pas en charge ce format et WordPress ne permet toujours pas de charger des webp dans sa médiathèque.

  • Quel format pour les fichiers vectoriels ?

Les fichiers ai ou eps sont des formats Adobe Illustrator, absolument pas compatibles pour le web.

Le format SVG est universel, on peut le visualiser dans n’importe quel navigateur. Il est très flexible et manipulable pour la programmation de votre site web (vous pouvez modifier facilement un fichier svg). Ce format permet d’obtenir une résolution optimale pour un poids d’image relativement faible. Cependant, il est privilégié pour les icones et les graphiques simples car la taille du fichier grandit très vite s’il est composé de plein de petits éléments. Principal inconvénient : ce format comprend des risques de failles (vulnérabilité XML), il est donc important d’avoir un bon dispositif de sécurité sur votre site. Et si vous utilisez WordPress, sachez que ce cms n’accepte pas les svg dans les médias, il faut donc installer une extension pour intégrer des svg à votre site.

Donc, si on récapitule, voici les formats les plus adaptés aux usages web :

Si votre image est une photo sans texte, choisissez le format JPG. Les images en JPG sont généralement moins lourdes que les PNG.

S’il s’agit d’une image avec du texte ou des éléments transparents, alors il faut mieux utiliser le format PNG.

Le format GIF est parfait pour les images animées et les illustrations simples.

Au niveau du poids, essayez de rester entre 100 et 200 ko.

Et pensez à remplir la balise ALT. On vous explique en quoi les images sont vos alliées pour le référencement naturel dans cet article.

 

Crédit photo : © Louise Garin

Vous avez trouvé cet
article intéressant ?

picto ampoule

Pour faire le plein d'astuces,

Suivez-nous sur

Je m’abonne à la newsletter
Qui ne s’abonne pas n’est pas breton :)