I know this looks like an unfair match-up, but it doesn’t work out like you’d expect.
After reading the second Smashing Magazine piece on Adobe Fireworks I thought I would run a few tests with it and see how it stacked up against Photoshop.
UPDATE (March 03, 2011): Commenter Michel provided a link to a much more detailed test between Photoshop, Fireworks and Illustrator (CS5 version). Great stuff, if you’re interested check it out here: http://www.tutorialshock.com/tutorials/shadows-photoshop-illustrator-fireworks/. Thanks, Michel!
Waaaaaaaay back in the day, like circa 1999-2000, I messed around with Macromedia Fireworks ( I think it was version 3). The very first Flash animations I ever did were created in Fireworks of all programs. For some reason I had an easier time making them in Fireworks, Flash was too confusing for me at the time.
But I never did really click with the program. As such I actually don’t own Fireworks (or any CS5 app) so I had to go and download the demo from Adobe. Side note: I HATE the Adobe process of downloading AND I hate their installers. Ugh.
To make this an even match-up, I also wanted to get Photoshop CS5, but the darned thing would NOT download after multiple tries, so I finally gave up. I might revisit this later when the Adobe servers are having a better night.
So that means that it fell to Photoshop CS4 to defend the family name. I decided to grade on a curve here to be fair.
Now I don’t see myself making too many vector graphics or even doing any retouching/color-correcting in Fireworks, so I decided to concentrate on what really mattered to me: file compression.
The test would be to see which program could make the smaller jpeg while still retaining the best quality for a web-ready file.
To start I’d need an image, of course. The one I chose is called “Oxford, MI” and it came from the stock photo site Morguefile. Go ahead and download it if you want to repeat my tests.
I opened this in Photoshop CS4 and immediately saved it as a psd file. I wanted a lossless file type to begin the tests with. I opened the file in Photoshop first. It was originally 2.7mb, 3372 x 2538 pixels at 180ppi to start with.
This isn’t the size I would normally put up on the web, so I reduced the file to 800 x 602 px at 72ppi using the “Bicubic Sharper” resampling to cut down on the smooshing of the pixels.
With that done I went to the “Save for Web & Devices” screen, setting the quality to 100% and leaving the “Optimized” checkbox checked with no matte color chosen. What resulted was a 704 kb file that looked pretty much as I expected.
No surprises there, so I moved on over to Fireworks to repeat the process. I opened the psd file I made and was confronted with a “Photoshop File Open Options” screen.
The size and resolution matched up with what I saw in Photoshop so I continued on. Once the image opened up I needed to change the size of it. I was able to do this by clicking the “Image Size…” button on the Properties panel.
Here I could change the values almost as I could in Photoshop. I say “almost” because I didn’t see an equivalent to the “Bicubic Sharper” setting I used when reducing the image in Photoshop. I left the resampling method on Bicubic and resized the image to 800 x 602 just like in Photoshop.
From here there seemed to be a few ways to get a jpeg out of Fireworks. I didn’t see a “Save for Web…” type of menu command, so I just used the “Save as…” menu command. In here I chose “jpeg” in the file format box and clicked the “Options…” button on the left.
This brought up a window more similar to the Photoshop Save for Web screen. It looked like Fireworks preferred to default to 80% compression level for jpegs, but I pushed it all the way back up to 100% and left “Sharpen Color Edges” on. I also set the matte color to none and left the “Remove unused color” box checked.
Once I saved the file I took both of them and opened them up in Safari. Check both of the examples here:
The funny thing is, the Photoshop 4 jpeg was SMALLER than the Fireworks CS5 jpeg. 704kb to 812kb, respectively. I wasn’t expecting that. Also, if you look closely you’ll see that the Fireworks jpeg is softer/not as sharp as the Photoshop jpeg, despite “Sharpen Color Edges” being left on.
I can only assume this is because I couldn’t determine the Fireworks equivalent to “Bicubic Sharper” resampling when I resized the image in Fireworks.
So my initial test was a loss for Fireworks.
I was still determined to test some more of Fireworks compression. Next I went back to my Photoshop psd file (In Photoshop) and reduced the jpeg quality to 80. Photoshop came up with a 384kb file. Incredibly, Fireworks produced a 796kb file at 80% jpeg quality!?
At this point I could only assume I was doing something wrong in Fireworks. It can’t be that inferior to the last generation version of Photoshop, could it?
In a last-ditch effort, I decided to use the “Optimize to size” feature in the Fireworks save screen. I found the same problem with the Fireworks implementation of this feature as I did with the Photoshop version -namely that they don’t produce a file of the size that you type into the field.
Let’s say you type in that you want the file to be 32kb. Well, you’ll end up with a file about 60kb at least. Actually in Fireworks I typed in 50kb and got a 68kb file, but in Photoshop I typed in 32kb and got a 64kb file. So Photoshop was way off-base on that one.
This is why I rarely use this feature, because it’s never very precise with the results. What’s the point of having a field to type in the number I want if I don’t get the number I want?
So to wrap this up, my cursory test of Fireworks CS5 didn’t yield a very impressive result for compressing web graphics. I know there are all kinds of compression tricks with selective compressing and so on that could be done, but I just wanted to see what an “out of the box” test would get me.
I was hoping I would see a vast improvement in the reduction of file sizes but apparently this isn’t the case. If anyone has any reason why this went wrong or any tips on how to get the most out of Fireworks compression then just let me know. Until then I’ll just stick with Photoshop.