Link tags: images

Write Alt Text Like You’re Talking To A Friend – Cloud Four

This is good advice:

Write alternative text as if you’re describing the image to a friend.

Standing still - a performance tinker | Trys Mudford

What Trys describes here mirrors my experience too—it really is worth occasionally taking a little time to catch the low-hanging fruit of your site’s web performance (and accessibility):

I’ve shaved nearly half a megabyte off the page size and improved the accessibility along the way. Not bad for an evening of tinkering.

AI Art is The New Stock Image

While some executives in Davos may get excited about its infinite possibilities this week, to a younger consumer AI Art is already ‘a bit cringe’.

Sizes=”auto” pretty much requires width and height attributes — ericportis.com

Huh! I did not know this. Good to know!

Intent to Ship: Auto Sizes for Lazy Loaded Images with Srcset

Remember when I wrote about sizes="auto"? Well, it’s coming to Chrome! Hallelujah!

CSS { In Real Life } | Stop Using AI-Generated Images

I have yet to meet anyone who wants to hang AI art on their walls (although I fully expect to see it in hotel chains).

border:none 2023 – florian.photo

I love these black and white photos from the border:none event that just wrapped up in Nuremberg!

river

This is quite mesmerising—click on an image that takes your fancy; see it surrounded by related images; repeat.

35mm scans — writer/editor/reporter

Clicking through these cold war slides gives an uncomfortable mixture of nostalgic appreciation for the retro aesthetic combined with serious heebie-jeebies for the content.

The slides appear to be 1970s/1980s informational or training images from the United States Air Force, NORAD, Navy, and beyond.

UX London 2023 | Flickr

These pictures really capture the vibe of this year’s lovely UX London event.

TimeGuessr

Where and when were these photographs taken?

It’s like that Chronophoto game I linked to with an added dimension of location.

A History Of The World According To Getty Images

A short documentary that you can dowload or watch online:

The film explores how image banks including Getty gain control over, and then restrict access to, archive images – even when these images are legally in the public domain. It also forms a small act of resistance against this practice: the film includes six legally licensed clips, and is downloadable as an HD ProRes file. In this way, it aims to liberate these few short clips from corporate control, and make them freely available for viewing and artistic use.

Licensed under aCreative Commons 0: “No rights reserved” license.

How slimmed-down websites can cut their carbon emissions - BBC News

Interesting to see an article on web performance on the BBC. Perhaps we should be emphasising green over speed?

Behind the scenes, animation and interaction effects were added using HTML and CSS, two fundamental web languages. That meant there was no need to download large JavaScript files often used to do this on other sites.

On Container Queries, Responsive Images, and JPEG-XL – Cloud Four

Container queries can’t be used in the sizes attribute for responsive images. Here, Jason breaks down why that is (spoiler: it’s the lookahead pre-parser) and segues into a truly long term solution: a “magical” image format.

If you’ve ever thought it felt weird to put media conditions inside the HTML for responsive images, this will resonate.

Openly Licensed Images, Audio and More | Openverse

A search engine for images and audio that’s either under a Creative Commons license or is in the public domain.

Learn Images

Mat has written this free course for you all about images on the web. Covering image formats, responsive images, and workflows, this is one to keep on speed dial.

Aegir.org | Five Moons

In a way, I find these pictures—taken by someone from the ground with regular equipment—just as awe-inspiring as the images from the James Webb Space Telescope.

How To Improve Largest Contentful Paint for Faster Load Times - Calibre

A no-nonsense checklist of good performance advice from Karolina.

CSS { In Real Life } | Writing Useful Alt Text

Another post prompted by my recent musings on writing alt text. This time Michelle looks at the case of text-as-images.

Just How Long Should Alt Text Be? | CSS-Tricks - CSS-Tricks

Prompted by my recent post on alt text, Geoff shares some resources on the right length for alt attributes.