54 votes

Quelles sont les alternatives aux GIF animés ?

Pourquoi ces satanés GIF dominent-ils toujours le marché des images animées ? Je suis sûr qu'il existe de meilleures alternatives aujourd'hui, mais pourquoi aucune d'entre elles ne gagne-t-elle en popularité ?

38voto

Nathan Points 581

Animé png ou APNG (http://en.wikipedia.org/wiki/APNG). Ils peuvent être faits dans GIMP avec le APNG Plug-in Mais Gif animé sont vraiment le principal là - flash a pris un peu plus de bien, mais qui n'est pas vraiment une image de soi.

Aussi, d'autres solutions de rechange à partir de la même page wikipedia: La MNG format de fichier est une alternative plus puissante pour APNG, bien que de plus en plus complexes format et a moins de navigateurs web pris en charge.

Le format de fichier GIF a une meilleure application et prise en charge du navigateur que APNG, mais il est limité à 256 couleurs par image et prend en charge seulement 1 bit de transparence alpha, par la cartographie de la palette de couleurs transparentes.

SVG combiné avec l'utilisation de scripts ou SMIL peut animer des graphiques vectoriels et peut intégrer des images matricielles. (Voir SVG animation.)

Graphiques dynamiques créé avec HTML 5 canvas peuvent également être animés.

Une méthode alternative pour les animations dans les pages web est d'utiliser les classiques des images statiques et de les animer à l'aide de JavaScript,[22] Adobe Flash, Microsoft Silverlight, Java ou autre plugin technologies.

13voto

Vladimir Points 41

WebP est un format d'image qui utilise à la fois la compression avec et sans perte. Il est actuellement développé par Google.

Avantages du WebP animé par rapport au GIF animé

  • WebP prend en charge les couleurs RVB 24 bits avec un canal alpha 8 bits, alors que le GIF prend en charge les couleurs 8 bits et l'alpha 1 bit.

  • WebP prend en charge la compression avec et sans perte ; en fait, une même animation peut combiner des images avec et sans perte. Le format GIF ne prend en charge que la compression sans perte. Les techniques de compression avec perte de WebP sont bien adaptées aux images animées créées à partir de vidéos réelles, une source de plus en plus populaire d'images animées.

  • WebP nécessite moins d'octets que GIF1. Les GIF animés convertis en WebP avec perte sont 64 % plus petits, tandis que les WebP sans perte sont 19 % plus petits. Ceci est particulièrement important sur les réseaux mobiles.

  • WebP prend moins de temps à décoder en présence de recherche. Dans Blink, le défilement ou le changement d'onglet peut masquer et afficher des images, ce qui a pour effet de mettre les animations en pause, puis de les faire avancer d'un point à un autre. L'utilisation excessive de l'unité centrale, qui fait que les animations perdent des images, peut également obliger le décodeur à avancer dans l'animation. Dans ces scénarios, le WebP animé prend 0,57 fois plus de temps de décodage2 que le GIF, ce qui réduit le jank pendant le défilement et accélère la récupération des pics d'utilisation de l'unité centrale.

Inconvénients du WebP animé par rapport au GIF animé

  • En l'absence de recherche, le décodage linéaire de WebP est plus gourmand en ressources humaines que celui de GIF. Le décodage du WebP avec perte prend 2,2 fois plus de temps que celui du GIF, tandis que le WebP sans perte en prend 1,5 fois plus.

  • La prise en charge du WebP est loin d'être aussi répandue que celle du GIF, qui est en fait universelle.

  • L'ajout de la prise en charge de WebP aux navigateurs augmente l'empreinte du code et la surface d'attaque. Dans Blink, cela représente environ 1 500 lignes de code supplémentaires (y compris la bibliothèque WebP demux et le décodeur d'images WebP côté Blink). Ce problème pourrait être réduit à l'avenir si WebP et WebM partagent un code de décodage plus commun, ou si les capacités de WebP sont intégrées à celles de WebM.

https://developers.google.com/speed/webp

1voto

aporat Points 3887

J'ai utilisé un plugin JQuery pour animer une série de fichiers PNG. Voir http://blog.shynet.nl/post/2010/08/28/Alternative-to-animated-GIFs-AnimateImages-jQuery-Plugin.aspx

Je ne suis pas sûr de la performance du plugin avec un grand nombre d'images. Je ne l'ai utilisé que pour scintiller les icônes

1voto

user3766155 Points 1

Comme Nathan et d'autres l'ont répondu précédemment, il existe de nombreuses façons d'animer un graphique.

Personnellement, je préfère

(1) création du graphique dans Illustrator ou Inkscape, etc.

(2) enregistrer le graphique au format .SVG

(3) intégrer le code SVG (c'est-à-dire tout ce qui se trouve entre et ) dans votre page web et

(4) utiliser snap.svg (librairie javascript) pour animer le graphique svg intégré. La plupart des navigateurs modernes supportent le SVG

0voto

Format MNG est un format de type PNG pour les animations, mais il ne semble pas avoir gagné beaucoup de popularité. Il s'agit donc simplement d'une question d'adoption - puisque les GIF animés fonctionnent bien (et qu'ils sont exempts des anciennes restrictions liées aux brevets), pourquoi ne pas les utiliser ? Pourquoi réparer ce qui n'est pas cassé ?

Prograide.com

Prograide est une communauté de développeurs qui cherche à élargir la connaissance de la programmation au-delà de l'anglais.
Pour cela nous avons les plus grands doutes résolus en français et vous pouvez aussi poser vos propres questions ou résoudre celles des autres.

Powered by:

X