Difference between WebP JPG PNG GIF image format
WebP is making headway in the image format space this year. The image format — which is developed by Google — uses both lossy and lossless compression by utilizing technology that Google purchased from On2 Technologies.
WHAT IS WEBP?
WebP is an image format that utilizes both lossy and lossless compression formats. Being able to create images that use mixed compression formats lets you create richer images that are smaller in file size than other formats.
WebP essentially combines the features of all other image formats (JPEG, PNG, and GIF) together in a surprisingly seamless way. WebP offers file sizes that are around 30% smaller than JPEG without a quality gap. It also provides transparency (alpha channel) like PNG, and the ability to animate images like the GIF format.
Chances are, you’ve seen WebP images before. If you open YouTube in Google Chrome, all of those thumbnails are going to be WebP thumbnails. If you were to open the Facebook app on your android phone, all of the images that you see would be WebP. It’s definitely being utilized by various companies around the world to increase performance. The only reason that it hasn’t completely overtaken other image formats is due to compatibility — more on that later.
Difference between WebP vs JPG vs PNG vs GIF image format
JPEG uses a lossy compression format which reduces the image information and uses another colour space than RBG to store images with a smaller file size than lossless formats. The images are either full colour or greyscale. The format works very well for photo-type images. The format does not support animation or transparency.
PNG uses a lossless compression format which represents the exact image data, using either 1,2,4,8,16 bit greyscale, 1,2,4,8 bit colour table (for 24 bit colour table entries) or 24 or 48 bit RGB images. It also can include a transparency colour for colour table images or a transparency image with 8 or 16 bit transparency data (alpha channel). The format does not support animation directly, but there is a variant called apng that does which is supported by Firefox at least.
WEBP is a newer format that supports both lossless and lossy compression, it supports animation and transparent images. I don’t know any of the details of this format, it is supposed to compress better than PNG or JPEG
JPEG is the most compatible format of the 3, PNG is supposed by a lot of tools and browsers but maybe not by all.
WEBP is pretty new and is not supported by all browsers and not by a lot of graphics programs. You may need a specific tool to create the files or a plugin to open it.
The difference is storage format:
- JPG format uses a lossy compression to store images. This means that the details are sacrificed for the sake of making the file smaller. Also, every time you save a JPG file, the quality gets reduced further.
- PNG uses lossless compression, which usually results in larger files, but the smallest details are preserved. It has some some features that JPG lacks, such as transparency.
- WEBP format was created by Google and is the newest of the three, so some applications may not support it yet. This format supports both lossless and lossy compression and the images are practically indistinguishable from JPEG and PNG.
