Digital images fill up our inboxes, take up computer memory space and take time to load on a web page. When working with digital image files there are certain file types to use for each circumstance.
File extension: .JPG or .JPEG
“JPEG” stands for “Joint Photographic Experts Group.”
The group designed the format in 1986.
16-bit data format
Can display millions of colors
Uses a very complex compression algorithm
To reduce file size
Let image details be “forgotten” and then fill in when displayed
Called “lossy” compression for the lost data
The human eye doesn’t see color detail as well as it does light and dark detail, so some color detail can be sacrificed to save file space.
60-75% compression is usually optimal for website usage.
Use when a small file size is more important than maximum quality
Standard file format of digital cameras and web pages.
Compatible across many platforms (PC and Mac), and other programs (web browsers and image editors).
In March 2014 Mozilla createdthemozjpeg format.
Works within the current, recognizable jpeg format.
Works with existing platforms, such as web browsers.
Reduces the file size up to 15% more without losing quality.
Useful for web pages, especially Facebook, for faster upload.
JPEG Mini Tool
Tools like JPEG Mini let you compress photos up to 5 times without losing quality.
Smaller file sizes means less storage space needed and quicker upload.
Still images only
Real-world images like photos
Shading of light and dark
File extension: .PNG
“PNG” stands for “Portable Network Graphics”
Designed in the mid-1990s as a way around patent issues with the GIF format, including benefits from both GIF and JPEG.
Pronounced “ping” or “P-N-G”
Lossless compression, so no data loss.
Very similar to GIF
256 colors and 1-bit transparency
PNG-8 files are even smaller than GIF files
24-bit color, similar to JPEG
Can include over 16 million colors
Lossless compression means larger files than JPEG
PNG files allow transparency to be set on a scale between opaque and completely transparent, allowing for a faded, translucent look.
PNG images can be put on any color background and maintain original appearance
Some older browsers may have trouble supporting PNG files because of alpha-channels.
Web images such as logos that involve transparency and fading.
Images in the middle of the editing process.
Complex images like photographs if file size is not an issue.