When to alternate image?

Typically, when do you need to make gif interlaced, png interlaced and jpeg progressive?

Especially when publishing images on the Internet.

+62
image png gif jpeg
Nov 19 '12 at 7:25
source share
6 answers
  • JPEG: YES - use progressive scan . It makes the files smaller ( each pass gets its own Huffman table ), and partial rendering looks good.

  • GIF: NO - it is unlikely that the file was smaller, partial rendering was poor, and this is pointless for animGIF. It’s better not to use GIF at all ( yes, even for animations ).

  • PNG: NO - it damages compression (since the data from each pass is statistically very different). If the image is large, use high-quality JPEG or lossy PNG , if possible, as they can load faster than pixel-based viewing of large, lossless PNGs.

ImageOptim will automatically change progressive / interlaced formats when files are reduced.




Disclaimer for nitpickers:

  • In the case of small and medium-sized images, a progressive view of each image will not be displayed long enough for the user to rate it. Some browsers don’t even want to output anything until the whole file is downloaded, so it’s better to focus on saving bandwidth in order to load the entire page as soon as possible.
  • A non-progressive JPEG is a little more efficient when the files are tiny (small thumbnails), but then the savings are also tiny.
  • Safari iOS has a higher maximum image size for basic JPEG than progressive, but the correct solution is to primarily execute images with sizes acceptable for mobile devices.
+92
Jan 02 '13 at 15:12
source share

My general rule: never use weave. Interlaced formats usually take up more space, have (slightly) more complex and less support in decoders, and the perceived benefits for the user experience are at least controversial. Some arguments for PNG and.

Some people like interlaced or "progressive" images that load gradually. The theory of these formats is that the user can at least look at the fuzzy full-size proxy for the image, while all the bits are loading. In practice, the user is forced to look at a fuzzy full-size proxy for the image, while all the bits are loaded. Is it done? Well, that looks fuzzy. Oh wait, the top of the image seems to be getting a little more detail. Perhaps this is done now. it is nonetheless fuzzy. Perhaps the photographer did not use a tripod. Oh wait, it seems like it's clearing up now ...

+12
Nov 19 '12 at 14:40
source share

Interlaced images are slightly less efficient, but appear after a shorter delay on the client side when transporting over the network. IMHO they should be used when the expected image loading time is long enough to be perceived by the user (say, above 1 second). The difference in file size is actually quite small, so it’s better to be too careful and use interlaced interlacing rather than too small.

In general broadband Internet since 2012, I just used it for every image> 100 kb.

+4
Nov 19 '12 at 7:40
source share

These points should be helpful.

Alternation (generally progressive display) is a method of displaying images on a monitor. When to use it? Your decision should be based on the following factors:

•> Non-interlaced images are smaller than interlaced images.
•> Interlaced images produce less flicker than non-interlaced images.
•> Interlaced images are much easier to view.

An interlaced image allows you to see the image before all the data has been transferred (which makes them faster and more beautiful) and gives you the feeling that it loads faster.

TIP. Alternation is not recommended for small images, but is required if the viewer uses a slow connection

This is just a copy of Y's answers, which I thought might help to understand. The original answer can be found at: https://answers.yahoo.com/question/index?qid=20090211121956AAz7Xz8

+3
Apr 27 '14 at 7:48
source share

Just to throw two arguments into an argument: Interlacing was introduced many years ago when Internet speed was slow, the idea was that the image would present itself gradually in a more specific way, while preserving the overall appearance and image, without waiting for the entire download things.

Alternation is currently largely unnecessary and should be used based on the total size of the transmitted image.

Progressive Scan Images of JPEG images provide a sharper image when trying to reduce the overall file size (that is, it is rather a real compression mode than the method of streaming the bits that make up the image).

PNGs use a more sophisticated algorithm than GIFs .

+2
Dec 30 '15 at
source share

There is an interesting article related to webmasters

https://webmasters.stackexchange.com/questions/574/progressive-jpeg-why-do-many-web-sites-avoid-rendering-jpegs-that-way-pros

Ultimately, it depends on how they are used.

The message suggests that there is limited - genuine - support for progressive images. And sometimes they can cause problems with plugins that do not support the progressive format.

Hope this helps.

+1
Nov 19 '12 at 7:45
source share



All Articles