JPEG GIF PNG What Type Of Image Do You Want?

There are three types of image formats that are widely used for web graphics. These are; jpg or jpeg ; gif and png (pronounced as ping). I’ll explain each in just a moment along with their uses.

frank deardurff

I’m sure you’ve visited a website where a person’s picture looked pixelated or spotted. Or an image had ragged edges, or even yet an image on a colored background that had a white border to it. The reason is that the right image type was not used for the right purposes. Below you will discover the right reasons to use each of the web approved file formats.

JPEG/JPG Images

JPG files are best for photos

JPG files are best for photos. If you’re using a photo that has a lot of detail, say of a person or of scenery, JPGs will give you the best picture quality for the image size. JPG files are formatted to allow more color combinations than the other formats, so that’s why you’ll see a greater difference in image quality.

Short for Joint Photographic Experts Group, the original name of the committee that wrote the standard. JPG is one of the image file formats supported on the Web. JPG is a lossy  compression technique that is designed to compress color and grayscale continuous-tone images. The information that is discarded in the compression is information that the human eye cannot detect.

JPG images support 16 million colors and are best suited for photographs and complex graphics. The user typically has to compromise on either the quality of the image or the size of the file.

JPEG does not work well on line drawings, lettering or simple graphics because there is not a lot of the image that can be thrown out in the lossy process, so the image loses clarity and sharpness.

GIF Images

GIF files are best suited for images that have more text than detail or for simple graphics like iconic style clip art. Since the GIF file format allows for less color combinations, images with a lot of gradient color will seem not as sharp and may appear to have bands or lines, when a color goes from lighter to darker over a short span.

GIF images are best known on the web for their animation ability. Any of the animated banners you see on the internet are  either GIF files or Flash. Flash Is being removed at the end of 2020.

GIF is short for Graphics Interchange Format, another of the graphics formats supported by the Web. Unlike JPG, the GIF format is a lossless compression technique and it supports only 256 colors. GIF is better than JPG for images with only a few distinct colors, such as line drawings, black and white images and small text that are only a few pixels high.

With an animation editor, GIF images can be put together for animated images.  GIF also supports transparency, where the background color can be set to transparent in order to let the color on the underlying Web page show through.

PNG Images

PNG   graphics   are   best   known   for their file size quality and transparency capabilities and are now being supported by all of the newest browser versions. More designers seem to be using PNGs more frequently but in comparison to using PNG over JPG for images the PNG file size for the quality is still larger.

Overall, the PNG file format is a faster alternative for standard web images.

PNG is short for Portable Network Graphics, the third graphics standard supported by the Web. PNG was developed as a patent-free answer to the GIF format but is also an improvement on the GIF technique.

An image in a lossless PNG file can be 5%-25% more compressed than a GIF file of the same image. PNG builds on the idea of transparency in GIF images and allows the control of the degree of transparency, known as opacity. Saving, restoring and resaving a PNG image will not degrade its quality. PNG does not support animation like GIF does.

Frank Deardurff

An early love for graphics brought me online over 20 years ago which lead me to consume a vast knowledge in marketing, conversion, design and various types of web technologies. That information led to becoming a web master, serial entrepreneur, author, coach, trainer and That One Web Guy! FrankDeardurff.com

Get Our Updates

Get free updates to everything that's happening with Marketing University. Fill in the form below.