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.
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.
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.
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
Related
So I just wanted to ask this question because there is a quality slider for png in Adobe Photoshop.
Now the reason why I find this very confusing is I know that PNG is a lossless format.
I'm not sure what is used to measure objective quality, by that I mean how much information is contained in images. I'm assuming it's either dpi or bit depth or file size for the same format?
Now, I know that the same lossless compression for the same image can have varying quality (bit depth and dpi).
This is because you can do an in between step and encode it into a lossy format like jpg, before converting back into a lossless format like png.
For example, we have a picture of some dice taken by a camera in a lossless png format it's the original quality let's say 360dpi horizontal and vertical resolution and 24 bit depth.
Then we can encode it into jpg (which is using lossy compression) and presumably the quality would go down slightly from averaging pixels, as it is lossy compression and it would lower the quality to something like 200dpi horizontal and vertical resolution and 12 bit depth.
Then we encode that back into png again (lossless compression) and the final quality would be 200dpi horizontal and vertical resolution and 12 bit depth.
So now we have two pngs for the same image which are in a lossless format, the original one and our one that was encoded from a jpg, that have different quality.
The point I'm trying to make is that I think this is why two images using lossless compression can have differing quality, even though lossless compression does not remove any information, because one of the lossless compression images could have just been encoded from a lossy format. Information can be removed from lossless formats by encoding to and from a lossy format.
So now back to the question, is this why Photoshop has a quality slider for PNG images?
For qualities below 100% say 80%, is Photoshop encoding into something lossy like jpg and then back into the lossless png so that the files can have different quality and thus, a different file size for the same image?
I've also read something on wikipedia about PNG being able to perform lossy compression as well, so is that what is happening instead?
https://en.wikipedia.org/wiki/Portable_Network_Graphics#Lossy_PNG_compression
I'm just confused about it.
Photoshop may be reducing color depth as described in the the wiki you included in your question:
reducing color depth, either:
use a palette (instead of RGB) if the image has 256 or fewer colors,
use a smaller palette, if the image has 2, 4, or 16 colors, or
(optionally) lossily discard some of the data in the original image
This question already has an answer here:
Convert an image to a 16bit color image
(1 answer)
Closed 4 years ago.
I'm trying to obtain a PNG image with a resolution 512px x 512px smaller than 100 kB.
At the moment the files are around 350 kB. I'm trying to reduce the file size and a way I was thinking is to reduce the Color-depth.
This is the information of the PNG images:
bits per component -> 8
bits per pixel -> 32
I wrote some code to create the CGContext with a different bits per Pixel, but I don't think that's the write way.
I don't want to use the UIImage.jpegData(compressionQuality: CGFloat) since I need to maintain the alpha channel.
I already found some code in Objective-C but that didn't help. I'm looking for a solution in Swift
You would need to decimate the original image somehow, e.g. zeroing some number of the least significant bits or reducing the resolution. However that completely defeats the purpose of using PNG in the first place, which is intended for lossless image compression.
If you want lossy image compression, where decimation followed by PNG is one approach, then you should instead use JPEG, which makes much more efficient use of the bits to reproduce a psycho-visually highly similar image. More efficient than anything you or I might come up with as a lossy pre-processing step to PNG.
The image at the end of this question is a PNG with mode I, which stands for Indexed, as far as I can tell.
I'm trying to create a thumbnail out of it, and save it as JPG with PIL.
However, is I leave the mode alone, PIL won't let me resize it with error unable to generate thumbnail: cannot write mode I as JPEG.
If I convert it to RGB, the result will be a fully white image.
Is there a way to fix this?
https://www.dropbox.com/s/2d1edk2iu4ixk25/NGC281.png
The input image is a 16-bit grayscale PNG, and it appears PIL has a problem with this. Manually converting it to an 8-bit image before further processing makes it work again.
The problem may originate inside PIL itself. The PyPNG homepage asserts
..PIL only has internal representations (PIL mode) for 1-bit and 8-bit channel values. This makes me wonder if PIL can read PNG files with bit depth 2 or 4 (greyscale or palette), and also bit depth 16 (which PNG supports for greyscale and RGB images).
Then again, that page is from 2009. It could be worth tracking down where PIL is maintained from, and report this as a bug (? Or possibly a feature request?).
I have a matlab code and it generates a .png image of 1024*768 resolution. The images are about 450KB in size and I need to know how to optimise and compress these images using matlab.
Can't I play with the quality as in JPEG ?
I read the imwrite manual and don`t seem to find a good way to do this.
Is there any way to achieve it in matlab ?
By design PNG files are lossless - there is no 'quality' to be adjusted (it's probably why a mod changed your question title).
You can reduce the number of colors in the image (the color depth) which will in turn reduce filesize (PNG-8 instead of PNG-24, for example), but the whole point of PNG is it produces lossless images, so there is simple no quality value a la JPEG.
Taken from the manual :
A parameter of input in case it is JPEG:
'Quality' - A number between 0 and 100; higher numbers mean higher quality (less image degradation due to compression), but the resulting file size is larger.
imwrite(x,'c:\1.jpg','Quality',10)
edit: Sorry, I answered this one while the title was JPEG and not PNG.
PNG doesn't support any quality settings - it is a lossless format. The compression it applies is generally as good as possible.
JPEGs are smaller in size than PNGs. So, I thought that if I can make a specific region in a JPEG-file transparent, with some code, maybe I can save some bytes.
So does anyone know how to achieve this with for example PHP or JavaScript?
No. You can't do this. JPGs do not support alpha channels and have no capacity to designate certain colors as transparent either (GIF-style).
There's several issues with this, all of them have to do with that JPEG is a lossy compression format. The JPEG format is optimized for natural images and sharp edges will get blurred. If you intend that a specific pixel should have the value #d67fff there's no guarantee that after color conversion, FDCT, quantization, IDCT and color conversion, the pixel still will have that value. There's also a strong possibility that that pixel value will occur in areas that you don't want.
No. JPEG does not support transparency and is not likely to do so any time
soon. http://www.faqs.org/faqs/jpeg-faq/part1/section-12.html
You cannot do that, the client renders the image and doesn't know that you want it to treat that color as transparent (plus various compression methods on jpeg wouldn't work well with transparencies anyway).
I believe you can go with an 8-bit custom-pallet png, should save you a lot of space. Otherwise 24-bit PNG is your only high color option.
You can convert your image to SVG containing a color information as JPEG and an alpha channel as grayscale mask. Here is a tool I wrote to do it https://github.com/igrmk/transpeg