Aller au contenu

Comparaison

GIF ou vidéo ? GIF, MP4/WebM et WebP animé pour les animations courtes

GIF ou vidéo pour une animation courte ? Poids, couleurs, son, lecture automatique et e-mail comparés — et quel format choisir pour site, newsletter ou chat.

GIF ou vidéo ? GIF, MP4/WebM et WebP animé pour les animations courtes

Pour une animation courte sur un site web, une vidéo MP4 ou WebM muette et en boucle est en général le meilleur choix : elle est le plus souvent bien plus légère que le même GIF et affiche toutes les couleurs. Le WebP animé se situe entre les deux — un fichier image en couleurs complètes, avec transparence, que tous les grands navigateurs actuels affichent. Le GIF reste le format des endroits qui ne lisent pas de vidéo et n’affichent pas forcément le WebP : newsletters par e-mail, beaucoup d’outils de messagerie et de tickets, et les systèmes de documentation qui n’acceptent que des images.

Cette comparaison examine les candidats — GIF, vidéo MP4/WebM, WebP animé et, brièvement, PNG animé (APNG) — selon le poids, la qualité, les couleurs, le son, la lecture automatique et la prise en charge, et montre comment passer de l’un à l’autre dans votre navigateur. Elle décrit les formats de manière générale ; le poids réel dépend toujours du contenu et des réglages.

GIF, vidéo, WebP animé et APNG en un coup d’œil

CritèreGIFVidéo MP4 / WebMWebP animéAPNG
Couleurs256 par imageToutes les couleursToutes les couleursToutes les couleurs
TransparenceTout ou rienEn pratique aucuneCanal alpha completCanal alpha complet
CompressionSans perte, palette limitéeAvec perte, entre les imagesAvec ou sans perteSans perte
Tendance de poidsLourdEn général le plus légerEn général bien plus léger que le GIFSouvent lourd
SonNonPossibleNonNon
Se comporte commeUne image qui démarre seuleUne vidéo : lecture auto, commandes, pauseUne image qui démarre seuleUne image qui démarre seule
Sites webPartoutPartout, avec le bon balisageGrands navigateurs actuelsGrands navigateurs actuels
E-mailLargement affiché, parfois seulement la première imageRarement luePas fiablePas fiable

Poids et qualité : pourquoi la vidéo est en général bien plus légère

La différence tient à la façon dont chaque format compresse le mouvement. Le GIF compresse chaque image sans perte, avec une palette d’au plus 256 couleurs ; un encodeur peut ne stocker que la zone modifiée, mais chaque pixel modifié est enregistré en entier. Les codecs vidéo comme H.264, VP9 ou AV1 prédisent chaque image à partir des précédentes et n’enregistrent que la différence restante, avec perte. Pour une prise de vue réelle ou un enregistrement d’écran qui défile, une vidéo est ainsi en général bien plus légère — et plus belle.

La qualité diffère aussi. Le GIF doit traduire dégradés et tons chair en motifs de points. La vidéo affiche toutes les couleurs, mais peut flouter un texte net et des traits fins avec un réglage de qualité bas. Le WebP animé peut être sans perte pour des graphiques d’interface ou avec perte pour un contenu proche de la photo, et il conserve une transparence douce. L’APNG est sans perte et en couleurs complètes — propre, mais souvent lourd ; il convient mieux à de petits graphiques transparents qu’à des prises de vue. Les formats eux-mêmes sont comparés dans WebP, AVIF, JPEG ou PNG.

Lecture automatique, boucles et son sur un site web

Un GIF ou un WebP animé se comporte comme une image : il démarre dès son chargement, tourne autant de fois que le fichier le prévoit, et le lecteur n’a pas de bouton pause. Une vidéo est un élément que vous maîtrisez. Pour une boucle façon GIF, le balisage habituel est une vidéo muette qui démarre seule — les navigateurs n’autorisent en général la lecture automatique que sans son :

html
<video autoplay muted loop playsinline poster="demo-poster.jpg" width="640" height="360">
  <source src="demo.webm" type="video/webm">
  <source src="demo.mp4" type="video/mp4">
</video>

muted rend la lecture automatique possible, playsinline évite que les téléphones ouvrent la vidéo en plein écran, et poster affiche une image fixe jusqu’au démarrage — Extraire des images en crée une. Ajoutez controls ou votre propre bouton pause quand la boucle dure plus de quelques secondes : le critère de succès 2.2.2 des WCAG 2.2 (niveau A) demande un moyen de mettre en pause, d’arrêter ou de masquer un contenu en mouvement qui démarre automatiquement, dure plus de cinq secondes et s’affiche à côté d’autres contenus — voir Understanding « Pause, Stop, Hide » sur w3.org (en anglais).

E-mail, messagerie et documentation : là où la vidéo ne passe souvent pas

Hors de votre propre site, c’est le programme du destinataire qui décide de ce qui est lu :

  • Newsletters par e-mail. La vidéo est rarement lue dans un programme de messagerie, et le WebP animé n’est pas fiable non plus. Un GIF animé est largement affiché, même si certains programmes n’en montrent que la première image. Gardez-le léger, placez le message dans la première image, ou utilisez une image fixe qui mène à une page avec la vidéo.
  • Messageries. Beaucoup acceptent les GIF et les courtes vidéos, mais elles peuvent convertir ou recompresser ce que vous envoyez ; le comportement varie selon l’application et change avec les mises à jour.
  • Documentation, wikis et systèmes de tickets. Beaucoup acceptent les images mais pas la vidéo, ou ne lisent la vidéo que par un lecteur intégré. Un court GIF fonctionne partout ; là où la vidéo est acceptée, elle est plus légère.
  • Votre propre site ou boutique. Vous maîtrisez le balisage : une boucle MP4/WebM muette ou un WebP animé vaut en général mieux qu’un GIF — une démo de produit sur une page de boutique se charge plus vite en courte vidéo.

Convertir entre GIF et vidéo dans le navigateur

SchweizerIMG propose un outil pour chaque sens. Les deux fonctionnent dans votre navigateur : la vidéo et les images sont traitées sur votre appareil et jamais téléversées — voir la page sécurité.

  • Vidéo en GIF transforme un court extrait en GIF, WebP ou PNG animé (APNG). Choisissez la partie (début et fin en secondes), les images par seconde, la largeur — vide : celle de la vidéo, 480 pixels au maximum –, la vitesse et le nombre de lectures. Pour le GIF, les réglages du format fixent couleurs, tramage et palette.
  • GIF en vidéo convertit un GIF, WebP ou PNG animé en vidéo MP4 ou WebM avec le même minutage. Automatique choisit MP4 (H.264) si votre navigateur peut le créer, sinon WebM. Réglez une qualité ou un débit, le nombre de répétitions de l’animation dans la vidéo et l’arrière-plan des zones transparentes — les vidéos ne contiennent pas de transparence.
  • L’Éditeur de GIF et d’animations raccourcit, recadre, redimensionne et allège une animation qui doit rester un GIF — voir réduire la taille d’un GIF.
  • Extraire des images enregistre des images isolées d’une vidéo ou d’une animation, pour une image d’aperçu ou une image de remplacement dans un e-mail.

Les outils vidéo demandent un navigateur récent capable d’encoder et de décoder la vidéo (WebCodecs). Les formats qu’il peut créer varient d’un navigateur à l’autre, et le WebM est utilisé là où le MP4 n’est pas disponible — voir navigateurs pris en charge. Les tâches vidéo s’exécutent l’une après l’autre. La durée maximale d’extrait lue par les outils vidéo dépend du plan ; les plans qui comprennent Vidéo en GIF et GIF en vidéo figurent sur la page des tarifs.

Comment choisir le bon format

  • Visuel d’accueil ou démo de produit sur votre site : une boucle MP4/WebM muette avec image d’aperçu.
  • Petite boucle d’interface sur votre site : une vidéo, ou un WebP animé s’il faut de la transparence ou un comportement d’image.
  • Newsletter par e-mail : un petit GIF avec le message dans la première image — ou une image fixe qui mène à la vidéo.
  • Messagerie, tickets et wikis qui n’acceptent que des images : un GIF, raccourci et avec peu de couleurs.
  • Animation sur des fonds changeants : WebP animé ou APNG ; le GIF donne des bords durs, la vidéo aucune transparence.
  • Tout ce qui a du son : une vidéo — aucun format d’image ne transporte l’audio.

Questions fréquentes

Le MP4 est-il toujours plus léger que le GIF ?

Le plus souvent, pas toujours. Pour une prise de vue réelle ou un enregistrement d’écran, la vidéo est en général bien plus légère. Une minuscule animation d’icône avec quelques images en aplats peut être tout aussi légère en GIF. Convertissez et comparez : le résultat montre quel fichier est le plus léger.

Puis-je mettre une vidéo MP4 dans une newsletter ?

Vous pouvez la joindre, mais la plupart des programmes de messagerie ne lisent pas une vidéo dans le message. La solution habituelle est un GIF animé, ou une image fixe qui mène à une page avec la vidéo.

La conversion d’un GIF en vidéo conserve-t-elle la transparence ?

Non. Les vidéos créées avec GIF en vidéo n’ont pas de transparence : les zones transparentes sont remplies avec la couleur d’arrière-plan choisie. Si vous avez besoin de transparence, gardez l’animation en WebP ou en APNG.

Pourquoi ai-je obtenu un fichier WebM au lieu d’un MP4 ?

Avec Automatique, l’outil crée un MP4 (H.264) si votre navigateur le peut, sinon un WebM — tous les navigateurs ne savent pas encoder le H.264. Le WebM est lu par les versions actuelles des grands navigateurs ; s’il vous faut un MP4, essayez un autre navigateur.


Ouvrez les outils d’animation, consultez les formats d’image pris en charge, ou créez un compte gratuit.

Information générale

Cette page est une information générale et un contenu marketing. Elle simplifie les formats GIF, WebP, APNG, MP4 et WebM, les règles de lecture automatique des navigateurs et les critères de succès des WCAG 2.2 ; la façon dont navigateurs, programmes de messagerie et applications traitent les animations varie selon les programmes et les versions et évolue avec le temps. Pour un contrôle technique ou d’accessibilité de votre site ou de votre newsletter, adressez-vous à un professionnel qualifié.

Choisissez l'approche qui garde vos images privées.

Commencez gratuitement et traitez vos images sans les téléverser.