13

I have been using Gifs for those small loading images. Have been working great except the occasional transparency issues and 8 bit colors. Now I found out about the APNG recently. But don't know if i should be using it. Does it have enough browser support? And what about the file size. A large gif image already has large file size...

Ruchan
  • 2,852
  • 7
  • 32
  • 68

4 Answers4

21

I think APNG is better. As it supports 24-bit and 8-bit transparency. Moreover it is also supported by browsers like Mozilla Firefox, Chrome, Safari (see https://caniuse.com/#feat=apng).

Nico Schlömer
  • 37,093
  • 21
  • 139
  • 189
user3843763
  • 239
  • 2
  • 5
  • 7
    As of March 14 2017, Chrome also supports APNG natively: https://chromium.googlesource.com/chromium/src/+/7d2b8c45afc9c0230410011293cc2e1dbb8943a7 – Augustin Mar 16 '17 at 18:27
  • 2
    As of April 29 2017, Chrome Beta adds support to animated PNG. Which hopefully will see full support of it by the time Chrome 59 is released. – Bilal Khoukhi Apr 30 '17 at 02:44
7

Animated PNG is better than GIF if we're focused on file size – achieving a smaller file size was one of the reasons the APNG format was designed. In this image comparison test data, you can see that APNG is smaller than GIF for every image.

There is more browser support now (June, 2016) than there was when this question was asked. iOS Safari now supports APNG (since version 8) – that's a pretty big user base. So you can serve APNG to Firefox desktop and Android, Safari desktop and iOS, and serve GIF to all other browsers.

Cory Dowdy has some good comparison data here, including animated webp as well.

UPDATE 2018-12-4: Chrome, Opera, and desktop Safari now support Animated PNG. This has been true for several months.

LearningFast
  • 963
  • 11
  • 12
  • The differences in file size between APNG vs GIF are only 10% though...hmmmm. I suppose reducing the total web traffic in the world by 10% would be significant. – btomtom5 Nov 30 '18 at 07:08
6

Apng is a better format. GIF and apng are both lossless, but apng tend to be smaller, and better quality (more colors, and the ability for transparency) Unfortunately apng are largely unsupported, but that may change. Hopefully apng catches on.

colt
  • 61
  • 2
  • 1
  • 2
    Ehem... GIF is not losless. For animation only supports a pallet of 256 colors per frame. – Henrik Sommerland Mar 21 '17 at 15:26
  • 3
    GIF is lossless for a 256 color image. JPEG would not be lossless even on 256 colors. But for logos with usually less than 256 colors, GIF has been used for a long time as lossless alternative, because JPEG softened the edges. – Trendfischer Jul 04 '17 at 14:18
-9

Times have changed, please see below answers!

I'd definitely stick with GIF. I hadn't heard of APNG before, but from my research now, it sure sounds like it's almost unanimously unsupported. It sounds like Internet Explorer and Chrome don't support it, and that just seems useless for most users. Even if it is supported and my research on that was wrong, it's still only the most recent version or two that would. And for something where there's a very viable alternative, I'd hardly consider that risk to be worth it. And I know for a fact that my, latest version of IE didn't work with any of the example APNG files I came across.

It might be nice in a few years when/if it catches on, but for now it's just not a good idea.

Matthew Haugen
  • 11,855
  • 5
  • 34
  • 52
  • 4
    FYI, there's more browser support now, particularly iOS Safari and Mac Safari. APNG yields smaller files than GIF, so it might be worthwhile for high traffic sites – basically, the same scenarios where people go to the trouble to serve WEBP or JPEG-XR to the subset of browsers that support those formats (Chrome, IE 11, Edge, etc.) – LearningFast Jun 19 '16 at 12:43
  • 12
    As of March 14 2017, Chrome also supports APNG natively: https://chromium.googlesource.com/chromium/src/+/7d2b8c45afc9c0230410011293cc2e1dbb8943a7 – Augustin Mar 16 '17 at 18:27
  • 6
    GIF is so limited that I'd drop it. Now all browsers support APNG. We better start taking advantage of that. – Royi Aug 28 '17 at 15:49