348 private links
PNG renders top to bottom but the interlaced mode increase significantly the file size. WebP too at 28%.
AVIF has a progressive flag for it. It creates two layers. One at 1/8th resolution and minimum quality and one at full resolution and good quality. The first layer has 5.8kB as example, and the full image is 151kB. It's still experimental with avifenc.
JPEG XL (abbreviated JXL) renders on Chrome at 39% of the file.
The AVIF image provided as example is 56.4kB, which is incredible for a more than HD image.
For many images, there's little benefit to progressive rendering (the fox with many details is an exception). So progressive rendering is often a mix of good and bad luck.
The author claims JXL progressive rendering promises won't work, because there is a significant lag between each of the progressive rendering steps. It can work efficiently with srcset for example.
JXL still looks promising, but the AVIF progressive rendering of the fox is somewhat better than the 17-27kB alternative of JXL.
Note: a post-processed blur on a scaled down image results in 2kB. 10kB makes the image "acceptable" for the human eyes. The image is still pretty good for previews. The post-process blur would need to be part of the format, rather than left to something like CSS to make JXL.
and because it's an entirely separate image, the decoding overhead is zero if the browser doesn't see a benefit to displaying the preview. As in, in cases where the browser has the whole file, it can just skip the preview.
I will have to look after the AVIF format, because it seems to be the best of Webp (20-30% better compression), GIF (with animation) and better image quality than JPEG.
See the german wikipedia page or the english one
One way sighted people can determine what to put in alt text: Imagine you sent the post or article to a friend, and the image didn't load. What would someone need to know to get the equivalent experience and context? This will help you identify the important details.
An image gallery generator
oavif is a tool for target quality AVIF encoding using fssimu2, a fast perceptual image quality metric.
The project is hosted at https://github.com/gianni-rosato/oavif
An image fulgurator print on image or a custom view that is visible only to other cameras.
See https://juliusvonbismarck.com/bank/index.php/projects/image-fulgurator/2/
Make screenshot with a JS library.
It may be a way to bring back visual testing in UIs (or use it with Cypress or Playwright)
Instead of BlurHash that needs aditionnal JS for 83 bits string, some CSS snippets can do the work for Low Quality Image Placeholders (LQIP).
The big disadvantage of pure CSS approaches is that you typically litter your markup with lengthy inline styles or obnoxious data URLs.
A blurHash like method in CSS can also be used and that's what the author is describing.
A more simpler solution is to use one color as placeholder.
High Dynamic Range notes the difference between the darkest and brightest bits of a scene. It solves the contrast problem when a photo has too much brightness or darkness, or few saturation. This allows to display a photo in the Standard Dynamic Range (SDR).
Solution 1: HDR Mode
Capture many photos, merge them and display on onto an SDR screen.
Taste aside, average people don't like fiddling with sliders. Most people want to tap a button and get a photo that looks closer to what they see without thinking about it.
So Google and Apple went one step further: HDR Construction Followed By Automatic Tone Mapping. The smartphone makes the tone mapping automatically.
This solution is not a silver bullet as showed in https://www.lux.camera/what-is-hdr/#:~:text=Left%3A%20Merged%20from%20Multiple%20Photos%2E%20Right%3A%20A%20single%20exposure
When things move in the middle of a burst capture— which always happens when shooting handheld— these algorithms have to nudge pixels around to make things line up. This sacrifices detail.
AI-free HDR was exceptional back in the 1800 century.
Halid app developed its custom image lab, so users can play with the HDR and exposure as they want.
Solution 2: Genuine HDR Displays
Today screens are higher dynamic range. It's not widely used though because it costs billions od follars to the TV, film, and Photography industries to upgrade their infrastructure. Another is HDR is not for everyone. Many filmmakers are opposed to HDR since bad HDR (garishness) has left a bad impression. Influencers overuse them because it make people pause while swipping through their Instagram reels.
Apple turned out to be HDR's best salesperson though. The technology is not going to a dead end as 3D for television.
iOS 18 used the Adobe's approach: encode both SDR and HDR in the file. Browser support is halfway.
Solution 3: Embrace SDR and the lo-fi aesthetic.
So smartphones don't do HDR. They take multiple shots at different exposures, then combine them using an algorithm called "tone mapping" to create an image that is NOT HDR but looks like one.
So why this one? Firstly, because it's not jam-packed with ads, and also because - apart from videos - conversions are made browser-side and not server-side.
Free profile pictures for your designs.
Pour lecture ultérieure
Gimp 3.0 on its way!
The interface is reworked, icons are now updated and compatible with HiDPI screens (through vectorial images).
The color handling is reworked from the ground up.
The public API is now stable and documented.
The filters are not desctrutible anymore.
Support of BMP 64 bits and TIFF files.
New Filters: Inner Flow, Bevel and GEGL styles.
More translations.
See GIMP 3.0 RC 1 post: https://www.gimp.org/news/2024/11/06/gimp-3-0-RC1-released/
(via Korben https://korben.info/gimp-3-0-rc1-nouvelle-interface-et-fonctionnalites-avancees.html)