Les images représentent environ 50 à 60 % du poids total d'une page web moyenne. Choisir le bon format d'image est l'une des optimisations les plus efficaces que vous puissiez faire pour la performance web. Voici un aperçu pratique de chaque format et de son usage.
Les formats à connaître
JPG (JPEG)
Le vétéran. Le JPG est le standard des photographies sur le web depuis les années 1990. Il utilise une compression avec perte optimisée pour les photographies — dégradés de couleurs naturels, textures et scènes complexes.
Idéal pour : les photographies quand WebP ou AVIF ne sont pas envisageables, ou quand une compatibilité avec d'anciens systèmes est nécessaire.
Faiblesses : plus volumineux que les formats modernes, pas de transparence, artefacts de compression à faible qualité.
PNG
Le PNG est un format sans perte, idéal pour les graphismes à couleurs unies, aux contours nets et aux arrière-plans transparents.
Idéal pour : les logos, icônes, captures d'écran, éléments d'interface, images nécessitant de la transparence.
Faiblesses : bien plus volumineux que le JPG pour les photographies, chargement plus lent.
WebP
Le format WebP de Google propose une compression avec et sans perte, gère la transparence, et surpasse à la fois le JPG et le PNG. C'est désormais le choix par défaut recommandé pour les images web.
Idéal pour : presque tout — photographies (à la place du JPG), logos/graphismes (à la place du PNG), images web en général.
Avantage en taille de fichier : 25 à 35 % plus léger que le JPG à qualité visuelle équivalente ; similaire au PNG, mais souvent plus léger.
Prise en charge navigateur : plus de 97 % (Chrome, Firefox, Safari, Edge — tous les navigateurs modernes).
AVIF
Dérivé du codec vidéo AV1, l'AVIF est le format d'image grand public le plus récent. Il offre une meilleure compression que le WebP — souvent 20 à 50 % plus léger à qualité équivalente.
Idéal pour : les images statiques où la compression maximale est prioritaire et où vous contrôlez le serveur ou le processus de build.
Faiblesses : l'encodage est plus lent (peu adapté à la génération en temps réel), les anciennes versions de navigateurs peuvent ne pas le prendre en charge.
Prise en charge navigateur : Chrome 85+, Firefox 93+, Safari 16+, Edge 121+.
SVG
Le SVG est un format vectoriel — les images sont décrites comme des tracés mathématiques, pas des pixels. Les fichiers SVG s'adaptent à toutes les résolutions et sont généralement très légers pour les logos et icônes.
Idéal pour : les logos, icônes, illustrations, graphiques, tout visuel devant s'adapter à différentes tailles.
À éviter pour : les photographies ou toute image avec des dégradés et textures complexes.
Tableau format / cas d'usage
| Type de contenu | Meilleur format | Solution de repli |
|---|---|---|
| Photographie | AVIF | WebP → JPG |
| Photo de produit | WebP | JPG |
| Logo | SVG | PNG |
| Icône | SVG | PNG |
| Capture d'écran | WebP | PNG |
| Illustration | SVG ou WebP | PNG |
| Motif d'arrière-plan | WebP | JPG |
| Animation | WebP | GIF |
Impact sur la performance : des chiffres concrets
Conversion d'une photo de produit type vers des formats modernes :
| Format | Taille du fichier | Qualité |
|---|---|---|
| JPG (qualité 85) | 340 KB | Référence |
| PNG | 1,2 MB | Sans perte |
| WebP (qualité 80) | 210 KB | ≈ JPG 85 |
| AVIF (qualité 60) | 155 KB | ≈ JPG 85 |
Passer du JPG au WebP permet d'économiser environ 38 % de poids par image. Sur une page contenant 20 photos de produits, cela représente potentiellement plusieurs mégaoctets économisés par chargement de page.
L'élément <picture> pour une amélioration progressive
Si vous voulez servir de l'AVIF avec un repli sur WebP et le JPG comme dernier recours :
<picture>
<source srcset="image.avif" type="image/avif" />
<source srcset="image.webp" type="image/webp" />
<img src="image.jpg" alt="Product photo" />
</picture>
Ainsi, les navigateurs modernes utilisent l'AVIF, les navigateurs modernes plus anciens utilisent le WebP, et les navigateurs anciens se rabattent sur le JPG — sans aucun JavaScript requis.
Qu'en est-il des Core Web Vitals ?
Le Largest Contentful Paint (LCP) est l'une des métriques Core Web Vitals de Google, fortement influencée par le temps de chargement des images. Utiliser le WebP ou l'AVIF pour votre image principale et vos photos de produits peut directement améliorer votre score LCP, un signal de classement pour Google.
Conseils supplémentaires pour les images web :
- Ajoutez les attributs
widthetheightpour éviter les décalages de mise en page (CLS) - Utilisez
loading="lazy"pour les images situées sous la ligne de flottaison - Utilisez
fetchpriority="high"sur votre image LCP (généralement l'image principale)
Convertir vos images
Vous pouvez convertir n'importe quelle image en WebP, AVIF, PNG ou JPG grâce au Convertisseur d'images de PicsSizer. Pour une optimisation en masse, le Compresseur d'images vous permet d'ajuster le niveau de qualité pour obtenir le fichier le plus léger possible sans dégradation visible.
Résumé : les choix par défaut recommandés en 2026
- Photographies sur le web → WebP (avec repli sur JPG via
<picture>) - Logos et icônes → SVG (repli matriciel : PNG)
- Captures d'écran et diagrammes → WebP (avec repli sur PNG)
- Compression maximale, ressources statiques → AVIF (avec repli sur WebP)
- Modèles d'e-mails hérités → JPG ou PNG (les clients e-mail ne prennent pas en charge les formats modernes)
Foire aux questions
- Quel est le meilleur format d'image pour les sites web en 2026 ?
- Le WebP est le meilleur format polyvalent pour les sites web en 2026. À qualité équivalente, ses fichiers sont 25 à 35 % plus légers que ceux en JPG, il prend en charge la transparence comme le PNG et il est entièrement compatible avec tous les navigateurs modernes. L'AVIF est encore plus efficace, mais sa prise en charge par les navigateurs est un peu moins homogène. Utilisez le SVG pour les icônes et les logos.
- Faut-il convertir les images de mon site en WebP ?
- Oui. Convertir vos images JPG et PNG en WebP peut réduire le poids de vos images de 25 à 50 % sans perte de qualité visible. Des images plus légères signifient des pages qui se chargent plus vite, de meilleurs scores Core Web Vitals et un meilleur référencement. Tous les principaux navigateurs prennent désormais en charge le WebP.
- Qu'est-ce que le format AVIF et est-il meilleur que le WebP ?
- L'AVIF est un format d'image de nouvelle génération issu du codec vidéo AV1. À qualité égale, il offre une compression 20 à 50 % plus performante que le WebP. Sa prise en charge par les navigateurs est aujourd'hui excellente (Chrome, Firefox, Safari 16+, Edge). En contrepartie, son encodage est plus lent : il convient donc surtout aux images statiques générées à l'avance.
- Quand utiliser le SVG plutôt qu'un format matriciel ?
- Utilisez toujours le SVG pour les logos, les icônes, les illustrations et tout visuel composé de formes géométriques. Le SVG est indépendant de la résolution (il reste net sur tous les écrans), produit des fichiers très légers pour les graphismes simples et s'adapte parfaitement à toutes les dimensions. Le SVG ne convient pas aux photographies.
- Le format d'image a-t-il un impact sur le SEO ?
- Oui, indirectement. La vitesse de chargement des pages est un critère de classement de Google, et le format des images influe directement sur le poids de vos pages. Utiliser des formats modernes comme le WebP ou l'AVIF au lieu du JPG/PNG peut améliorer vos Core Web Vitals (en particulier le LCP), ce qui influe sur votre positionnement dans les résultats de recherche.