Websites should not use dithered images

If you have a blog, you should consider writing a post titled A High-Class Rebuttal to Low-Tech Magazine

With that complex example, I can get a B&W 4-color dithered png down to 91K and an 8-color down to 131K. The Color Simple one goes down to 142K with a 16-color dithered palette. I'm confused why you'd even compare the dithered JPGs, because that's self-contradictory, or why your dithered PNGs ended up so big. Did you forget to turn it into an indexed PNG?

If you're dithering, you want a lossless format that can used indexed colors. Webp also does better in this if you keep it in lossless mode. My last 16-color simple example goes down to 128K when converted to a lossless indexed webp.

I don't think this article does all the sufficient legwork to come to the conclusion it does. I agree that dithering isn't a be-all or end-all compression technique, but it's not as useless as the article makes it seem.

It's 2021. Who is still using dithering? How did this article even make it to HN?

I recall dithering being heavily used in the days of very finite color palettes - BMP, GIF16 etc..

Wow I feel old, everyone seems to have forgotten why and how to use these techniques :(

No one was dithering large photos back in the day - that's what JPEG are for.

The point of dithering was to take advantage of the reduced bit depth of indexed-colour GIFs (and later PNGs).

The Dither-Me-This tool does a lovely job of rendering different dither styles but then misses the point completely by exporting 32-bit RGB+alpha PNGs. 24 bits of RGB plus a 8-bit alpha channel? such decadence! A 16 colour dithered image only needs a 4 bit palette.

The type of images where this was useful in web design have mostly been made obsolete by the increased capabilities of CSS, and ability to render SVGs etc. e.g. graphical elements like borders and stripes of colour, or company logos. Or text in a specific font! (we didn't have web fonts in those days)

Why not use JPEGs for everything?

Two reasons: One is that heavily compressed JPEGs can make crisp straight edges blurry or fuzzy, and colours can get a bit desaturated. Bad for logos.

The other is that GIF had a Run Length Encoding compression which meant that large blocks of flat colour would compress very efficiently.

It's worth noting that RLE does not compress dithering efficiently at all... back in the day we would spend a bunch of manual effort to avoid unnecessary dithering (i.e. make sure blocks of flat colour are really all a single colour). But some dithering was unavoidable and sometimes, for specific types of images, it was possible to make a GIF that was smaller and looked cleaner than a comparable JPEG.

Also... WebP and AVIF compression rate looks great, but can it be used for websites today if not supported by Safari? https://caniuse.com/webp https://caniuse.com/avif

There are at least two problems with this article in how its argument is constructed.

First, it’s a response to two other articles and does not refer to the images in those articles or the processing techniques used on them, instead grabbing four other images and transforming them, perhaps in the same way as the original article, perhaps not. From this it draws broad conclusions. As the joke goes, at least one side of the sheep appears black from here.

The second is that there is a source of truth for these claims, and it’s in the algorithms and file formats in question. A JPEG image is generated and compressed a certain way, a PNG is encoded in a certain way. There is an actual answer to the question of whether or not dithering saves space and under what circumstances, and it has to do with how the images are encoded and compressed. If one does not want to bother learning enough about the algorithms in question, at the least one could approximate that knowledge by processing a statistically significant number of images and evaluating the results to get some kind of actual data on when and where the technique generates larger or smaller file sizes.

Instead, we’ve now got three articles, two of which say “this works” and one of which says “no it doesn’t” with all the rigor of 18th century naturalists puzzling over the behavior of birds.