If you ask graphic and web designers about image file formats most will give you the same response: if you’re working with line-art and/or flat colours, stick with GIF; for photographic content, use JPEG. However, a third format’s been present for quite some time and quite a few designers now reckon PNG’s day in the sun is finally here.

PNG comes in two types, 8-bit and 24-bit. In a broad sense, these mirror the capabilities of GIF and JPEG, although a typical 24-bit PNG is weightier than the equivalent JPEG. However, PNG does offer something for design purposes that the other two formats don’t: alpha transparency.

The closest traditional web image formats come to transparency is in making specific colours within GIFs transparent. But unless your images are heavily pixellated or have very straight edges, such transparency usually results in a severe case of the jaggies. Also, it’s an all or nothing proposition – you can’t make your transparent colour 50 per cent transparent, for example.

With PNG, these problems vanish. Therefore, you can create elaborate gradients and transparencies in the likes of Illustrator and Photoshop, and export them to the web intact, adding visual clout to your designs.

As with ever new feature to be used for the web, PNG does not work with IE6. There are some CSS hacks available and I would recomend using these, however, depending upon your client and the type of project in hand, simply ignoring IE6 may just be your best option.