JPG image format
High compression, in addition to text, lines, with JPG processing
GIF image format
High compression, motion diagram
PNG image format
PNG is a portable Network image format. PNG initially combines GIF and JPG two to replace both formats in one swoop. October 1, 1996 by PNG to the International Network Alliance proposed and received the recommended recognition standards, and most of the drawing software and browser began to support the PNG image browsing, from the PNG image format vitality.
IE browser supports PNG image browsing starting from version 4.0.
Feature 1: Both GIF and JPG color modes.
We know that the GIF format image uses the index color color mode below 256 colors, JPG using the 24-bit true color mode. PNG not only stores index color images below 256 colors, but also stores 24 real-color images, and can even store up to 48 super-strong color images.
Feature 2:png can compress image files to the limit to facilitate network transmission, but can retain all the information related to image quality.
If your image is based on text, shapes, and lines, PNG uses a GIF-like compression method to get a better compression rate without destroying any details of the original image. According to the International Network consortium, eight-bit PNG images are 10% to 30% smaller than the same-bit GIF images.
For compression of photo quality, PNG uses a JPG-like compression algorithm. But the larger the JPG compression, the worse the image quality. Because its compression is a destructive compression method, each compression at the same time will be more or less some of the missing pixels. PNG differs from JPG in that it handles photo-like images with non-destructive compression, and the image is compressed to maintain the same image quality as before compression, without distortion.
Feature 3: More optimized transmission display .
An image processor familiar with GIF format knows that GIF images have two modes--normal (normal) and interlaced (interleaved) modes. Interlaced mode is more suitable for network transmission. In the process of transmitting the image, the browser first sees a rough outline of the image and then slowly and clearly. PNG also adopted the interlaced mode, which allows the image to be viewed horizontally and vertically on the screen, speeding up the download speed.
feature 4: Support image transparent display .
Although the GIF format also supports transparent display, the GIF format transparent image is too rigid, because GIF transparent image only 1 and 0 transparent information, only transparent or opaque two choices, no hierarchy, and PNG provides the Alpha band 0 to 255 transparent information, you can make the transparent area of the image in a different level of depth.
PNG images can be used to overlay images on any background without seams, improving the problem of poor GIF transparency image strokes.
feature 5: Good Compatibility .
GIF images appear differently on different systems, but PNG lets you make images on the Macintosh exactly as they appear on Windows, and vice versa.
PNG is designed to be read over the network to any type of machine and operating system.
Information such as text (such as author, source), Storage mask (mask), gamma value, color correction code, etc. can be transferred together in a PNG image.
several discoveries :
Opaque and indexed-color transparent pictures, Png8 is more advantageous than GIF.
Alpha Transparent picture, PNG8 is better than GIF display, but the file is larger.
PNG24 has no transparency effect: Includes index color transparency and alpha transparency.
Different browsers, the display effect is not the same.
Firefox: Supports PNG8 's index color transparency, PNG8 and PNG32 alpha transparency.
IE: Supports PNG8 's index color transparency, but does not support PNG8 and PNG32 alpha transparency. (Can be resolved with JS+CSS filter)
The pictures used in the Web page, JPG files are generally much smaller than the png24. But special cases are not excluded.
SVG image format
SVG is a kind of scalable vector graphics. It is based on XML, developed by the consortium. Strictly speaking, it should be an open-standard vector graphics language that allows you to design exciting, high-resolution web graphics pages.
The user can directly use the code to depict the image, you can use any word processing tool to open the SVG image, by changing part of the code to make the image interactive, and can be inserted into the HTML at any time through the browser to watch.
SVG provides the current network popular format GIF and JPEG does not have the advantage: can arbitrarily enlarge the graphical display, but will not sacrifice the image quality at the cost;
The text retains an editable and searchable state in the SVG image; On average, SVG files are much smaller than JPG and GIF files, so downloads are fast.
Image processing jpg png gif svg