About .gif & .png

[Damon_Caskey]

I assumed this had been asked before, but a search turned up nothing so...

As a curious question to Mr. Berlew (or whomever is in the know), is there any particular reason OOTS comic is presented in .gif format instead of 8-bit mode .png?

For anyone not aware, a .png file when saved in 8-bit mode is identical to .gif in every respect (i.e. 256 color table with no loss compression), but being a newer, more advanced format it is about 20% smaller on average.

That might seem like small potatoes for an individual file, but to a popular high volume comic like OOTS it's a big chunk of bandwidth. For example, comic 750 when converted to .png using Photoshop CS5 drops from 212kb to 146kb. A couple of thousand downloads in and your talking 13MB difference for a single issue of the comic.

I can only assume Mr. Berlew is every bit aware of that as I am, and obviously has the needed software to output .png files or he wouldn't be doing vector work. Given there is no technical advantage to .gif at all, perhaps there was another reason. Tradition? Limitations of the giantitp web server? Just curious is all.

DC

[Prime32]

I believe some older browsers cannot display png images inline.

[Dogmantra]

I believe some older browsers cannot display png images inline.

I think certain versions of IE have trouble with transparencies in pngs too.

[Damon_Caskey]

I believe some older browsers cannot display png images inline.

That's pretty darn old. The .png format is supported all the way back to Netscape 4.04, Win IE 5.0, Mac IE 4.0b1, and Opera 3.51. All of those are well over 10 years in cycle. Without running an IEEE check on giantitp, I'm betting anything further back will be having compatibility issues with the site itself. Browsers are free; backward compatibility is important, but at some point you have to be realistic.

I'm not saying that like some elite ivory tower techno jerk either. I have to support a huge array of compatibility here (http://ehs.uky.edu) and here (http://lavalit.com). Sure one is a game development site, but the other feeds me, and I have no qualm what so ever with .png migration on either.



I think certain versions of IE have trouble with transparencies in pngs too.


They do, but not in the way you are probably thinking. The transparent background works fine (ie6 not withstanding). It's true transparency that isn't supported well, but for OOTS that doesn't apply because because .gif and 8-bit .png don't have transparency. The advanced things you can do with .png require you to use one of its other modes, which OOTS has no need for.

DC

[valadil]

That's pretty darn old. The .png format is supported all the way back to Netscape 4.04, Win IE 5.0, Mac IE 4.0b1, and Opera 3.51. All of those are well over 10 years in cycle.

IE6 chokes on png. It's easier for Rich to save as a gif than convince IE6 users to upgrade.

[Damon_Caskey]

IE6 chokes on png. It's easier for Rich to save as a gif than convince IE6 users to upgrade.

I've got a copy of IE6 open right now looking at these without any issues what so ever.

http://ehs.uky.edu/ehs/media/image/ehs3_01.png
http://ehs.uky.edu/ehs/media/image/ehs3_03.png
http://ehs.uky.edu/ehs/media/image/ehs3_04.png
http://ehs.uky.edu/ehs/media/image/ehs3_05.png
http://ehs.uky.edu/ehs/media/image/primary_shelter_ICON.png

I think you are are confusing 8bit .png with 24 bit .png; they are very different animals. Granted, these don't have transparent backgrounds, and I have seen the transparent color showing up as gray in ie6. This however is also a mute point to OOTS; Mr. Berlew doesn't use transparent backgrounds.

If he did, there is a fix for that anyway by adding about five lines of code to the page. I don't have a reason to bother with it, but if I wanted transparent backgrounds you better believe I'd do it for the sake of my server.

DC

[Pyrian]

Clearly, it's for the animations. :smallbiggrin:

[Damon_Caskey]

Clearly, it's for the animations. :smallbiggrin:

Lol, nice.

It's too bad .png as it is doesn't support animation. No chance of .apng ever catching on.

DC

[kyoryu]

That might seem like small potatoes for an individual file, but to a popular high volume comic like OOTS it's a big chunk of bandwidth. For example, comic 750 when converted to .png using Photoshop CS5 drops from 212kb to 146kb. A couple of thousand downloads in and your talking 13MB difference for a single issue of the comic.


Probably because his bandwidth costs wouldn't be impacted by it enough to be worth his time and effort in changing it.

[Zeofar]

Probably because his bandwidth costs wouldn't be impacted by it enough to be worth his time and effort in changing it.
Changing old comics, sure. But I'm pretty sure this guy is referring to whether or not Rich has actively decided to, each time he makes a new comic and saves it, select .gif. In the first post, the OP points out what he considers the potential savings in bandwidth if Rich had made his most recent comic a .png, not if he converted the entire OotS archive.

[Zherog]

I recall this coming up in the past. I'm old, so my memory is failing me. But I recall Rich saying it had something to do with when he creates the print copy, gif is easier to work with. But, like I said, I'm old and really ought to consider an herbal supplement in my diet to improve my memory...

[Ancalagon]

He keeps the low-quality .gifs so you have an incentive to buy the printed versions - which are of a MUCH higher quality and alone that is worth spending a few $ on them. It's all a mean money-making scheme to make you buy the books!!!1 :smallsmile:

Apart from that, I assume he's having a much higher resolution in a loss-less format (the original vector format) and the print-master gets created from that (as gif or whatever). What shows up as online comics have nothing to do with what becomes the print-version later (I assume the print will be some 600 or 300 dpi version while we see some 72 dpi version online).

And even apart from that, I remember some post where Rich complained about people who try to tell him to use png instead of gif. So whatever the reason... we likely won't learn about it as he would have explained it back then if he intended to do that.

[Damon_Caskey]

He keeps the low-quality .gifs so you have an incentive to buy the printed versions - which are of a MUCH higher quality and alone that is worth spending a few $ on them. It's all a mean money-making scheme to make you buy the books!!!1

You don't gain quality by using 8-bit .png, it is limited to the same color table that .gif is. The benefit is file size for bandwidth and eliminating the ever so slim possibility of having to pay or license its use in the future (.gif is a proprietary format).


And even apart from that, I remember some post where Rich complained about people who try to tell him to use png instead of gif. So whatever the reason... we likely won't learn about it as he would have explained it back then if he intended to do that.

That wasn't my intent, and moreover I searched for any topics on it before posting. Rich has a good reason to use .gif, or he wouldn't be doing it. Since the advantage cannot possibly be technical, I just wanted to know what it was, as an honest question.

DC

[The Giant]

This has come up before. There are two main reasons:

1.) While I have the technical know-how to save the file as a PNG, I do not have the technical know-how to optimize said PNG to be much smaller than the GIF. Making a PNG small enough to make a switch worthwhile requires a program other than the outdated version of Photoshop I use. Researching another program and learning how to use it is not how I want to spend my time at this point, considering I have enough trouble getting my existing work commitments done.

2.) The script on the website that was written for me specifically asks for GIF or JPG files in order to work, because it was written back in like 2003, when more browsers did not support PNG. Getting it changed is beyond my ability right now, as I am no longer working with the person who wrote it. I could pay someone new to change it, but I don't care enough to do so.

Actually, I guess it comes down to one reason: I don't care enough about this to spend time fixing it. It works well enough for me.

[Ancalagon]

I liked the theory better where it's all part of some elaborate plot to make us buy the books with the higher quality print. ;)

[AMJ]

I liked the theory better where it's all part of some elaborate plot to make us buy the books with the higher quality print. ;)

Spot on!

Reality is so simple sometimes :smallbiggrin:

[Douglas]

This makes me wonder: How much bandwidth would converting to .png save, anyway? Does the comic image itself account for a large enough fraction of the site's bandwidth for the difference to be even marginally meaningful?

As I understand it, the primary resource hog for this site is the forums rather than the comic, and Rich is buying bandwidth in sufficient quantity that bulk rates should apply and if it's on some kind of tier deal trimming the comic image size might not even save any money at all. Even if it's on a $/MB used basis, would the difference even break into double digits of dollars per month?

[Damon_Caskey]

...

Thanks for the reply Mr. Berlew.

I kind of figured it would have something to do with he website itself, and that makes sense.

I did assume you had the latest/greatest Photoshop. Just FYI, the "save as web" dialog gets you nicely optimized .pngs since from CS2 up and doesn't need any tweaking. Just open the dialog, set to png8 and save. No doubt other programs dedicated to optimizing them can do better, but it's Photoshop I based my numbers on.

@douglas

The savings wouldn't be huge, but not insignificant either, and more to the point absolutely free. If you have the software and equipment do it (as Rich explained, he does not), it would be pretty silly not to take advantage.

I'm kind of in the opposite situation as Rich for my work. I have the best production software money can buy (Visual Studio 2010, Adobe Master Collection CS5), but my department's server is six years over its life cycle. I do everything I possibly can to ease its load. When you have 30,000 captive end users, fifty centiseconds saved over a single page load can add up to hours of their production time real fast.

But again, everyone's situations/needs are different. I was just curious about the one here, so thanks again Giant for filling me in.

DC

[The Giant]

I did assume you had the latest/greatest Photoshop. Just FYI, the "save as web" dialog gets you nicely optimized .pngs since from CS2 up and doesn't need any tweaking. Just open the dialog, set to png8 and save. No doubt other programs dedicated to optimizing them can do better, but it's Photoshop I based my numbers on.

I still use Photoshop 7.0, which is less forgiving but has the advantage of having been free, on account of it being what I used back in my graphic designer days (2003 and earlier). For 99.99% of my work, it doesn't matter. Making a big switch to the latest software would not only be expensive, but would have a learning curve due to how many changes in interface have been made in the five versions since then.

And as pointed out, most of the bandwidth issues are caused by the forums. Saving a little on the comic is not going to change that, ultimately.

It's on the list of things to do that would be nice, but not at the top.

[Shadic]

Thanks for responding, Giant. I was kind of curious about it myself, and it's nice to know that you have a (relatively) reasonable reason. :smallwink:

[tigerhawkvok]

This has come up before. There are two main reasons:

1.) While I have the technical know-how to save the file as a PNG, I do not have the technical know-how to optimize said PNG to be much smaller than the GIF. Making a PNG small enough to make a switch worthwhile requires a program other than the outdated version of Photoshop I use. Researching another program and learning how to use it is not how I want to spend my time at this point, considering I have enough trouble getting my existing work commitments done.

2.) The script on the website that was written for me specifically asks for GIF or JPG files in order to work, because it was written back in like 2003, when more browsers did not support PNG. Getting it changed is beyond my ability right now, as I am no longer working with the person who wrote it. I could pay someone new to change it, but I don't care enough to do so.

Actually, I guess it comes down to one reason: I don't care enough about this to spend time fixing it. It works well enough for me.

For what it's worth, the program you'd use is just run optipng ( http://optipng.sourceforge.net/ ) right after you save the png. Wait for it to do it's thing, and you're done, hey-presto.

Given point 2, that's kinda moot, though if it's PHP it should really be one or two IF statements or something in one file.

Along the FWIW lines, comic 751 weighs in at 148595 bytes as a GIF, and 121070 as a PNG.

[Ted The Bug]

I still use Photoshop 7.0, which is less forgiving but has the advantage of having been free, on account of it being what I used back in my graphic designer days (2003 and earlier). For 99.99% of my work, it doesn't matter. Making a big switch to the latest software would not only be expensive, but would have a learning curve due to how many changes in interface have been made in the five versions since then.

And as pointed out, most of the bandwidth issues are caused by the forums. Saving a little on the comic is not going to change that, ultimately.

It's on the list of things to do that would be nice, but not at the top.

I thought you made the comics in Illustrator. Kinda wondering where Photoshop comes in.

[Fale]

2.) The script on the website that was written for me specifically asks for GIF or JPG files in order to work, because it was written back in like 2003, when more browsers did not support PNG. Getting it changed is beyond my ability right now, as I am no longer working with the person who wrote it. I could pay someone new to change it, but I don't care enough to do so.

I know the answer is no at the moment, but myself (and I'm sure several others on the forums) would be willing to adjust it for you without charge. It's the least we can do for the amount of enjoyment you have given us.

Perhaps use you could use PNGs on your next comic after the OotS?

[The Giant]

After it's completed in Illustrator, it still needs to be transferred to a format that web browsers can read quickly and easily. An average OOTS comic clocks in at 2-3 MB in .ai format, and a strip like #750 goes up to 6.2 MB. Illustrator cannot export in raster formats, either (or if it can, it sucks at it). So I run the vector-based comic through Photoshop to create a GIF. It takes 30 seconds.

And with that, I'm going to lock this thread, because these discussions inevitably lead to people repeatedly telling me how to do things better when I've already explained that I'm not willing to invest the time needed to do things another way.