Loading...

Aide CDN.com.tr

Optimisation des images : AVIF et WebP sur l'edge

Activez l'optimisation des images pour le compte ou pour une règle de diffusion et choisissez WebP ou WebP + AVIF : l'edge convertit les images JPEG et PNG et envoie à chaque navigateur un format qu'il accepte, et vos pages gardent les mêmes URL d'images.

Optimisation des images : AVIF et WebP sur l'edge

Activez l'optimisation des images pour le compte ou pour une règle de diffusion et choisissez WebP ou WebP + AVIF : l'edge convertit les images JPEG et PNG et envoie à chaque navigateur un format qu'il accepte, et vos pages gardent les mêmes URL d'images.

Guides associés

Les mesures derrière le choix du format, un vérificateur pour n'importe quelle page et le guide de purge.

Choix du format

AVIF ou WebP, mesuré

Quel format est le plus léger sur les photos, les captures d'écran et les icônes, avec les octets.

Lire le guide
N'importe quelle page

Vérificateur de format d'image

Le format dans lequel les images d'une page arrivent à un navigateur moderne et à un client simple.

Ouvrir le vérificateur
Après l'activation

Purger le contenu mis en cache

Effacez les copies mises en cache avant le changement pour qu'elles soient de nouveau converties.

Ouvrir la rubrique

Chemin dans le panneau

  1. Panneau de gestion
  2. Règles de diffusion
  3. Optimisation des images
  4. Format d'image

Prerequis

  • Un compte CDN dont le site est servi par l'edge.
  • Le rôle propriétaire ou éditeur : les lecteurs voient les réglages et peuvent lancer la vérification des images, mais ne peuvent pas les modifier.
  • Savoir quels chemins ont besoin d'une protection contre le hotlink, d'URL signées ou d'une limite de requêtes : une règle où l'optimisation des images est activée n'en applique aucune, et l'interrupteur du compte les retire aux fichiers JPEG et PNG.

Modele de decision

Tout le compte ou une règle ?

L'interrupteur du compte couvre les fichiers JPEG et PNG de toutes les règles. Celui d'une règle ne couvre que ses chemins, une bonne façon d'essayer d'abord sur un dossier ou un domaine.

  • Tout le compte : pour un site dont les images sont publiques
  • Par règle : d'abord un dossier ou un domaine, les autres règles gardant leurs protections

WebP ou WebP + AVIF ?

Le format se choisit une fois pour le compte et s'applique partout où l'optimisation des images est activée.

  • WebP : presque tous les navigateurs utilisés, coût de traitement plus bas
  • WebP + AVIF (automatique) : de l'AVIF pour les navigateurs qui l'acceptent, généralement le plus léger pour les photos

Guide etape par etape

1

Activez l'optimisation des images

L'interrupteur du compte est le démarrage le plus rapide ; celui d'une règle la limite aux chemins de cette règle.

  • Ouvrez les Règles de diffusion et sélectionnez le compte.
  • Activez Optimisation des images pour tout le compte, ou ouvrez une règle et activez-y l'optimisation des images.
  • Enregistrez et attendez que la modification soit publiée sur l'edge.

Resultat attendu: Les requêtes JPEG et PNG de ces chemins sont converties à l'edge.

cdnctl equivalent
curl -s -X POST -H "Authorization: Bearer $CDN_TOKEN" -H 'Content-Type: application/json' -d '{"type":1}' https://cdn.com.tr/api/accounts/$ACCOUNT_UUID/image_optimization
# une seule règle : "image_optimization":"on" dans le JSON de la règle
cdnctl cdn advanced-rules create --account "$ACCOUNT_UUID" --file rule-images.json
2

Choisissez le format

Le format s'applique partout où l'optimisation des images est activée, sur tout le compte ou dans une règle.

  • Sous Format d'image, choisissez WebP ou WebP + AVIF (automatique).
  • Lisez le taux affiché sous le format avant d'enregistrer.

Resultat attendu: Avec WebP + AVIF, les navigateurs qui acceptent l'AVIF reçoivent de l'AVIF depuis les mêmes URL ; les autres reçoivent du WebP ou l'image dans son format d'origine.

cdnctl equivalent
curl -s -X POST -H "Authorization: Bearer $CDN_TOKEN" -H 'Content-Type: application/json' -d '{"enabled":true}' https://cdn.com.tr/api/accounts/$ACCOUNT_UUID/image_avif
3

Purgez, puis vérifiez

Les images mises en cache avant l'activation gardent leur ancien format jusqu'à leur expiration : purgez donc les chemins des images après l'activation. Un changement de format ne demande aucune purge.

  • Purgez les dossiers d'images, ou tout, dans Nettoyage du cache.
  • Lancez la vérification du format d'image sous l'interrupteur sur l'un des domaines du compte.

Resultat attendu: La vérification liste chaque image avec le format et la taille que reçoit un navigateur moderne ; quand l'optimiseur a gardé l'original parce que la conversion n'était pas plus légère, la ligne le signale.

cdnctl equivalent
cdnctl purge --account "$ACCOUNT_UUID" --path /wp-content/uploads/ --type prefix
curl -s -H "Authorization: Bearer $CDN_TOKEN" "https://cdn.com.tr/api/accounts/$ACCOUNT_UUID/image_check?host=www.example.com"

Verification

  • curl -sLo /dev/null -w '%{content_type} %{size_download}\n' -H 'Accept: image/avif,image/webp,*/*' https://www.example.com/photo.jpg → image/avif ou image/webp (avec WebP seul, image/webp après la redirection), sauf si le fichier converti n'était pas plus léger
  • curl -s -D - -o /dev/null -H 'Accept: image/webp,*/*' https://www.example.com/photo.jpg | grep -iE '^(vary|location)' → WebP + AVIF : Vary: Accept ; WebP seul : Location: …/photo.jpg.webp
  • curl -so /dev/null -w '%{content_type}\n' -H 'Accept: */*' https://www.example.com/photo.jpg → image/jpeg, le format d'origine

Cas d'usage

Une boutique veut des photos de produits plus légères sans réexporter sa médiathèque, sans installer d'extension et sans changer une seule URL d'image.

Workflow rapide

  1. Ouvrez les Règles de diffusion du compte.
  2. Activez l'optimisation des images pour tout le compte, ou activez-la dans une règle pour commencer par les chemins de cette règle.
  3. Sous Format d'image, choisissez WebP ou WebP + AVIF (automatique) pour le compte.
  4. Purgez les images déjà en cache, puis lancez la vérification du format d'image sous l'interrupteur.

Verifications

  • Sont convertis les fichiers JPEG et PNG (.jpg, .jpeg, .png). Les GIF, les SVG et les fichiers déjà en .webp partent sans modification.
  • La façon dont le format arrive au navigateur dépend du format du compte. Avec WebP + AVIF, une seule URL répond à tous les navigateurs : l'edge lit l'en-tête Accept du navigateur, envoie de l'AVIF, du WebP ou l'image dans son format d'origine, et répond avec Vary: Accept. Avec WebP seul, les navigateurs qui acceptent le WebP sont redirigés (302) vers une copie WebP portant le même nom suivi de .webp (photo.jpg.webp), et les autres reçoivent l'image dans son format d'origine. Dans les deux cas, votre HTML garde les mêmes URL d'images.
  • En pleine taille, une image nouvellement convertie n'est envoyée que si elle est plus légère que l'original : un AVIF qui n'est pas plus léger laisse la place au WebP, et un WebP qui n'est pas plus léger à l'original. Les images redimensionnées avec ?w= ou ?h= ne sont pas comparées.
  • Si une conversion échoue, l'edge sert l'image d'origine à la place.
  • Les images converties sont conservées 365 jours, à l'edge et dans les navigateurs. Les copies mises en cache avant l'activation gardent leur ancien format jusqu'à leur expiration ou jusqu'à ce que vous les purgiez. Changer de format ne demande aucune purge : l'edge stocke chaque format à part, donc les nouveaux visiteurs reçoivent tout de suite le nouveau format, tandis qu'un navigateur qui a déjà chargé une image peut garder sa copie jusqu'à un an.
  • Protection contre le hotlink, URL signées et limite de requêtes : une règle où l'optimisation des images est activée n'en applique aucune, à aucun des fichiers qu'elle sert. Avec l'interrupteur du compte activé, les fichiers JPEG et PNG y échappent sur toutes les règles qui n'ont pas leur propre interrupteur. Laissez l'optimisation des images désactivée sur toute règle dont les fichiers ont besoin de ces protections, et l'interrupteur du compte aussi si ses JPEG et PNG en ont besoin. Une règle à chemin exact ne peut pas utiliser l'optimisation des images.
  • Le traitement est décompté de votre quota mensuel, l'AVIF à un taux plus élevé que le WebP. Le panneau affiche le taux actuel sous l'interrupteur.

Questions frequentes

Pourquoi certaines images arrivent-elles encore en JPEG ou en PNG ?

Le plus souvent, la copie a été mise en cache avant l'activation : purgez ces chemins et redemandez-les. Autres raisons : en pleine taille, la conversion n'était pas plus légère que l'original, le navigateur n'accepte ni le WebP ni l'AVIF, ou la requête ne demandait aucun format d'image en particulier (un simple curl envoie Accept: */*). La vérification du format d'image de la page Règles de diffusion indique, image par image, ce que reçoivent un navigateur moderne et un client simple.

Puis-je redimensionner les images via l'URL ?

Oui. Ajoutez ?w= (largeur), ?h= (hauteur) ou les deux à l'URL d'une image. Une seule valeur conserve les proportions, les deux font tenir l'image dans ce cadre, et aucune image n'est agrandie au-delà de sa taille d'origine. Gardez w et h dans la clé de cache de cette règle (la valeur par défaut, la query complète, le fait) : une règle qui ignore tous les paramètres de requête met en cache une seule taille pour toutes. Les images redimensionnées sont aussi converties, mais elles ne sont pas comparées à l'original.

Comment est-ce facturé ?

Il n'y a pas d'offre séparée. Le traitement est décompté du quota mensuel du compte, comme le trafic : chaque conversion compte l'original lu plus l'image renvoyée, et l'AVIF compte à un taux plus élevé que le WebP parce que son encodage demande plus de traitement. Le panneau affiche le taux actuel sous l'interrupteur, et Consommation de données montre l'optimisation des images sur sa propre ligne.

Ai-je besoin de WebP + AVIF ?

C'est un choix, pas une obligation. Le WebP seul atteint presque tous les navigateurs utilisés. WebP + AVIF ajoute l'AVIF pour les navigateurs qui l'acceptent, généralement le format le plus léger pour les photos : dans notre mesure, une photo JPEG de 262 025 octets est partie en 86 936 octets d'AVIF. Lancez le vérificateur de format d'image sur vos propres pages pour voir la différence.