Earth Notes: On Website Technicals (2021-05)Updated 2021-09-22 20:10 GMT.
By Damon Hart-Davis.
2021-05-27: Teaser Footing
As a test I have injected into non-lite (non-error, etc) pages a new footer which is a trailer for the previous article by first publication. The aim is to get people to stay on site and read more.
The format is similar to that for the featured article on the front page, with (linked) headline, description, and abstract.
If this stays I then may wish to change the default 'See' link from also being the previous page by first publication date.
2021-05-16: JXL Footling
I now have a JPEG XL (JXL) encoder on my Mac (
I am interested to see if I can make smaller lossless versions of already-well-compressed (eg finished off with
zopflipng) PNGs for the site. Especially for potentially in-lined hero banners for mobile, where saving bytes without further loss of fidelity would be good.
I picked a couple of recent auto-generated 640x80 banners extracted from a GNUplot-generated graph.
Firstly the 'mobile' version still too big (>~3kB) to be inlined, ~8% saved:
% cjxl -m -d 0.0 -s 9 --strip --quiet img/a/h/20210429-16WWmultisensortempL.l11745.640x80.l.png test0.jxl 5121 img/a/h/20210429-16WWmultisensortempL.l11745.640x80.l.png 4736 test0.jxl
Then the low-fi 'mobile' version now small enough to be inlined, ~19% saved:
% cjxl -m -d 0.0 -s 9 --strip --quiet img/a/h/20210429-16WWmultisensortempL.l11745.640x80.l.pngL test0L.jxl 1402 img/a/h/20210429-16WWmultisensortempL.l11745.640x80.l.pngL 1133 test0L.jxl
If JXL is consistently good for a circa 10% to 20% saving in these cases, and when a majority of browsers support JXL, it may well be worth inlining the JXL and having an out-of-line fallback to PNG for compatibility. (The fallback HTML should be smaller than the saving!)
WEBP outputs were a little smaller than PNG, much bigger than JXL, eg with:
% cwebp -lossless -m 6 -q 100 img/a/h/20210429-16WWmultisensortempL.l11745.640x80.l.png -o test0.webp % cwebp -lossless -m 6 -q 100 img/a/h/20210429-16WWmultisensortempL.l11745.640x80.l.pngL -o test0L.webp % ls ... 5121 img/a/h/20210429-16WWmultisensortempL.l11745.640x80.l.png 4870 test0.webp 4736 test0.jxl 1402 img/a/h/20210429-16WWmultisensortempL.l11745.640x80.l.pngL 1352 test0L.webp 1133 test0L.jxl
WEBP does have the merit of being supported by most browsers (even Safari!) right now. So it is a reasonable candidate for inlining.
2021-05-15: LIFX Footling
I have been footling with it directly via LIFX-Control-Panel running on a Windows 10 laptop, ie not going via the Interwebs.
I had my daughter play with it a little in our living room just now, using a laptop as an oversize colour remote control!
The brightness and colour range is impressive.