Hacker Newsnew | comments | ask | jobs | submitlogin
The PNG image file format is now more popular than GIF (w3techs.com)
176 points by MarionG 440 days ago | comments


ChuckMcM 440 days ago | link

And this particular circle is complete.

Of course the patents that were the heart of such controversy are now expired so GIF code is no longer 'not-open' but it has a bad reputation so we don't play with it any more :-).

I like PNG though, the library development, while a bit rocky at first, matured quite nicely and about 5 years ago crossed the point where enough people took the time to figure out how to use it that is dropped into everything that dealt with images. That has been pretty handy.

-----

eli 440 days ago | link

Yup, great point. I think if there weren't patent concerns over GIF years ago, there wouldn't have been nearly as wide support for the format, which means far fewer people would be using it today.

-----

ben0x539 440 days ago | link

Sounds like there's need for a startup that fakes patents for obsolete file formats to create pressure for the industry to switch to technically superior alternatives. Who wants to fund me?

-----

ChuckMcM 440 days ago | link

You should patent that idea.

-----

monsterix 440 days ago | link

Wonder what happened to the WebP format from Google? Last when I tried using it, there were no nice image converters that would convert my PNGs into WebP properly.

Any live websites using it?

-----

ahoge 440 days ago | link

Mozilla is still against it. Makes me kinda angry, actually. They killed MNG/JNG, because it added like 100kB to the installer and because we should just use Flash instead (seriously). It's now a decade later and we still don't have a lossy RGBA format.

If quantized PNG8s aren't good enough, you can only use gigantic PNG32 files, which are over 5 times larger than JNG or WebP files. I've seen websites which were over 5MB thanks to that limitation. It's ridiculous.

I wish they had at least kept JNG. It's a fairly simple JPG/PNG mashup format. If you already use JPG and PNG libraries, supporting JNG won't add much weight.

-----

monsterix 440 days ago | link

Actually this is a non-issue. You could always implement comma separated image fallbacks[1]:

background-image: image("wavy.svg", 'wavy.png' , "wavy.gif"); and so on...

It seems that Google lowered emphasis on the project, or is still working on it behind-the-scenes. I'd much prefer to have 'less of images' moving over the web (without cutting back on visuals, you know) and save precious bandwidth.

[1] http://dev.w3.org/csswg/css3-images/#image-fallbacks

And then the fact that Google Chrome has over 30% market share. Makes sense to promote WebP.

-----

ahoge 439 days ago | link

That only works for background images. Plus, the UA will send a request for the webp image even if it can't read the format. It needs the mime type to figure that out.

-----

monsterix 437 days ago | link

Ah yes. Then probably paste image raw data in the second fallback image? Though I do agree with you that something which benefits the web should be adopted across the board.

-----

pornel 440 days ago | link

We do have lossy RGBA that works in all browsers since IE7 (and degrades well in IE4+):

http://pngquant.org http://tinypng.org

And while it's not as good as WebP, it's 20% of the filesize you get from Photoshop.

http://pngmini.com/vs-webp/

-----

ahoge 439 days ago | link

256 colors (well, 256 RGBA tuples) aren't always enough. Just look at the kind of images used by those heavy parallax websites.

Larger photo-based images will always look terrible, no matter which kind of dithering is used.

-----

pornel 439 days ago | link

Parallax websites are actually easy, because images are divided into many sprites/layers, so there's many palettes to work with.

I've got a pretty large collection of PNGs to test quantisation on and 68% of them end up converted in great quality, 89% are within acceptable range. It's about double of what you can get with Fireworks.

And for images that can't absolutely fit in 256-colors there's a hack for lossy true-color PNGs that can reduce size by 20-40%: https://github.com/pornel/mediancut-posterizer

-----

snogglethorpe 440 days ago | link

WebP seemed fairly pointless; its advantages over existing formats were slim, it had some disadvantages, and lacked any compelling new functionality (e.g. good HDR support). Basically it was pretty "meh."

Given the huge effort required to get any sort of widespread adoption of a new format—and without widespread adoption there's little point unless you've got some unusual features (which WebP didn't)—I'm not sure there was ever much chance WebP would go anywhere.

I'm generally no fan of Microsoft, but MS's new image format, JPEG XR†, seems vastly superior to WebP in almost every way... and it actually does have compelling new features.

http://en.wikipedia.org/wiki/JPEG_XR

-----

salmanapk 440 days ago | link

>JPEG XR†, seems vastly superior to WebP in almost every way

No animations duh.

-----

duaneb 440 days ago | link

Is that really a problem? I would much prefer animated gifs never existed.

-----

derleth 440 days ago | link

http://www.reddit.com/r/Cinemagraphs/

-----

snogglethorpe 439 days ago | link

Boy, huge loss there... ><

-----

derleth 438 days ago | link

Yes, it would be a big loss.

-----

maxst 440 days ago | link

> Any live websites using it?

Even google isn't using it on thier websites. That says a lot.

-----

monsterix 433 days ago | link

There you are:

http://blog.chromium.org/2013/02/using-webp-to-improve-speed...

An official update from Google.

-----

twodayslate 440 days ago | link

Now if only animated pngs were more supported

http://caniuse.com/apng

-----

gue5t 440 days ago | link

Webkit's stance is basically "we're only doing it if upstream libpng supports it" (because APNG support basically requires a couple hooks in libpng itself) but the libpng devs refuse to accept the patch for apng support because they are of the opinion that libpng should process only PNG, not derivative formats, which is what they consider APNG.

-----

UnoriginalGuy 440 days ago | link

In fairness I can see it from the libpng guy's perspective. It will make their library larger and potentially less fit for a certain purpose.

Why hasn't someone forked libpng, added the apng patch and then made it available for WebKit? Then everyone is happy. Just needs a middle-man.

-----

maxst 440 days ago | link

No need to fork libpng. Currently, vanilla libpng and apng patch are both hosted on sourceforge, and it's trivial to automatically download both and apply the patch. In fact, a few distros (Arch, Gentoo, Mandriva, FreeBSD) already do exactly that for their libpng packages.

But keep in mind that apng patch only adds a few functions to libpng API, and it's entirely up to applications to actually use those API calls to request extra frames.

-----

rkuykendall-com 440 days ago | link

Because then the upkeep and maintenance of the PNG library for webkit relies on a middle-man.

-----

eggspurt 440 days ago | link

At the PNG Group we designed the MNG format for animated images, see http://en.wikipedia.org/wiki/Multiple-image_Network_Graphics

-----

maxst 440 days ago | link

I remember you guys wanted to create simplified MNG 2.0, without stuff like MAGN and delta-PNG. What happened to it?

-----

eggspurt 440 days ago | link

Honestly, I tuned out. Animations are procedural and are best represented with a scripting language - not with a declarative image format. Resource-constraining javascript within an (i)frame is probably a better way to spend a browser developer's time.

-----

zevyoura 440 days ago | link

This is true for the majority of animations, but .gifs have come to serve a niche for short video content sans audio that they uniquely fulfill on the web. If APNG or MNG or whatever could replace huge animated .gifs for things like r/cinemagraphs I'd be thrilled.

-----

eggspurt 439 days ago | link

Having seen animated gifs, I can assure you that mngs (pronounced as mings) would be likewise huge. It's better to just have a 1-line JS script do this, and a standard for sandboxing nonthreatening JS.

-----

maxst 439 days ago | link

But you can't upload that 1-line JS script to imgur.

Animated GIFs are getting very popular again because even with 5Mb-8Mb sizes GIFs are easier to handle today, comparing to downloading that 200Kb Dancing_Baby.gif in the 90s.

-----

zevyoura 437 days ago | link

My understanding is that PNGs are in general smaller than gifs for equivalent quality, so wouldn't the animated version be similarly smaller?

-----

maxst 440 days ago | link

I believe there is a niche for simple animations: just a sequence of frames in a loop. No need for JavaScript, since it's just a simple loop. Easy to upload to image hosting services. And all browsers already support such simple-loop animated GIFs, so the code is already there, just not utilized to full (true color) potential.

-----

snogglethorpe 439 days ago | link

Wait, you want to remove deltas?!

Animated GIFs are still humongous and slow to load, even with today's fast network links... Surely one of the bet reasons to replace them is to actually do a bit better.

-----

maxst 439 days ago | link

The type of deltas used in GIF can be easily implemented as it's the standard alpha blending method, available at OS and GPU level. Can't say that about more complex delta-PNG algorithm from MNG spec.

-----

mherkender 440 days ago | link

I have to say, I never understood the need for a gif-like animation in a png-like format. Gifs have incredibly basic animation that's difficult to control in most (all?) browsers, and it's pretty useless for everything except brief clips on tumblr.

Here's your animated png format, put all frames of the animation in a png sprite sheet, and fill early pixels with metadata. Add in a small library and you've got a format that's allows for more advanced animation than gifs, with the better compression and alpha of pngs, and is supported right now in any browser with decent canvas support.

-----

jug6ernaut 440 days ago | link

I know nothing behind the standard that is "GIF". But am i the only one who thinks its completely unreasonable that a few GIF's can turn my browser into a 5fps mess? How is there not a better option for this?

-----

nollidge 440 days ago | link

I think that's unreasonable, especially because it's never happened to me in recent memory.

-----

pablasso 440 days ago | link

Maybe not 5PFS but happens to me too when page has many gifs.

-----

chris_wot 440 days ago | link

If that's a reproducible issue, have you considered filing a bug?

-----

jug6ernaut 440 days ago | link

I assumed this was widely known/accepted. Never considers filing a bug, i assume you mean for the browser right?

-----

charonn0 440 days ago | link

I've experienced this under Firefox, and on hardware that has no excuse for breaking a sweat on any webpage. It's usually pages where there are a large number of animated GIFs (e.g. [1]) Once all the GIFs are loaded and complete one animation cycle, everything's fine.

[1]: http://www.totalprosports.com/2012/12/14/the-50-best-sports-...

-----

CaveTech 440 days ago | link

Are you sure you're not referring to animated GIFs? The slow FPS rate occurs as they load, and is contained to the GIF itself. Surely a static GIF would not reduce your browser FPS.

-----

Dylan16807 440 days ago | link

Don't be so sure it's a loading issue. I very often have animated gifs play very laggily the first time they run, even when they were already fully downloaded. And across multiple browsers I have seen issues playing gifs smoothly when there is anything else in the browser using CPU.

-----

darkstalker 440 days ago | link

What happened to JPEG 2000? It supports lossless too, but never seen it implemented on browsers.

-----

ComputerGuru 440 days ago | link

Royalty and licensing issues. It's heavily encumbered with patents.

As far as the actual quality:compression goes (both lossy and lossless), it kicked ass. But with so many free options, why bother?

-----

eggspurt 440 days ago | link

The image quality improvements with JPEG2000 were mathematical but not really perceptual, see http://www.stat.columbia.edu/~jakulin/jpeg/artifacts.htm

-----

No1 439 days ago | link

Those photographic comparisons are pretty subjective and zoom in on muddy/blurred areas of the image for comparison - it would have been nice to see the entire photos. The non-photographic images clearly give JPEG2000 an edge, but he then compares it to PNG. Lossy compression isn't for compressing things like pictures of text, which this guy notes but makes the comparison anyway.

The output quality is also codec dependent, and the one used in those tests has been shown to be towards the back of the pack in a 2005 shoot-out[1].

There is also no comparison between lossless JPEG2000 and PNG on a photograph.

[1] http://compression.ru/video/codec_comparison/jpeg2000_codecs...

-----

No1 439 days ago | link

There was a Firefox extension that supported JPEG 2000, it worked great on the few photography-related websites that used the format.

It seems patents killed off the format for widespread acceptance. Maybe we'll actually get to use it in 2020 (when the patents will have expired).

-----

sk5t 440 days ago | link

More numerous perhaps, but not more important--going by the insane explosion in animated GIFs in the last two years... I think folks would have stuck by JPEG if it offered transparency.

-----

mistercow 440 days ago | link

That's hard to say. Saving the 512x512 FireFox logo, for example (with white background for fair comparison) at 99% quality JPEG from GIMP saves less than 5% space over PNG, and for images with even more solid white and simple gradients, PNG will beat high quality JPEG.

Even more importantly, frequency-domain compression is really not a very good alternative for most alpha channels for two main reasons.

First, most alpha channels are dominated by large regions of full transparency or full opacity. PNG thrives under those conditions. JPEG does OK.

Second, ring artifacts are a big problem for alpha channels. Whereas a ring artifact in a chroma channel will often be completely imperceptible to the viewer, a ring artifact on an alpha channel can turn transparent pixels opaque. Unless you correct the non-alpha channels to account for those artifacts on the alpha channel, you'll end up with noticeable black halos, even at relatively high quantization. That correction is difficult, and even if you do it well, the results are not stellar.

So while a hybrid format might work well, JPEG + alpha is not as simple as it sounds.

-----

ZeroGravitas 440 days ago | link

Animated GIF, the royalty-free web video standard that Apple and Microsoft couldn't prevent you from using.

-----

Zirro 440 days ago | link

"...going by the insane explosion in animated GIFs in the last two years... I think folks would have stuck by JPEG if it offered transparency."

That does not make sense as JPEG doesn't support animation. Regardless, the blurriness caused by normal JPEG-compression levels makes it a bad option for most non-photo images.

-----

prezjordan 440 days ago | link

I believe parent was saying PNG folks would have stuck with JPEG if it offered transparency.

-----

Zirro 440 days ago | link

Indeed, it seems that way after reading through it again and inserting a dot.

I would still argue that images used in the layout of the average site, most of which are already prone to having transparent parts, are better off using a lossless rather than a lossy format.

-----

sesqu 440 days ago | link

You're underestimating the number of non-photographic JPEG files in use despite lacking transparency. It appears a significant number of people don't care about artifacts.

That said, JPEG does today support lossless compression, if you really want to go there. It sort of even supports transparency[1].

[1] http://news.ycombinator.com/item?id=1772760 for a javascript solution; other approaches use container formats

-----

vacri 440 days ago | link

jpegs are for photos, and are the wrong thing to use for things like icons, screenshots, web images and so forth.

-----

unconed 440 days ago | link

Actually, in a Retina world, it is often better to use a low quality JPEG at high res, than a high quality PNG at low res.

-----

kbolino 440 days ago | link

Well, besides the fact that we don't actually live in a "Retina world", the use of JPEG, even on high quality settings, for an artificial (= not taken from a camera) image pretty much precludes the ability to produce derivative works from it without a much more serious loss of quality. That's not to mention that there are some things which high resolutions cannot make up for, like color bleeding and other pretty serious fuzzing that JPEG can introduce at low quality settings.

-----

unconed 437 days ago | link

The point is that at high DPI, the "serious fuzzing" is much less noticeable for a variety of images. A retina screen has 4x the amount of pixels. Which means the 2x2 undersampled color errors are probably below our perception threshold. Especially if you pre-blur your high res image to a small degree, acting like an anti-aliasing filter when you scale it down by a factor of e.g. 1.5. For mobile, where users will be zooming a lot anyway, this is a very useful strategy to consider, which can absolutely beat PNG in image quality. Doesn't mean you have to do it everywhere, but I'd prefer it to having to download megabytes of images on retina devices.

It is very rare that a website has only perfect vector line art in its images. PNG sucks at compressing non-trivial gradients for example.

-----

kbolino 436 days ago | link

You've set up a false dichotomy, I think. Why use high-res low-quality images instead of just sticking with low-res high-quality images? It's all going to look fuzzy when you zoom in.

Also, palette images should get some love too. A high-res dithered GIF or 8-bit PNG might meet your needs (looks good on retina displays at normal zoom, stays crisp when zoomed in, smallish file size) better than the other options.

-----

duncans 440 days ago | link

I could have done without the colour "correction" nonsense that PNG introduced: http://hsivonen.iki.fi/png-gamma/

-----

conradfr 440 days ago | link

It would have been sooner if 8 bit PNG with alpha transparency had been implemented in Photoshop like in Fireworks.

-----

milliams 440 days ago | link

About bloody time.

-----

duiker101 440 days ago | link

I really wonder why GIFs are still around. Apart for being used as short videos for funny things they have not a huge use afaik. They really feel like an old technology. They are also a pain to support on android.

-----

T-hawk 440 days ago | link

GIF has a certain mindshare that the other formats don't, crossing over into folks who are less deeply technical.

I've worked with a couple web designers and developers that said "Gif" to mean any image, as in "Move that gif up twenty pixels" when referring to a logo that's actually JPEG. I think it's a holdover from the days of BBSes and AOL and CompuServe, where everything really was a GIF. "Check out this new cheerleader Gif I got." It's not a far leap to imagine these users just out of habit and familiarity clicking GIF in the save-as dialog without really thinking about it. So GIF persists out of familiarity and inertia.

-----

ben0x539 440 days ago | link

I wonder what the pain point that is stopping the wider public from switching to a real video format for those short clips is. Given that real video codecs have much better compression at comparable quality, is it just the lack of simple tiny video hosting options comparable to imgur? <video> tags being harder to use on random posting platforms than <img tags>? Chroma subsampling "blurring" clips with sharp edges like from cartoons or 2d videogames? Something less obvious?

-----

csense 440 days ago | link

An <img> tag pointing to animated gif should work on every combination of image host + CMS + browser.

I'm not sure off the top of my head what HTML 5 market share is like (anyone with recent data want to chime in?), but I'm guessing lots of people are running browsers that still don't have <video> capability.

-----

drchaos 440 days ago | link

http://caniuse.com/#search=video

The percentage of users not able to use <video> is roughly equivalent to the percentage of users running IE8, which is about 20% right now, and probably will stay there in the near future, as XP users cannot upgrade to IE9 (thanks, MS!).

The other problem with <video> is that there is still no common format which every browser supports, so even if you would ignore IE8 (or provide a fallback via Flash) you'd still have to encode all videos twice (to H.264 and WebM/VP8).

Sad as it is, but Flash for video and animated GIF will stay with us for some years.

-----

sesqu 440 days ago | link

GIFs are simpler, more widely supported, animated, and in many common cases result in smaller filesizes. But I believe the real reason they're still around is people don't want to fix what isn't broken.

There are a lot of cases where PNGs are superior, mostly because of the extra color depth. But that's not enough for a speedy transition.

-----

zokier 440 days ago | link

> Apart for being used as short videos for funny things they have not a huge use afaik

I wouldn't be surprised if those short videos were the bulk of the GIFs around. At least of the GIFs actually used and being dormant in some long forgotten archives.

-----

zuppy 440 days ago | link

I think it's because of IE. I know IE sopports transparent PNGs for quite a while, but until not very long ago there were not so many options and people don't really like to upgrade IE apparently.

-----

ygra 440 days ago | link

Binary transparency PNGs (i.e. no separate alpha channel) have worked in IE since at least 6. So except for animation support there really is no reason to use GIF.

-----

iso-8859-1 440 days ago | link

Some GIF's compress to less data, even after running pngout/optipng/pngcrush.

-----

MojoJolo 440 days ago | link

A lot of GIFs are use for meme.

-----

roc 440 days ago | link

inertia.

-----

hippich 440 days ago | link

I believe the only reasonable use of GIFs today is to use for all kinds of 1px gradients for background where you can't use CSS3 for that. And even if image is big - it might be better off with PNG.

basically, if you use just few colors and no semi-transparency and you picture is small - yo might be better off with GIF, otherwise - either PNG or JPG depending on if you need semi-transparency or not, and if you need loss-less compression or not.

-----

jsalinas 440 days ago | link

Actually, PNG 8 is better for that 1px graphics: http://www.phpied.com/give-png-a-chance/

-----

dlitz 440 days ago | link

November 5, 1999: Burn All GIFs Day.

http://web.archive.org/web/19991127200821/http://www.interne...

Anyone else remember this?

-----

rhokstar 440 days ago | link

GIF still rules on animation (long live memes!) PNG does not do animation however (love it for 32bit alpha)

BUT APNG does: http://en.wikipedia.org/wiki/APNG

-----

tobyjsullivan 440 days ago | link

18 years for that transition to happen. That may be the slowest thing to ever happen on the Internet.

-----

NelsonMinar 440 days ago | link

I think IPv6 is slower: 20 years since it started being developed.

-----

Tichy 440 days ago | link

Although I noticed (accidentally) that gif animated boobs seem to become more popular, that could be a thread to PNG domination.

-----

potomak 440 days ago | link

That's why I made Draw![1][2] pixel art animation editor!

[1] http://drawbang.com

[2] https://itunes.apple.com/us/app/drawbang/id578228937

-----

midvar 440 days ago | link

I wish h264 and the upcoming hevc encoded images would become a real alternative. far better quality (for pictures especially), at a lower bitrate from what ive read.

https://en.wikipedia.org/wiki/High_Efficiency_Video_Coding#M...

-----

marshallford 440 days ago | link

Finally.

-----

gmac 440 days ago | link

Or: wow! Only now?

-----

Avshalom 440 days ago | link

poor support/awareness of animated PNGs has been keeping GIF well represented for ages

-----

eggspurt 440 days ago | link

See http://www.libpng.org/pub/mng/

-----

kbrosnan 440 days ago | link

Which is unsupported in every major browser.

-----

eggspurt 440 days ago | link

Finally a feature browsers can compete on! :)

-----

tracker1 440 days ago | link

Neither APNG or MNG are supported in 2 of the big 3 browsers. If either format were supported in 2/3 of IE, Chrome/Webkit and Firefox/Gecko, it would get picked up by the other within 2 releases. Unfortunately the webkit/gecko guys are punting to the libpng guys, and nobody has budged.

-----

martinced 440 days ago | link

"The PNG image file format is now more popular than GIF"... On the Web!

PNG has been more popular than GIF since a very long time for basically anything non-web needing lossless picture compression.

From smartphones icons to OS icons, software logos and icons, etc. I'd say the proportion is about 100:1. Actually I was suprised while just running a "find" on my Linux distro to even find a few .gif files. But thousands of PNGs, of course.

Screenshots taken from OS X and Linux are saved to PNG files (for OS X it actually depends on the version of OS X, sometimes PDF are used, but not GIFs).

And games... Lots of games ship with PNG pictures (as well as jpg of course). But GIF? Common...

It's actually a very, very long time that PNG files are more popular than GIFs.

Glad to hear that it's now true for the Web too.

-----

fein 440 days ago | link

> Screenshots taken from OS X and Linux are saved to PNG files

You can really save screenies in whatever format you like on linux with imagemagick.

It's just $ import -window root screenshot.<imagetype>

Unless you're referring to whatever the DE has implemented, but I've never taken an SS without using the terminal, so I have no idea.

-----

randomdata 440 days ago | link

I'm sure he is referring to the desktop environment interface, as on OS X you could do the following to save to whatever format you wish as well:

  screencapture -tjpg desktop.jpg

-----

charonn0 440 days ago | link

MS Paint under Windows (since Vista) saves all images by default as PNG.

-----

vacri 440 days ago | link

Pre-vista it was .bmp and not .gif, if memory serves.

-----

joelg236 440 days ago | link

Your memory serves you correctly. (just tested on an xp machine)

-----

biot 440 days ago | link

  > But GIF? Common...
I think you mean uncommon.

-----

bbotond 439 days ago | link

Or "Come on..." :)

-----

bad_user 440 days ago | link

PNG would have won a long time ago on the web, if it wasn't for IExplorer.

-----

pornel 440 days ago | link

GIF-like transparency in PNG works in IE4 and later.

Only the full alpha that GIF doesn't support at all isn't working properly (but can be made to work since IE5.5).

http://calendar.perfplanet.com/2010/png-that-works/#paletted

-----

kijin 440 days ago | link

I assume you're talking about IE6 not supporting alpha-channel transparency and IE7 getting the gamma wrong?

Both of those problems can be easily fixed (in most cases) by using iepngfix for IE6 and stripping gamma information from your PNGs (which you should do anyway, to minimize the size of your images). I've been using PNGs successfully in my projects for several years, and during most of those years I had to support IE6/7. In fact, if you need to support any version of IE, PNG should be the least of your problems.

-----

maxst 440 days ago | link

> can be easily fixed (in most cases) by using iepngfix for IE6

It could be even more easily fixed by using GIFs instead. I assume that's what many people thought. Thankfully, IE6 is finally dead and no one have to worry about PNGs anymore.

-----

kijin 440 days ago | link

GIF doesn't support alpha channel transparency, so you won't be fixing the same problem.

-----

maxst 440 days ago | link

I guess 1-bit transparency was considered "good enough" in most cases, otherwise static GIFs would have disappeared years ago.

-----




Lists | RSS | Bookmarklet | Guidelines | FAQ | DMCA | News News | Feature Requests | Bugs | Y Combinator | Apply | Library

Search: