Image File Types and How to Export Files from Photoshop

GIF Image Format

• Limited to 256 colors
• Supports transparency
• Supports animation (animated gif)
• "Lossless" compression - but if original has more than 256 colors, going to 256 colors or less loses information
• Compression algorithm takes advantage of areas of constant color

JPG Image Format

• Can have over 17 million colors (256 possibilities in red x 256 possibilities in green x 256 possibilities in blue) (24 bit)
• No transparency, no animation
• Better format for photographs than gif because most photographs have lots of colors
• Compression algorithm is lossy (it loses information) so if one is making a series of changes in a jpg, best to make all changes before saving rather than saving as one goes along

Quality and File Size for GIF and JPG

• Tradeoff between quality and image file size within each format
• jpg - quality setting between 1 and 100 (100 is largest file size, and best quality)
• gif - number of colors (256, 128, 64, 32, 16, 8, 4, 2)

PNG Format

• Can have over 17 million colors, just like JPG (24 bit)
• Supports transparency (additional 8 bits)
• lossless compression
• Developed over patent concern about GIF

Bitmap and Vector Graphics

• GIF, PNG, and PNG are bitmap formats
• Vector graphics represent shapes in a mathematical way whereas bitmaps (also known as raster graphics) represent the color of each individual pixel
• Vector graphics can be blown up without loss of quality whereas enlarging a bitmap can lead to a pixelated look

Exporting from Photoshop CC

https://helpx.adobe.com/photoshop/using/export-artboards-layers.html provides lots of detail; some key points are discussed below.

File > Export > Quick Export as ...

This is partially based on the first part of the Adobe video - https://helpx.adobe.com/photoshop/how-to/export-image-web.html

File > Export > Quick Export as PNG. PNG is the default.

However you can change the default by File > Export >Export Preferences where you can set the default format for the Quick Export to be PNG, JPG, or GIF.

For PNG, you can choose among three possibilities

• Transparency is checked - results in 32 bit image
• Nothing is checked - results in 24 bit image (just like a jpg)
• Smaller file (8 bit) - this limits you to 256 colors, the same as the limitation for a GIF

For JPG, you can set the quality (a number between 0 and 100, with 100 being the best quality and the largest file size)

You can also set the Quick Export Location, whether Copyright and Contact Information will be included, and whether to convert to the sRGB color space (which is the default).

The Quick Export can be accomplished either by choosing File > Export >Quick Export or by right clicking on the layer that contains the image and choosing the Quick Export option.

An alternative to File > Export >Quick Export as ... is to use File > Export > Save for Web (Legacy). This Save for Web (Legacy) alternative will eventually go away but is still present in Photoshop 2022 Release. This option offers greater choices for the gif, jpg, and png formats than the Quick Export or the File>Export Preferences options. For example, for gif and png-8, one can specify the number of colors (2,4,8,16,32, 64, 128, 256).

Revised: April 24, 2022. Comments to William Pegram, wpegram@nvcc.edu