Understanding PNGs

[StuntFactoryX]

can i use pngs in vbulletin and is it efficiant as far as loading times? the reason i want to use png is because of the transparent feature. i know in some older browsers there was the blue glow. im currently using IE7 and FF and they look great on my pc put what is everyone else seeing?

so my question is its a realistic to use pngs through out my site for banners and graphics? are there other browsers out there that wont render them correctly and if so how common are these browsers?

currently how i have been saving images is in photoshop cs3 with the save for web as png 24. is that the best method?

[UKBusinessLive]

Hi StuntFactoryX

PNG is a relatively new invention compared to GIF or JPEG, although it's been around for a while now. (Sadly some browsers such as IE6 still don't support them fully.) It stands for Portable Network Graphics. It was designed to be an alternative to the GIF file format, but without the licensing issues that were involved in the GIF compression method at the time.

There are two types of PNG: PNG-8 format, which holds 8 bits of colour information (comparable to GIF), and PNG-24 format, which holds 24 bits of colour (comparable to JPEG).

PNG-8 often compresses images even better than GIF, resulting in smaller file sizes. On the other hand, PNG-24 is often less effective than JPEGs at compressing true-colour images such as photos, resulting in larger file sizes than the equivalent quality JPEGs. However, unlike JPEG, PNG-24 is lossless, meaning that all of the original image's information is preserved.

PNG also supports transparency like GIF, but can have varying degrees of transparency for each pixel, whereas GIFs can only have transparency turned on or off for each pixel. This means that whereas transparent GIFs often have jagged edges when placed on complex or ill-matching backgrounds, transparent PNGs will have nice smooth edges.

Note that unlike GIF, PNG-8 does not support animation.

One important point about PNG: Earlier browsers don't recognise them. (IE6) If you want to ensure your website is viewable by early browsers, use GIFs or JPEGs instead.

On the whole, GIFs are better for the Web, as Web graphics tend to be small, have a small amount of colours, and sometimes need fancy stuff like animation or transparency. However, JPEGs are really handy when you have a very complex or large image (such as a photo), and/or you want a full colour image. PNG-8 can often produce smaller file sizes than GIF, and both types of PNG are lossless.

Hope this helps ;)

[nexialys]

i've coded a style with only .png files for the design, for the same reason, transparency: http://www.thcfarmer.com/ ... you can see by the loading of the first page that the logo is really heavy, but after that, nothing is different...

[ChaosBurnt]

Hi StuntFactoryX
Note that unlike GIF, PNG-8 does not support animation.

Actually, there is a type of png that supports animation, sadly FF dropped it some time ago because there wasn't enough demand for it, the file type is called mng, you can find out a bit about it here:
http://www.libpng.org/pub/mng/

Like a mug, I purchased an mng animation software package many moons ago only to find out afterwards that the file type is not supported on the net anymore, oh those early days eh!

[Shelley_c]

.mng did show promise, but sadly it died before it even got started. For animation (or atleast 256 colour animation) .gif will remain the standard for a good while. There's just not enough people wanting to migrate and take the leap. And untill then, I will carry on using .gif for my animation solutions.

Not really making any point here to the OP question only to say .mng is not even remotely a solution.

[ChaosBurnt]

Not really making any point here to the OP question only to say .mng is not even remotely a solution.

Aye, right enough there, shame though, mng animations are pretty awesome, still, I figured folk who do not know about mng's might be interested in at least having a peruse ;)