NOTE: There is now a new version of the GUI
I first read about Pngquant in the book ‘More Eric Meyer on CSS‘. It is a small program that can keep the full transparency but reduce the colors on a PNG image.
This is something you cannot do in Photoshop or Fireworks. When optimizing the image with Pngquant you get about 50-80% reduction of the image, a image that is about 150kB turns into 30kB. And you still keep the full 8bit transparency.
For an example look at this page with Firefox, Safari or Opera. If you look closely at the Firefox logo you see that the background shines through. This is a image with 8bit transparency. What about IE then. Well, for this page I just made a * HTML CSS hack and did not show the browser any picture at all. Of course I could have made a similar image with no transparency but I did not.
The only thing that I thought was a problem was that Pngquant is a dos program. What do we say about dos programs? I certainly do not like to work in dos if I can. Well, I asked a friend of mine to make a simple GUI where you could choose the files you want to optimize and then just push OK.
There is some instructions to install the program.
1. Download the GUI and unzip it somewhere
2. Download Pngquant from the their site. (Windows binaries)
3. Download .net runtime environment from MS. (you might already have this)
4. Put the Pngquant in your $PATH (In WinXP that is C:windows/system32/)
5. You are good to go.
There is also possible to choose many files when running the program.
Thanks to Pngquant’s authors – Greg Roelofs, Jef Poskanzer and GUI author – Per Fahlén
If there is any problems, post a comment below.
Awesome! I’ve been needing a good way to optimise transparent PNG’s for desktop-like web environment that uses high quality icons. Thanks
Dear Sir,
I was wondering if you could tell me how to add pngquant to $path. I added it to systems varialbes but still get an error.
[Edited, removed the error code/Jens]
thanks for all your help.
PG
I’ve installed .net.
I put pic.exe in C:\WINDOWS\system32\pic.exe.
I click pic.exe and the UI opens. I browse to the file I want to convert (it is a 32 bit PNG I made in Image Ready).
Then pngquant gives an error message like this http://www.goldmanDesign.com/images/pngquant_error.png
Any suggestions? I’d love to use this GUI for pngquant. thanks.
You have to put all the files (the GUI and the binaries) in your C:\WINDOWS\System32 directory to have it fully functional !
Thanks for your input, I have not had any problem with having the GUI binary file wherever. I normally have it on my desktop and it works fine, could it be that you are using something else than WinXP? Please let me know if so.
I’d love to use this. But your link to download seems to be broken unfortantly.
The link has now been fixed
what binaries do i have to put???
I think you need to put the PnqQuant file into the system32 folder if I understand your question correctly. Let me know if you hava any problem.
please help me !! i have try alsots to get this thing to work downloaded all the things put them in windows/system32 i unzip the file it brings that thing up its on 8 then it says error a unhandled exception has occurred in your application the system could not find the file specified please help took all night still no wiser thanks
Only the pnqquant should be moved to the system32 folder. The .NET is installed as normal. The GUI file can be executed from anywhere. Are you on WinXP?
i have to create a directory named $PATH in system 32? i have the same error as says
Thanks for making this front-end available. It seems to work fine for me if pngquant.exe is simply in the same folder as pic.exe. I noticed that the non-dither option is not available with this tool. Is it possible to add a checkbox to enable it? The equiv dos command for this is pngquant -ordered a.png
Thanks.
I just noticed that your colleague made the program, so I guess a quick fix is not likely. Anyway I quickly made another frontend which handles the issue, so never mind about my request – however you may want to consider it in the long-term for others. regards michael.
Michael: Thanks for the input, I’ll forward your comment to the auhor of the GUI program.
are there any plans to make this for the mac?
you would be my hero and i would pay you dollars.
thanks
Ethan: No plans now but must quite easy to fix. I´ll forward your comment to Per who is building this app.
Hi, I keep getting the same error message as everyone else here. I have tried downloading all the different binaries and it still doesn’t work. I have followed all the instructions, put the pngquant in my system 32 folder but to no avail.
Which is the exact Binary i am supposed to download from your home page? I am on WinXP.
You need to download the GUI from my site, the PnqQuant from their site, install the .net enviroment (a reboot is needed I think). You could also try to put the PnqQuant in the same folder as the GUI (pic.exe).
Let me know how it goes.
No Jens, i still have the same problem the error message has come up again.
Windows 9x/NT/etc. (site 2) [109k]
This is the pngquant i have been downloading from their site in the Binaries section. Is it the right one?
Hi Jens,
as I have to embed it into my existing code. Though I could come up with a neat-looking UI, my output PNG files are just empty(but of non-zero size). I dont understand where I’m messing up. Can you/your friend help me please? I would appreciate that.
I am trying to create a GUI for PNGquant too and I cant use your .exe
Priyanka: Try the new version to see if it helps.
thats a great app, thanks.
working on windows xp no prob,
sliced quite big chunks off my PNG’s
the only thing IM wondering
is about PNG transparency in IE5.5+
does this work as how Kevin’s method works?
http://www.kevinfreitas.net/pro/articles/png-magic/
i have exported PNG’s from photoshop
they are PNG24 with transparency
now i want to find a way to get them work
without using FireworksMX to get the same effect
thanks for the little app
I’m not sure about the the method you link to works. I have to check it out.
There’s a Mac GUI too: http://pngmini.com