Know Your File Types: When to Use JPEG, GIF, and PNG
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.
- Pronounced “jay-peg”
- 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.
- Best Uses:
- Still images only
- Real-world images like photos
- Complex coloring
- Shading of light and dark
- File extension: .GIF
- “GIF” stands for “Graphics Interchange Format”
- Created by CompuServe in 1987 to transfer images quickly across slow connections.
- Pronounced “jif”
- Public debate over “gif” or “jif”
- Creator Steve Wilhite stated that the correct pronunciation is “jif.”
- Uses 256 indexed colors
- Uses dithering, a process where two pixel colors combine to make one to reduce number of colors needed.
- Allows forsingle-bit transparency
- One color can be chosen to be transparent.
- Can be interlaced
- Progressive loading shows a low-quality version first and then better detail is added.
- Can be animated
- Uses lossless compression
- Fewer colors means files start even smaller than JPEG.
- Compression does not lose any data.
- Best Uses
- Web graphics with few colors
- Small icons
- Simple images
- Line drawings
- Single-color borders
- Simple cartoons
- 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.
- Best Uses
- 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.
What Should You Use?
JPEG is best for
- Still images
- Many colors
- Shading of light and dark
GIF is best for
PNG is best for
- Web images (PNG-8)
- Logos which involve transparency and fading
- Images in the editing process (PNG 24)
- Complex images like photographs if file size is not an issue (PNG-24)
With the variety of image file formats available you can use the right format for your images to save quality and space on your website, in your emails, and and your personal digital scrapbooks.credit/source: http://www.whoishostingthis.com/blog/2014/12/06/jpeg-gif-png/
Courtesy to the original writer's sources.