Use PNG files without the guilt

Post by Ben Edwards

Fireworks screenshotI have been a big fan of the PNG image format for several years, or I should really say I am a fan of the alpha-transparency* you can achieve with the 24 and 32-bit versions of the format (you get the more GIF-like transparency with the 8-bit PNGs). Not only that but the use of PNG files as backgrounds for divs and such allow me to better cut up and position elements using CSS in semantic ways that allows for more flexibility in the future as well as each component is self-contained.

The thing is, aside from all the benefits, I could only use PNGs sparingly because I would feel guilty about the large file sizes that result. Until now that is! I am not sure when it was implemented but using Adobe Fireworks you can export 8-bit PNG files with alpha transparency! This is a huge file-size savings and in most cases there isn’t a noticeable degradation in image quality.

* Alpha-transparency is the ability to show multiple levels of transparency/opacity instead of the GIF format’s simple transparent or not, resulting in much better looking transparent transitions and less “choppiness” around the edges.

About Ben Edwards

Designer of information and interactions; contributes as much with enthusiasm and drive as anything else; generalist; can migrate easily between discussions of databases, use cases, and Photoshop techniques; avid blogger (from the days when it didn't have a name); critic of bad design; organized and presented at the minnebar (un)conference in Minneapolis; married, no children, dog; loves travel. alttext.com, minnestar.org, @alttext
This entry was posted in Design, Software Development and tagged , , , , . Bookmark the permalink.

Related Posts:

Leave a Reply

Your email address will not be published. Required fields are marked *

*

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>