Le PNG animé compatible OS X Yosemite et iOS 8
L'Animated PNG, ou APNG, est un format d'image méconnu qui se présente comme le remplaçant « moderne » du fameux GIF animé. Techniquement parlant, l'APNG est effectivement plus performant, puisqu'il gère des images 24 bits et la transparence 8 bits. Le GIF est bien plus limité, plus ancien (les spécifications de l'APNG ont été créé en 2004) mais aussi beaucoup plus populaire grâce au support de Netscape à l'époque (un temps que les moins de 20 ans…)

L'APNG est actuellement lisible dans Firefox depuis la version 3 qui date de 2008. Safari sera aussi de la partie avec la prochaine version 8.0 du navigateur, qui sera livrée dans OS X Yosemite, ainsi que dans iOS 8. Pierre Dandumont du Journal du Lapin a réalisé cette courte vidéo de l'affichage d'un PNG animé dans la prochaine version d'OS X :
Ce support au sein des futurs systèmes d'exploitation mobile et de bureau d'Apple sonne t-il le signe du renouveau pour l'APNG ? Au vu de ses atouts (taille réduite de la bibliothèque, compatibilité avec d'anciennes implémentations du PNG), il n'est pas interdit de penser que ce format délaissé renaisse de ses cendres. Mais malgré la popularité de ses solutions, il faudra plus qu'Apple pour que le PNG animé prenne réellement, alors que le GIF concurrent, avec ses restrictions et ses limites (qui font le miel des amateurs) ne s'est jamais aussi bien porté.
A mort le Gif!
"L'APNG est actuellement lisible dans Firefox depuis la version 3 qui date de 2008"
C'est marrant ça, j'ai la version 30 sur Mavericks et l'image ne s'anime absolument pas...
Idem…
pareil !
Il était temps. Une meilleur qualité d'image, qui gère la transparence, et qui peut s'animer, c'est un pas en avant pour abandonner le gif.
La petite image ne bouge pas dans Chrome (35.0.1916.153) sur Mavericks.
Cliquez sur le lien APNG. Et ça fonctionne.
oui sur wikipedia ca marche :)
marche pas non plus avec safari 8.0 (10538.39.41) et yosemite DP2..
arf, ça y est j'ai compris, ça marche pas sur macg mais sur le site du lapin oui tout est ok
Le lien qui mène a Wikipedia, pas dans l'article, et la cela fonctionne.
"Si vous voyez cette image s'animer, c'est que votre navigateur sait lire le PNG animé."
Sauf que vous n'avez pas inclut la version APNG ;)
Ca ne s'anime pas dans macg mobile ! Une honte ! Qu'elle est donc ce site techno meme pas au niveau de la techno actuelle (2004 quand meme...)
Ok, c'est bon, je sors :p
Et le svg animé, quelqu'un sait comment en faire? (Je sais je radote) merci
@Boumy
Y a plein de tutoriels sur internet pour ça.
Un des avantages du Gifs est qu'il permet un certain flou artistique pour faire des images animés avec trucage maison ou autre, et qu'il est incroyablement léger...
Les techniques de compression ont évolué, mais difficile de rivalisé avec une image qui n'affiche qu'une palette de 250 couleurs...
@redchou
Le Gif, léger ?
Je vais souvent sur des sites de Gifs et il n'est pas rare de tomber sur des Gifs de plusieurs Mo, malgré la limite à 256 couleurs.
Maintenant, tu peux faire de l' APNG en 256 couleurs si tu veux. Qui peut le plus peut le moins.
PS: Je vous vois arriver les blagueurs !
@joneskind :
Le Gif est léger oui, quand tu sais l'utiliser et l'optimiser et que tu n'en fais pas trop :p
C'est la même chose que le Flash.
Bien utilisé et optimisé, c'est bien, mal utiliser et à vouloir trop en faire, c'est lourd et vomitif
@Strix
Le Gif c'est bien pour tirer des traits ou des objets simples, mais dès que tu passes à l'image c'est compliqué. Tu peux faire un truc animé pas trop lourd si tu te contente d'animer une portion de l'image mais un extrait de film sera toujours lourd. T'as rien pour optimiser le Gif. C'est limite de l'image Bitmap.
Et vu le poids d'une image Gif qui ne fait pourtant que 256 couleurs, je ne peux pas dire que ce soit léger.
Je parle du Gif en tant que séquence vidéo.
@joneskind :
Ah oui en temps que séquence vidéo, c'est lourd !
On peut faire des gifs animés avec des images de 256 couleurs mais aussi de 16 millions de couleurs avec les calques, etc...
On parle d'animation, animer une image fixe, un logo, mais la vidéo, ce n'est pas le l'animation...
L'encodage gif permet de rassembler les pixels de mêmes couleurs quand ils sont contigu, le bitmap non, enfin, il me semble...
Pour revenir à la vidéo, l'utilisation du gif est valable si on découpe cette vidéo avec une image pour chaque plan séquence... Mais pas si on l'utilise comme un codec de compression...
si vous parlez de "bitmap" au sens du format microsoft .bmp, oui bien sur ça se compresse avec le classique algorithme RLE.
Pour le bitmap, c'est pas obligé, si ?
Il me semble en avoir fait sans compression...
Après, la compression "RLE" doit-être plus efficace quand on ne travaille qu'avec 250 couleurs... Enfin je pense.. C'est pas mon domaine.
[Edit]
Doublon
HTML5 et CSS3 peuvent produire des “effets” assez similaires :
http://daneden.github.io/animate.css
;-)
@caissonbulle
Je suis à peu près certain qu'on pourrait aussi le faire en langage bas niveau. Mais c'est plus compliqué.
Si je ne m'abuse, les GIF sont transparents mais les PNG sont translucides... nuance ! :)
@iDanny
Tu peux préciser ta pensée ?
Je pense qu'il veut dire que le gif est transparent ou pas, il utilise un masque de transparence binaire.
Le png est translucide parce qu'il utilise un masque de valeur entre 0 et 1, une sorte de couche alpha... En gros on peut voir à travers lui, d'où l'utilisation du mot translucide...
On peut aussi parler d'opacité :-D
C'est le mot que j'avais sur la langue, mais impossible de le sortir pour trouver un explication simple... ^_^
PNG (et donc APNG) gère un canal alpha de 8bits (255 niveaux de transparence). C'EST une "couche alpha".
@oomu
C'est bien ce qu'il me semblait...
Est-ce qu'il est possible de justifier un texte autour d'un gif, comme avec un PNG ?
La justification d'un texte html autour d'une image n'a rien à voir avec le format de fichier de l'image…
@jeanba3000
Je ne parle absolument pas de la justification HTML mais de la justification autour du "plein" de l'image. Par exemple, si tu as un objet détouré dont le fond a été supprimé tu peux justifier ton texte autour de l'image. Si c'est une bouteille, ton texte sera justifié en suivant les courbes de la bouteille. C'est une fonction qu'on retrouve notamment dans Pages et que je n'ai encore jamais vu ailleurs.
On va avoir un fichier 3x plus lourd donc aucun intérêt alors qu'on se bat pour éliminer les Ko superflus
à résultat égal, png est meilleur que gif
c'est Mieux, c'est + puissant, c'est MIEUX, et c'est hmm.. MIEUX, quelque soit l'angle pris. Genre, économiser du courant ? png c'est mieux (le faible coût de la compression png est largement compensé par les gains en tailles)
On se bat pour éliminer le gaspillage, on a donc fait PNG. A qualité égale, png est MIEUX. Quand je dis mieux, je veux dire MEILLEUR et SUPERIEUR et PREFERABLE.
-
y a eu beaucoup de blocage pour rendre la variante animée de png populaire (lire les débats et bugs autour de mng par exemple, c'est un roman, une saga digne des plus grandes tragédies épiques, au moins)
mais ce n'est pas sans raison si dans les années 90 gif était utilisé pour des images fixes des sites webs (icônes, etc) puis rapidement balayé par png. Pas de tentative de faire payer l'usage de gif (brevets gratuits, normes ouvertes) et surtout meilleur techniquement sur tous les plans.
"à résultat égal, png est meilleur que gif"
parfois non.
PNG est très bien mais c'est un format complexe qui comporte plein de subtilités permettant d'améliorer son niveau de compression. Un logiciel nommé ImageOptim offre une interface graphique à des outils en ligne de commande permettant d'optimiser au mieux cette compression. MacG en a déjà parlé mais ne l'utilise visiblement pas.
Par exemple sur le logo de MacG (en haut au centre de chaque page), le poids est diminué de 12,5% sans aucune perte de qualité.
PNG supporte aussi l'alpha sur des images avec palettes. C'est très utile pour les images avec peu de couleurs où l'alpha est utilisé principalement pour avoir un antialiasing propre quel que soit le fond. Toujours avec le logo de MacG qui est en 24-bit, on peut le passer sans problème en 256 couleurs + alpha. La différence est invisible (d'autant plus que le logo est en HiDPI ou "Retina") et le poids du fichier est alors diminué de 2 tiers.
Un logiciel pour convertir simplement les PNG 24-bit en PNG avec palette + canal alpha : ImageAlpha, du même auteur que ImageOptim.
Des infos sur le support navigateur, le fonctionnement, des exemples... : http://calendar.perfplanet.com/2010/png-that-works/
Je pensais que cette année . Les clients d'Apple auraient un IOS ou les icônes s'animeraient sur leurs écrans .
De même sur le nouvel OS Yosimte
@Link1993 si si cela s'anime même dans igeneration ... Mais avec ios8beta2 ;)
Du coup les anim' en PNG sont beaucoup plus légères ?
A quoi ça sert les gifs et autres bidules animés, à part transformer des sites en sapins de Noël ?
Ce n'est qu'un outil, il n'est pas responsable de l'usage qu'on en fait, libre à toi de faire comme d'autres pour en inventer de plus judicieux et créatifs…
C'est comme Flash, ça a donné des horreurs, mais ça a aussi donné de petits bijoux…
@marc_os
Le Gif permet de créer des boucles de séquence, à l'image d'un sample. Du coup tu peux t'en servir pour exprimer beaucoup de choses.
vas faire un tour sur giphy.com pour te faire une idée. Y en a pour tous les goûts.
Pour ma part, les Gifs qui bouclent sont les plus intéressants, parce qu'ils partagent ce point commun avec les phénakistiscopes (j'ai du googler pour retrouver ce mot imprononçable, mais on sait tous ce que c'est - des images dessinées sur un disque)