3

I 'd like to prepare my PNGs for the best optimization, so I can get the best image quality (lossless if possible) and the smallest size.

From what I understand, I should use: PNG, 72 dpi, RGB, but what else?

Here is what we find in the iPhone HIG:

Note:*The standard bit depth for icons and images is 24 bits (8 bits each for red, green, and blue), plus an 8-bit alpha channel. The PNG format is recommended, because it preserves color depth and supports an embedded alpha channel.

I guess this mean we should save the image as PNG 24 and create them in 8 bits mode? But I also read about 32 bits for best quality ?

The interlacing scheme (witch add to the file size) allows for the PNGs to display faster. Does this applies to the iPhone?

Thanks.

Joachim Sauer
  • 302,674
  • 57
  • 556
  • 614
user287106
  • 31
  • 1
  • 2

3 Answers3

4

I suggest using ImageAlpha (lossy) on as many images as you can, because it greatly reduces their size.

Optimize all images with ImageOptim — it will remove all invisible junk and re-compress the data.

Disable Xcode conversion, because it undoes other optimisations and can make images much slower to load.

Kornel
  • 97,764
  • 37
  • 219
  • 309
  • 1
    Thanks for the tip! My iPad Retina default images are HUGE, and using ImageAlpha significantly reduced their size. I can't tell the difference for image loading times though. – MrMage Mar 19 '12 at 16:05
  • MrMage: Well, the test was done on 400 images. For a single image the speed improvement may be unnoticeable either way (but if you've shaved MBs off, then app download on 3G will be visibly quicker). – Kornel Mar 19 '12 at 16:39
1

24 bit is red, green and blue with 8 bits each. 32 bits is RGB plus an 8-bit alpha channel. So if you need (semi-)transparent images, you should go for 32bit PNG, otherwise 24bit.

You don't have to compress/crush the PNGs yourself, Xcode's build steps will automatically use pngcrush and re-order the color channels for the iPhone's BGR memory alignment.

MrMage
  • 7,282
  • 2
  • 41
  • 71
  • With photoshop you are able to export an image to png only in 8 or 24 bits but not 32. And 24 bits contains transparency, how this is possible ? – thierryb Mar 05 '10 at 13:18
  • Thanks for the answer MrMage. I get it now about the 24 bit. I know that Xcode will optimize automatically. However, the idea would be to prepare the image for the best compression. Depending on how the optimization tool works (here pngcrush), there is some techniques to save even more space and to get the best quality (specially about colors). What about the PNG interlaced option? Does it affect the iPhone display? – user287106 Mar 05 '10 at 18:18
  • 2
    Do you know how to run Xcode transformation from command line? I need to batch optimize multiple files that later will be downloaded in to ipad app. I can't include that resources in xcode though. If you know how to do that please answer my question here: http://stackoverflow.com/questions/4584467/batch-optimization-of-pngs-for-iphone-ipad-display-as-xcode-does – Piotr Czapla Jan 03 '11 at 12:57
  • @thierryb if you leave transparency unchecked, that's 24 bits (8 bits red + 8 bits blue + 8 bits green). Adding transparency (8 bits) results in 32 bits per pixel. Fireworks calls it 32 bits. – ma11hew28 Jan 11 '12 at 13:52
  • I've tested this and [Xcode-processed files were *slower* to load](http://imageoptim.com/tweetbot.html). – Kornel Mar 19 '12 at 11:08
0

For my background app I am using JPEG (Export for web in photoshop) with quality 70.

Last day I heard about pngcrunch, tried it but file size is the same...

http://pmt.sourceforge.net/pngcrush/

Take a look at this previous post : Understanding 24 bit PNG generated with Photoshop

Community
  • 1
  • 1
thierryb
  • 3,660
  • 4
  • 42
  • 58