Presenting APNG: Like MNG, Only Better

An anonymous reader writes "It's fair to say that most people love PNG images (or at least hate GIFs). However, the one advantage GIFs have over PNGs is that they can be animated. There is, of course, an animated version of PNG, MNG, but few programs can view these images (mainly because the MNG decoder is so large that the likes of Mozilla refuse to include it). But there may be an answer coming: Vladimir Vukicevic and Stuart 'Pavlov' Parmenter (of Mozilla fame) have put together a specification for APNG (Animated Portable Network Graphics)." (Read more below.)

"Unlike MNG, APNG is not a separate file format, but rather an extension to PNG. Thus, APNG images are just normal PNG images (with the .png extension) but can be animated. The system is fully backwards-compatable, so any program that can open a PNG image will be able to open an APNG image (though non-APNG viewers will only show the first frame). Vitally, the decoder just adds an extra few kilobytes onto a standard PNG decoder. APNG support is in the process of being checked into Mozilla. Hopefully, other programs will follow suit."

Comments

Too bad we can't use it

[Anonymous Coward]

IE won't support it until 2012, and even then, it'll only support half the features.

Re:Too bad we can't use it

[Daniel Ellard]

IE won't support it until 2012...

Sarcasm aside, this is a valid point. If IE doesn't support it, most authors won't use it on their web pages, and there aren't any IE updates scheduled any time soon...

Re:Too bad we can't use it

[Ark42]

If you don't want to use the ugly IE5.5+ hack for alpha PNGs, you can at least set the background color setting in the PNG, which IE will use to blend into. I think you can set the background color tag from a pngcrush command line parameter if your software doesn't support that feature.

For example alpha-msg.png should show a message written in magenta (the background color) if your browser blends using the background color of the PNG instead of the background color of the page. If your background color is white, you won't see any message if you are using Mozilla/Firefox/Opera. If you put that image in a div with a white background and use a IE5.5+ alpha hack of some sort, the image's message actually makes sense too.

The burning question is...

[whiteranger99x]

how soon will such functionality be implented in major graphic manipulation programs like Photoshop?

Oh, and yeah, I'm sure someone will make it work with The Gimp, so don't flog me over that detail. :P

It's all about Microsoft

[screwedcork]

Microsoft holds the power in their hands as to what file formats become standards. Hopefully they'll make the right decision...

WIP

[Mekabyte]

Discussion can be found here: http://bugzilla.mozilla.org/show_bug.cgi?id=257263

Don't hate it

[andyrut]

It's fair to say that most people love PNG images (or at least hate GIFs).

Now that Unisys's patent has expired across the globe, I certainly don't hate GIFs.

Re:Don't hate it

[Anonymous Coward]

Why not? They're generally bigger than PNG, don't support 24-bit color, 8-bit transparency, etc.

Re:Don't hate it

[bofkentucky]

Can someone mod the parent down, PNG and Gif are both lossless (If you are talking about a 256 color (8 bit) palette.

Re:Don't hate it

[X_Caffeine]

Why not? Alpha blending allows web developers to make fine adjustments to page layouts with necessitating the "recutting" of overlapping layers in Photoshop. It also allows for variance in browser layout without causing visible breaks -- thus Mozilla and KDE don't need to render "exactly" like MSIE down to the last pixel in order for layouts to basically look the same.

GIF is gunk. Can we step into the 21st century yet?

Re:Don't hate it

[david.given]

and btw, i never knew gifs could support more than 256 colors.

It's a very neat trick. I remember marvelling at it the last time it came round.

It works because each frame in an animated GIF has its own palette --- but that palette doesn't have to match the palette in the other frames. So the first frame draws the first 256 colours, then the second frame draws the next, etc. The test image has been slowed down so you can see it load.

Of course, it's not actually useful --- the resulting image is far larger than, say, the PNG version --- but it's a clever hack anyway and I wish I'd thought of it...

Re:Don't hate it

[mgv]

16,777,216 != infinity :-)

Actually, there is no point getting an infinite number of colours because:

1) Most displays cannot show that many colour
2) Even with a display that does 16 777 216 colours, the human eye cannot distinguish between that many shades (particularly in the blue region) which is why 16 bit colour (which has 5 + 6 + 5 bits to divide amongst the red, green & blue) puts the extra information into the green (I think, could also be red, but its never the blue)

3) Most RGB displays, while they have gradations finer than the eye can distinguish, cannot show the full spectrum in width (from 400nm to 700nm wavelengths). You can put as many bits as you want on to any consumer display, there are colours it simply cannot do.

4) Humans vary in their ability to see colour, making alot of the finer gradations imprecise. 8% of males have altered colour vision - as do a small percentage of women and those bits are really wasted on them. On the other hand, if you have had cataract surgery, the implantable lens will let in low end ultraviolet (which your retina can see) that our natural lens does not allow through. Not that I'm suggesting that it is good to see into the UV range :)

My 2c worth

Michael

Re:Don't hate it

[damiam]

The point is that it's not possible to do that in a GIF without animation, so anything >256 colors would have to be animated. I think it's fair to call that a hack.

Re:Don't hate it

[Jah-Wren Ryel]

A more correct term is idempotent - take the output of a process (e.g. image compression), use it as the input for the next iteration of the exact same process and you will still get the exact same output. Repeat ad infintum. So, gif/png compression is idempotent. JPEG is not idempotent.

Not to be confused with omnipotent which means the ability to get anything -- male, female, animate, inanimate -- pregnant. If you're omnipotent, the condom gets pregnant.

Re:Don't hate it

[canavan]

the human eye cannot distinguish between that many shades (particularly in the blue region)

While it may seem counterintuitive, the human eye is much better at discriminating between shades of blue than between red or green (where it is worst by far). There's a nice graph showing the MacAdam ellipses that represent the amount of variation in chromaticity where no difference can be percieved in this paper. This is obviously different from the responsiveness to brightness.

16 bit color representaion usually has the 6 bits for green.

For most people, 8 bit per RGB component on an linear scale, as used in almost all computers, is not enough - you can still see some banding. A logarithmic scale or 10 bit color can fix this.

Animations

[Seft]

Haven't they realised that animated GIFs only serve to irritate?

Good to hear

[cyxxon]

Well now, this sounds really nice. I have always wondered why MGN never really took off, but then PNG never really took off either (you all know the MSFT story...). Just never knew this had a big-decoder-problem.

So naturally I was disappointed when Mozilla took out MNG support back then, but this seems to make it better (read: more chances of survival in the real world out there) standard, and that is always a good thing.

One more reason to finally get rid of all them GIFs, even if they are no longer patent-encumbered - the format is still not capable of alpha transparency...

Re:Good to hear

[bluephone]

Pretend "APNG" is spelled "GIF04" and your solution is here. No, it wouldn't be easier, because your suggestion is essentially creating a new format (been done) and just CALLING it a new GIF format.

We don't like bloat now do we

[Rosco P. Coltrane]

the MNG decoder is so large that the likes of Mozilla refuse to include it

Yeah, and a damn good thing too, otherwise we'd have a browser that's so huge and bloated that...

Nevermind...

Stupid Question

[slyckshoes]

This is probably a stupid question, but what are animated gifs used for besides online ads? It seems to me that the animated gif is now an endangered animal found only in annoying online ads, or annoying web-pages that were put together by someone with a rudimentary knowledge of HTML and a free CD of clip-art (or images that they stole from another unattractive site). I would not be sad to see animated gifs (or apngs) disappear entirely. If someone can post a good use of apgns/gifs for which a better solution does not exist, I will humbly retract my opinion and we can all consider this to be have been, indeed, a stupid question.

Re:Stupid Question

[carambola5]

Weather radar loops. Rather than have the client dl multiple jpegs and sequence them with javascript (eww, javascript), the client need only download a single apng.

For an example, check out weather.com's "map in motion" for your locale. Then, check the source of the page. Much cleaner to simply have an <img> tag.

Re:Stupid Question

[iabervon]

Go to about:config, find image.animation_mode, and set it to "no". I actually set mine to "once", which means that I see animated images if I'm actually watching; I generally iconify the browser and do something else while pages load, so I miss all the ads, but I can actually watch a weather image if I want. As far as I can tell, there's no documentation for this anywhere.

Define "better solution"

[Jonathan]

Java? Flash? I've seen lots of animated gifs in educational contexts -- showing how changing parameters affects a curve, for example. Yes, Java and Flash can be used, although they tend to be sluggish to load and crash browsers not infrequently,

Re:MNG is being checked out of Firefox

[CRCulver]

MNG is being discontinued, as are a lot of features including the Javascript Console. "Bloat", they calls it.

Not to worry, though. Nearly everything that is taken out of the Firefox core can be reimplemented as an extension. I know I've been loving my Mozilla Calendar, and Web Developer extensions. There's no reason that the Javascript Console can't just become a plugin.

animated?

[carpe_noctem]

However, the one advantage GIFs have over PNGs is that they can be animated.

Surely I am not the only one here to disagree with this statement.... !

Bad "most people" generalization

[enosys]

The story begins with: "It's fair to say that most people love PNG images (or at least hate GIFs)." No, it's not fair to say that; it's wrong. Most computer users don't even know the difference and don't care as long as they can see the image. Most people don't know about the GIF patent issues and anyways GIF is now free. Plus why hate a file format? If you really want to hate something then hate what Unisys did.

Why I don't use PNG

[pez]

Web developer has been my full-time job since 1995, and I have tried *so many times* to switch to PNG. And every single time, I slowly (and unfortunately) end up reverting back to GIF.

The two reasons that PNGs are unsuitable for large-scale use are:

* MSIE support sucks. It is getting better, but it still sucks (yes, I know this is a Microsoft issue not a PNG issue, but I'm not trying to place blame here.)

* Gamma value variation. Look at a PNG on one browser, and the blue value will match #0000CC, but look in another browser on another OS, and IT WON'T! Talk about maddening... this is one situation where the extra control by having the ability to specify a gamma value is a curse, not a blessing.

Yes, I know there are workarounds for both of thses issues. But the fact that they are both fatal flaws, and both have to be worked around, makes PNGs unusable for every-day use.

Re:Why I don't use PNG

[jesser]

MSIE support sucks. It is getting better, but it still sucks

I don't see how MSIE's lack of alpha-transparency could stop you from using PNGs, since you use GIFs now.

Re:Why I don't use PNG

[typhoonius]

* MSIE support sucks. It is getting better, but it still sucks (yes, I know this is a Microsoft issue not a PNG issue, but I'm not trying to place blame here.)

The only PNG features IE doesn't support are 8-bit transparency and animation.

Obviously, GIFs don't give you a full alpha channel either, so the first feature is moot. IE supports 1-bit transparency in PNGs, which puts them on par with GIFs.

PNG animation is a mess (when Mozilla leaves MNG support out because it's too bloated, you know something's wrong), but that a problem APNG hopes to solve. Remember that IE is being worked on again, so who knows? It has a chance of being implemented (certainly moreso than MNG does, anyway).

* Gamma value variation. Look at a PNG on one browser, and the blue value will match #0000CC, but look in another browser on another OS, and IT WON'T! Talk about maddening... this is one situation where the extra control by having the ability to specify a gamma value is a curse, not a blessing.

PNGCrush and PNGOut both get rid of the gamma value. You should run all your PNGs through one of those programs anyway to get the smallest file size, so it's a minor issue. Otherwise, get rid of it manually with TweakPNG.

It sounds like a lot of work to process a single image, but spending time shrinking download time is something web designers have been doing for over a decade (although I know a lot of people are lazy in the broadband age; it really isn't much more work, though, once you get into the habit of doing it and write some scripts to automate most of it, and it's worth it for the smaller file sizes and the 24-bit color).

Re:Why I don't use PNG

[david.given]

The same can't be said for PNGs without verifying each of them by hand. That's the fatal flaw to which I speak -- it's just too damned hard to use them for the types of images they're supposed to be used for.

The only thing I can think of is that the software you're using to save your PNG files must be horribly broken. It should be giving you the option to save the gamma value or not --- for what you want, you want not. The Gimp has a whole dialogue it pops up whenever you save a PNG file asking you what extra information you want to save; resolution, creation date, gamma, etc.

To remove the gamma chunk from someone else's files, try this:

sng $1
grep -v gAMA $1 > gammaless-$1
sng gammaless-$1

...although if you've been converting them to GIFs, you've probably been editing them.

Two Uses of Flash

[GeekDork]

There are only two valid reasons to include Flash in a web document: sound (for which there should be a global setting in the Flash plugin) and stick fights (SVG anyone?). Everything else does nothing but reduce useability and accessibility. The absolute kicker are flash intros with the skip button embedded instead of a normal link.

And: what do you need flash or MNG/APNG for if all you want is a red/green-annoyance? To make really good fakes of Luna GUI elements?

They'll develop a DRM encumbered one..

[cbreaker]

They'll probably come out with the "WMG" format which you will have to pay for a license to sign your own images. Users that visit your site will contact a Microsoft server and ask if it's okay to decode the images. Only IE will work with this system.

The official press release would be something like "We feel that this new open (to IE) format will provide the much needed protection against web site theft and give necessary control to Microsoft over your own content."

Would it surprise you?

MNG as a format

[Anonymous Coward]

MNG is as far as I can see the _only_ format suitable for an Amiga-DPaint-workalike in this day and age (no good one exists today except for the astronimically-priced Windows TVPaint/Mirage, and that is a direct descendant of Amiga TVPaint).

APNG looks too lightweight, missing many features necessary to replace the ancient (but still in use!) Amiga-IFF-ANIM. Sure, it's a replacement for shitty animgifs. But can it replace the Amiga-IFF-ANIM7 roughs for a feature-length cartoon?

Yes, much of the industry now uses vector animation (i.e. macromedia's stuff), but bitmapped animations are much easier to seamlessly integrate with bitmapped digitised film. Want a(nother) open source killer app? Take the cinepaint/gimp engine, add a dpaint-like interface and MNG support and lots of bitmap-animation-creation-and-editing features, and several animation companies I know can finally lose their old big-box Amiga stockpiles...

Microsoft Extended Sequential Series

[slashname3]

Microsoft recognizes that a new animated image format was needed (after seeing it mentioned on /.). As such they have announced the release of a new standard, Microsoft Extended Sequential Series (MESS).

MESS will be incorporated into Longhorn and will be one of the major enhancements to the Microsoft operating system. The MESS graphics format will permit content providers to render highly complex images on a users system. The MESS format allows use of Active X components which permits all kinds of interesting effects on a users system.

When asked about using existing standards executives at Microsoft responded that no other standard in this area exists. Patents have been applied for covering this novel concept and will be agressively defended. Anyone trying to duplicate the intelectual property of Microsoft would be better off using MESS as long as they pay the royalties due Microsoft or they may find them selves in an even bigger MESS.

Executives were then asked about possible security implications of the new MESS protocol. Executives replied that security is a number one priority and that an updated SP3 patch is currently in the works that will address all security issues. The only thing holding up SP3 release is final release of SP2 patch 1 that is needed to address security issues caused by various linux distributions.

Header size

[maxence]

the one advantage GIFs have over PNGs is that they can be animated

Another advantage GIF has over PNG is its smaller header size which makes small images lighter. A typical 16x16 GIF icon weighing about 100 bytes will translate into a PNG of 200 bytes or more.

That may sound like nitpicking but it can still matter, for example when transferring images to mobile phones.

Re:Header size

[Anonymous Coward]

You're exaggerating a little, I think.

Experiment #1: 1x1 white pixel. Results: GIF 35 bytes; PNG 67 bytes.

Experiment #2: typical Slashdot icon resized to 16x16. Results: GIF 282 bytes; PNG 277 bytes.

I don't see the header size making a huge difference. What does make a moderate difference is that PNG is not bound to 256 colours. You can use a 16-colour palette, in which case pixels are packed in 4 bits each. You can use a 4-colour palette, in which case pixels are packed in 2 bits each. Pixels can be of many different depths between 1 bit and 48 bits. GIF does not have this flexibility.

This is important because icons very rarely use more than 16 colours. PNG gives a win in these cases.

Re:Why wasn't animation included in the first plac

[sppavlov]

APNG files _are_ PNG files. We didn't create a whole new format (since that would be silly) so APNG files will still be .PNG files. The first frame in an APNG file looks to current PNG decoders to just be a regular PNG. The APNG spec specifies some additional chunks that if found tell an APNG aware decoder how to find the rest of the frames.

Re:An unfortunate hack

[sppavlov]

We are changing the format of APNG so that all the frames live inside of a single IHDR/END. This should resolve any problems you might have. v0.3 of the spec (should be out tomorrow) will have these changes.