Images & médias
Tous les tutoriels
Du plus simple au plus avancé.
Mettre en place le chargement différé des images via un CMS
Mettez en place le chargement différé natif des images sur votre CMS avec loading=lazy : règles, pièges à éviter et…
Optimiser les images de fond CSS responsives
Servez des images de fond CSS adaptées à chaque écran avec les requêtes média et image-set pour alléger vos pages…
Remplacer les GIF animés par des vidéos
Convertissez vos GIF animés en MP4 et WebM pour diviser leur poids par dix : moins de bande passante, des…
Différer le chargement des vidéos
Différez le chargement de vos vidéos selon leur usage : preload, poster et Intersection Observer pour des pages plus légères…
Accélérer l'affichage avec content-visibility
Apprenez à utiliser la propriété CSS content-visibility pour ignorer le rendu hors écran et accélérer le chargement initial de vos…
Différer le chargement des iframes (loading=lazy)
Allégez vos pages en différant le chargement des iframes hors écran avec loading=lazy : moins de données, un FCP et…
Optimiser les images avec un CDN d'images
Réduisez le poids de vos images de 40 à 80 % grâce à un CDN d'images : format, taille et…
Optimiser les vidéos pour la performance web
Conteneurs, codecs, poster, preload et chargement différé : optimisez vos vidéos pour alléger vos pages et améliorer vos Core Web…
Choisir la bonne taille d'image avec srcset
Servez à chaque écran la plus petite image possible avec srcset et sizes. Pages plus rapides, moins de données gaspillées,…
Le chargement différé natif des images (loading=lazy)
Activez loading="lazy" pour différer les images hors écran sans JavaScript. Pages plus rapides, bande passante économisée, meilleur SEO.
Différer le chargement des images et des iframes
Allégez le chargement initial en différant images et iframes hors écran. Moins de bande passante, meilleur LCP et meilleur INP…
Optimiser les images pour la performance et le SEO
Réduisez le poids et la taille de vos images, adoptez WebP et AVIF, et accélérez vos pages pour un meilleur…
Optimiser le poids des images (et son impact business)
Allégez vos images pour accélérer le LCP, réduire le CLS et améliorer vos conversions. Découvrez l'impact business d'images bien optimisées.
Parcours d'apprentissage recommandé
Suivez ce chemin pour progresser efficacement dans cette thématique.
Mettre en place le chargement différé des images via un CMS
Mettez en place le chargement différé natif des images sur votre CMS avec loading=lazy : règles, pièges à éviter et…
Optimiser les images de fond CSS responsives
Servez des images de fond CSS adaptées à chaque écran avec les requêtes média et image-set pour alléger vos pages…
Remplacer les GIF animés par des vidéos
Convertissez vos GIF animés en MP4 et WebM pour diviser leur poids par dix : moins de bande passante, des…
Et 10 autres tutoriels pour aller plus loin
Voir tous les tutorielsAccompagnement personnalisé
Les tutoriels ne suffisent pas ? Nos experts SEO vous accompagnent pour développer une stratégie sur-mesure.
- Audit SEO complet de votre site
- Formation personnalisée
- Accompagnement sur mesure