If you (like me) love the flexibility of what the 24bit with transparency png file format gives, but are depressed by the size that a 24 bit png can balloon to, then this may be of interest… I have been doing some testing / research, based on a few criteria of my own choosing. These being: I needed a full range of transparency, so not like gifs or 8 bit png, I also needed the test file to compress well and finally it needed to work consistency across all modern browsers… Normally the normal 24bit png file can sort of fit the bill except when it comes to size unfortunately they can become… well just giganticus…
So thats was my quest is there some sort of method of compressing the png or was there an alternative file format.
First off I couldn’t find a viable alternative e.g. not flash based, so that brought me back to png’s again… and finally I have found something that seems to work and work consistently from the multiple tests I have done, the conversion seems to strip anything from 50% to 75% of the png size whilst still maintaing full transparency… if you are interested then have a quick look at my tests. but the general gist is I can check adobe or freeway derived originals and they both get squidged down to a remarkably small size. To view the tests just have a quick look at the test page:
Very impressive Max, maybe a very slight loss of quality, but that might be my eyes. Well worth using.
I seem to remember another member pointed this site out a while ago, but I forgot all about it.
Thanks
Trev
On 12 Sep 2012, at 12:38, max wrote:
If you (like me) love the flexibility of what the 24bit with transparency png file format gives, but are depressed by the size that a 24 bit png can balloon to, then this may be of interest… I have been doing some testing / research, based on a few criteria of my own choosing. These being: I needed a full range of transparency, so not like gifs or 8 bit png, I also needed the test file to compress well and finally it needed to work consistency across all modern browsers… Normally the normal 24bit png file can sort of fit the bill except when it comes to size unfortunately they can become… well just giganticus…
So thats was my quest is there some sort of method of compressing the png or was there an alternative file format.
First off I couldn’t find a viable alternative e.g. not flash based, so that brought me back to png’s again… and finally I have found something that seems to work and work consistently from the multiple tests I have done, the conversion seems to strip anything from 50% to 75% of the png size whilst still maintaing full transparency… if you are interested then have a quick look at my tests. but the general gist is I can check adobe or freeway derived originals and they both get squidged down to a remarkably small size. To view the tests just have a quick look at the test page:
I wrote a reply to another thread on page bloat (http://freewaytalk.net/thread/view/110297#m_110297) back in May but didn’t send it as I thought it would make a good KB article for the Softpress web site. Sadly that never happened.
Here are my tips (from back in May) on how to squeeze your Freeway sites down to size;
—clip—
There are a number of tip and tricks that you can employ to save a few bytes here and there on your Freeway sites.
Here are some of the tricks I’ve been know to use in the past;
Freeway - set the code output in File > Document Setup > Output > HTML Code to More Efficient
Freeway - set the Resources setting in File > Document Setup > Output > Resources to With HTML Files (this will save at least 9 bytes for every image you use on the page - whoop! Still it all helps.)
ImageOptim - (http://imageoptim.com) - Once you’ve finished your site this tool can cut image file sizes down still further
ImageAlpha - (http://pngmini.com) - A great little app that will down sample 24bit PNGs to 8bits
TinyPNG - (http://tinypng.org) - An online version of ImageOptim and ImageAlpha that creates compressed 8-bit PNGs
Externalize - (http://www.freewayactions.com/test/externalize) - Although this Action can compress your CSS styles it may not help in loading times as the page will need to load the external stylesheet
aaahhhaaa I hadn’t realised it had been reported before… but anyways its good to see other people are thinking the same sort of thing… which is how to get that site down in size
Hi Tom and Trev
What tinypng does is compress the png in a few different ways but it doesnt lose the transparency. so technically if the png has a drop shadow as per my example iPhones then yes it will keep the drop shadow… as Trev has pointed out it converts whats already there
kind regards max