Image Optimizations

Optimizing your app’s images improves performance. Think about the needs of your app and how you might design your image files to be as small as possible while achieving optimal performance and maintaining the visual style you want.

Produce artwork in the appropriate format. In general, use de-interlaced PNG files for bitmap/raster artwork. PNG supports transparency and, because it's lossless, compression artifacts don't blur important details or alter colors. It's a good choice for intricate artwork that requires effects like shading, textures, and highlights. Use JPEG for photos. Its compression algorithm usually produces smaller sizes than lossless formats and artifacts are harder to discern in photos. Photo-realistic app icons, however, look best as PNGs. Use PDF for flat, vector artwork that requires high-resolution scaling.

Use the 8-bit color palette for PNG graphics that don’t require full 24-bit color. Using an 8-bit color palette reduces file size without reducing image quality. This palette is not appropriate for photos.

Optimize JPEG files to find a balance between size and quality. Most JPEG files can be compressed without noticeable degradation of the resulting image. Even a small amount of compression can save significant disk space. Experiment with compression settings on each image to find the optimal value that yields an acceptable result.

In general, avoid transparency. Images with transparency include an alpha channel, which increases file size. If an image will always be composited on the same, solid background color, it's more efficient to include the background in the image. However, transparency is necessary in complication images, menu icons, and other glyphs that serve as template images and are tinted programmatically.

Provide alternative text labels for images and icons. Alternative text labels aren’t visible onscreen, but they let VoiceOver audibly describe what's onscreen, making navigation easier for people with visual impairments.