.png's

Busy's picture

He has: 6,151 posts

Joined: May 2001

Anyone using .png for web pages these days instead of .jpg and .gif?

I had a little play around and only thing I could find was the transparency doesnt work in NS4.* everything else seemed to work ok

Anyone have any findings?

Abhishek Reddy's picture

He has: 3,348 posts

Joined: Jul 2001

I've found the same. I use PNG format on my local homepage, but I'm still hesitant about going with it on live sites. :\

Megan's picture

She has: 11,421 posts

Joined: Jun 1999

The transparency works in IE now? That's great! The last time I tested it it wasn't. Or does it work in IE 6 and not 5.5? If that's the case then there's enough reason not to use it with transparency. Also, when I did a test awhile back I found that file sizes with png's were larger than gif's, so unless you need to take advantage of the transparency levels it may not be worth it. What did you find in that area?

Suzanne's picture

She has: 5,507 posts

Joined: Feb 2000

I have found that you can't open a .png just by linking to it in some versions of IE -- it's fine in an .html page, but not on its own.

Busy's picture

He has: 6,151 posts

Joined: May 2001

The transparency worked in IE5 (don't have IE6).
I remember ages ago testing the file sizes were bigger as well but even with being transparent they are smaller (but I'm not using big images) image1.gif 5.05kb - image1.png 2.75kb (is the munchtech banner)
But bigger images (on the past page) didnt have as much compression image2.gif 12.9kb - image2.png 11kb
The .gif's were compressed before doing this, (saved .gif as .png) so could of had an effect.

The one thing I did notice about file size was whether the .png was interlaced or not, this makes a big difference (best for file size to be not interlaced)

Suzanne's picture

She has: 5,507 posts

Joined: Feb 2000

alpha transparencies are still not supported well, but regular transparency (one colour) have been supported for ages in IE (and in Mozilla, but not N4.x).

http://entropymine.com/jason/testbed/pngtrans/ is a great test page.

Megan's picture

She has: 11,421 posts

Joined: Jun 1999

Sorry, when I said transparency earlier I was referring to the alpha transparency (since that's one of the main advantages of png.) That page says that the alpha isn't supported by IE/win, correct? Only moz, opera, & ie/mac.

Busy's picture

He has: 6,151 posts

Joined: May 2001

Sorry my mistake, was thinking inside the square, forgot what the .png could do.
Nice sample site Suzanne - thanks

Suzanne's picture

She has: 5,507 posts

Joined: Feb 2000

Inside the square? But you're so round!

Busy's picture

He has: 6,151 posts

Joined: May 2001

Laughing out loud
It's the padded cell, keeps deforming me ... the straight jacket doesn't help either Wink

He has: 688 posts

Joined: Feb 2001

As far as browser compatibility issues, when you guys say that the transparancy can be utilized in certain browsers, do you mean the "variable transparency". I've read that many browsers will allow png transparency but only in an all or nothing manner (per pixel) like GIF89A. I know the current round of browsers all accept png, but do they all accept the variable alpha channel values that allow for good shadows?

An article I found good is http://www.eyewire.com/magazine/columns/sean/png (but it's a few years old so it's wrong on some browser compatibility issues)

Megan's picture

She has: 11,421 posts

Joined: Jun 1999

That's what I meant when I was talking about alpha transparency - it's not supported in IE.

Edit: Sorry, IE/Win

Want to join the discussion? Create an account or log in if you already have one. Joining is fast, free and painless! We’ll even whisk you back here when you’ve finished.