Account Log In - Home/Outlines - Books - Contact Us - Support - Employment -

Select your course... Course Outlines     Advanced Flash     Advanced JavaScript and CSS     CSS     Dreamweaver     Dynamic HTML     Flash     JavaScript     Photoshop     XHTML

Select your theme... Canada-ehHalloween_JheryllChristmas_JheryllPrintBeach_StevePresentationHalloween_KhalWol_Tad

Photoshop

Digital Graphics

PNG Format

Portable Network Graphic is a new bitmap file type developed in part with the Internet in mind. Its development was instigated by the GIF licensing issue and was intended as a replacement for GIF.

There are two PNG sub-types, PNG-8, and PNG-24. Both use the same compression method. PNG-8 supports a single alpha channel and PNG-24 supports variable transparency (covered later). PNG-8 is limited to 8-bit colour depth (256 colours), and PNG-24 can have millions of colours (24-bit colour depth). Both are lossless compression formats.

Historically, PNG has proved to be problematic for use on the Web, because it was not well supported in all major browsers. While many browsers fully supported PNG, browsers like Internet Explorer 6 had only partial support.

PNG has great possibilities for use on the Web. Many interesting effects can be achieved with PNG-24's variable transparency. For example, you could create real drop shadows for images that show the background (or even text) more and more towards the edge of the shadow, just like a real drop shadow would. Another example of a great PNG-24 effect might be creating a semi-transparent object on a page that allows some of the background to show through. Using these techniques can make a Web page appear more three dimensional.

All major browsers support PNG to some extent. The problem is that at least one popular browser, Internet Explorer 6, doesn't support PNG-24's variable transparency properly. IE6 will display the PNG just fine, but if there is transparency, it will show all transparent areas, regardless of the level of transparency, as the colour gray. As you can imagine, this can have detrimental results for the visual appeal of your page. Internet Explorer 7 on the other hand, supports PNG-24's variable transparency fully.

If you do choose to use PNG-24 in this manner, you need to be aware of the problems stated above. There are a couple of ways around the problem. First, if you are using a neutral, grayish group of colours in your design, the gray that IE6 will use instead of transparency might not look too bad. Second, if you really must have variable transparency in IE6, there are CSS (Cascading Style Sheets) "hacks" can sometimes force IE6 to show the transparency properly. These "hacks" can have varying degrees of success though, and can add a lot of extra work to your Web project.

PNG Format Summary

• The Portable Network Graphic format was designed to replace GIF.
• PNG-8 supports 256 colours and a single alpha channel.
• PNG-24 supports 16.8 million colours and variable transparency.
• Browser support is still not reliable.

---

Photoshop - TOC - Introduction - Books -
Digital Graphics - Links - Questions - Quiz -
1 - 2 - 3 - 4 - 5 - 6 - 7 - 8 - [ 9 ] - A -

Photoshop - TOC - Introduction - Books -
Digital Graphics - Links - Questions - Quiz -
1 - 2 - 3 - 4 - 5 - 6 - 7 - 8 - [ 9 ] - A -