GIF animés aujourd’hui : où ils fonctionnent et comment réduire leur taille

Pour réduire la taille d’un GIF, réduisez ce que le fichier doit stocker : moins d’images, moins de pixels par image et moins de couleurs. Raccourcir, retirer une image sur deux, réduire les dimensions et la palette allègent souvent nettement un GIF, sans abîmer l’animation. Là où d’autres formats sont acceptés, le WebP animé ou une courte vidéo fait en général gagner bien davantage.

Ce guide montre où les GIF animés font encore du bon travail, pourquoi le format produit des fichiers lourds, comment en alléger un pas à pas avec l’Éditeur de GIF et d’animations, quand une image fixe tirée d’Extraire des images est le meilleur choix et comment garder les animations accessibles. Tout ce qui est décrit fonctionne dans votre navigateur ; les fichiers ne sont jamais téléversés.

Où les GIF animés fonctionnent encore bien

Le GIF date de la fin des années 1980, et c’est pourtant le seul format d’animation que presque tous les programmes affichent sans lecteur. Tout son avantage est là, et cela explique où il a encore sa place :

• Newsletters par e-mail. La plupart des programmes de messagerie affichent un GIF animé dans le message ; la vidéo y est rarement lue. Certains programmes n’affichent que la première image : elle doit donc porter le message à elle seule.
• Documentation et pages d’aide. Une boucle de trois secondes montrant un clic dans un écran de réglages en dit plus qu’un paragraphe — et beaucoup de wikis et de systèmes d’assistance acceptent les images, mais pas la vidéo.
• Messagerie et outils internes. Messageries, systèmes de tickets et tableaux de projet affichent les GIF directement.

Sur votre propre site, la situation change : vous maîtrisez le balisage, et une vidéo ou un WebP animé remplit presque toujours le même rôle avec un fichier plus léger. La comparaison entre GIF, vidéo et WebP animé détaille ce choix.

Pourquoi les fichiers GIF sont si lourds

Un GIF enregistre chaque image avec au plus 256 couleurs, compressée sans perte — efficace pour des graphiques simples à la fin des années 1980, et la raison pour laquelle quelques secondes d’enregistrement d’écran peuvent peser plus que la vidéo d’origine. Le format est défini dans la spécification GIF89a sur w3.org (en anglais) ; ses limites en pratique :

• 256 couleurs par image. Photos, dégradés et ombres en ont bien plus. L’encodeur choisit une palette et imite le reste par tramage — de fins motifs de points qui paraissent granuleux et se compressent mal.
• Sans perte, image par image. Le GIF compresse bien les zones de pixels identiques et mal le bruit. Un encodeur peut ne stocker que la partie modifiée depuis l’image précédente, mais une prise de vue réelle change partout, en permanence.
• Chaque pixel fois chaque image. La taille croît avec largeur × hauteur × nombre d’images. Doubler la largeur multiplie environ par quatre les pixels à stocker.
• Pas de son, une transparence simple. Un GIF n’a pas de piste audio, et un pixel est soit entièrement transparent, soit entièrement opaque — les ombres douces deviennent des bords durs et frangés.

Réduire la taille d’un GIF : les leviers

Chaque levier supprime une autre partie de ce que le fichier stocke. Procédez à peu près dans cet ordre — les premiers font gagner beaucoup et se remarquent à peine :

Sans aucune modification, l’outil se contente de réoptimiser l’animation et ne rend jamais un fichier plus lourd que l’original.

Pas à pas : réduire la taille d’un GIF dans le navigateur

1. 1

   Ouvrir l’animation

   Ouvrez l’Éditeur de GIF et d’animations et ajoutez un GIF, WebP ou PNG animé. L’outil modifie une animation par traitement et en affiche les images sur une ligne de temps, numérotées à partir de 1.

2. 2

   Retirer ce qui ne sert à rien

   Sous Images, fixez la première et la dernière image conservées pour supprimer l’amorce et la pause finale, et indiquez les images isolées à supprimer. Essayez ensuite Supprimer une image sur N avec 2 ou 3 : la durée d’une image retirée passe à l’image précédente, l’animation garde donc sa longueur.

3. 3

   Réduire les images

   Recadrez sur la zone où il se passe quelque chose, puis redimensionnez — pour une newsletter ou une page d’aide, la largeur réellement affichée suffit. Sous Rééchantillonnage, Plus proche voisin (pixel art) garde le pixel art net ; Lanczos (le plus net) convient à tout le reste.

4. 4

   Réduire les couleurs

   Dans Réglages du format → GIF, baissez Couleurs pas à pas. Les enregistrements d’interfaces aux aplats paraissent souvent identiques avec bien moins de 256 couleurs ; les prises de vue proches de la photo en demandent davantage. Le tramage Aucun donne les fichiers les plus légers pour les aplats, Floyd–Steinberg adoucit les dégradés, et la palette Une pour toutes les images garde les couleurs stables sur toute la boucle.

5. 5

   Choisir les lectures et le format

   Lectures fixe combien de fois l’animation est jouée (0 : en boucle). Sous Enregistrer en, gardez le GIF pour l’e-mail et la messagerie, ou choisissez WebP là où il est accepté.

6. 6

   Comparer et garder le meilleur

   Comparez le résultat à l’original. Chaque traitement compte pour une opération ; un autre réglage, c’est un nouveau traitement.

L’animation est lue depuis votre disque, modifiée dans la mémoire de votre navigateur et enregistrée à nouveau sur votre appareil ; concernant l’animation, notre serveur apprend seulement que l’outil a été utilisé. Le fonctionnement est expliqué dans où mes images sont traitées, plus en détail dans le traitement d’images dans le navigateur, et sur la page sécurité. Avant de partager un enregistrement d’écran, vérifiez aussi ce qu’il montre au passage : des noms, des adresses e-mail, une notification apparue un instant.

GIF accessibles : flashs, mouvement et alternatives

Une animation qui bouge d’elle-même peut distraire, et une animation qui clignote peut nuire. Les Règles pour l’accessibilité des contenus Web (WCAG 2.2) contiennent deux critères de succès qui s’appliquent directement aux GIF :

• Pas plus de trois flashs par seconde. Le critère 2.3.1 (niveau A) prévoit qu’un contenu ne produise pas plus de trois flashs par période d’une seconde, sauf si les flashs restent sous les seuils définis — voir Understanding « Three Flashes or Below Threshold » sur w3.org (en anglais).
• Pouvoir arrêter un mouvement prolongé. Selon le critère 2.2.2 (niveau A), un contenu en mouvement qui démarre automatiquement, dure plus de cinq secondes et s’affiche à côté d’autres contenus doit pouvoir être mis en pause, arrêté ou masqué. Un GIF dans une page n’a pas de bouton pause : gardez des boucles courtes, limitez Lectures à quelques répétitions plutôt qu’une boucle infinie, ou affichez une image fixe qui mène à l’animation.

Donnez à l’animation un texte alternatif qui dit ce qu’elle montre (« Un clic sur Exporter ouvre le menu des formats »), et ne placez jamais une information uniquement dans les dernières images : qui voit une image fixe, la première image seulement ou rien du tout doit quand même recevoir le message.

Alternatives : image fixe, WebP animé ou vidéo

Parfois, le plus léger est de renoncer à l’animation. Extraire des images enregistre les images d’un GIF, WebP ou PNG animé — ou d’une vidéo — comme fichiers séparés : toutes les images, une sur N, une plage ou les images à des instants donnés, en JPG, PNG, WebP, AVIF et d’autres formats. Usages typiques :

• Une image d’aperçu ou de remplacement pour les programmes de messagerie qui n’affichent que la première image, ou pour un manuel imprimé.
• Une image nette pour les endroits où les animations ne sont pas admises.

Le WebP animé stocke toutes les couleurs et une transparence douce, et il est généralement bien plus léger que le même GIF. Tous les grands navigateurs actuels l’affichent ; les programmes de messagerie et certaines applications ne le font pas de manière fiable. L’Éditeur de GIF et d’animations enregistre toute animation qu’il ouvre en WebP (ou en PNG animé, APNG), et Vidéo en GIF peut écrire du WebP directement à partir d’un extrait. La comparaison des formats d’image place le WebP à côté du JPEG, du PNG et de l’AVIF.

Une courte vidéo en MP4 ou WebM est en général l’option la plus légère sur un site web. GIF en vidéo transforme un GIF, WebP ou PNG animé en vidéo avec le même minutage — en MP4 ou en WebM, selon ce que votre navigateur peut créer. Les outils vidéo demandent un navigateur récent ; voir navigateurs pris en charge.

Questions fréquentes

Pourquoi mon GIF est-il plus lourd que la vidéo dont il est tiré ?

Parce qu’une vidéo enregistre les changements entre les images avec une compression avec perte, alors qu’un GIF enregistre les pixels de chaque image sans perte et avec au plus 256 couleurs. Les prises de vue réelles et les enregistrements d’écran qui défilent changent presque chaque pixel ; le GIF doit donc presque tout stocker encore et encore.

Changer la vitesse modifie-t-il la taille du fichier ?

À peine. La vitesse change seulement la durée d’affichage de chaque image. Pour gagner de la place, réduisez le nombre d’images — en raccourcissant ou avec Supprimer une image sur N.

Les GIF animés fonctionnent-ils dans les newsletters ?

Dans la plupart des programmes de messagerie, oui. Certains n’affichent que la première image : concevez-la donc comme un message complet. La vidéo et le WebP animé sont bien moins fiables dans un e-mail.

Commencez par les outils d’animation — les plans qui comprennent l’Éditeur de GIF et d’animations figurent sur la page des tarifs — ou créez un compte gratuit. Si vous préparez des newsletters et des contenus d’aide pour vos clients, la page pour les agences montre comment les outils s’intègrent à ce travail.