🦄 14 years of responsive image pain, fixed

#browser #html #design #ai

Hey again 👋

sizes="auto" for responsive images is boring in exactly the way I love.

It’s the browser finally having enough context to delete a bit of work you used to have to do by hand.

Plus some interesting ways to get more out of your design meetings.

Enjoy 🦄 - Adam at Unicorn Club.

Get Unicorn Club in your inbox.
This week’s email edition includes Useful Extras and More Reads (missing from this public post).
Subscribe: https://unicornclub.dev/

Managed WordPress Hosting You'll Fall in Love With

Upgrade to autoscaling WordPress hosting for always-on, always-fast performance, backed by award-winning support. See the difference and try us out for only $1.

Try 20i now →

Top 3 this week 👇

Adam's Breakdown, Build:

The end of responsive images ↗

Let the browser pick the image size when it can.

For lazy-loaded images, sizes="auto" lets the browser wait until it has layout information, then choose the right source from srcset.

The decision becomes much cleaner: keep explicit sizes for likely LCP images near the top of the page, then let the browser handle the messy cards, grids, sidebars, and avatars lower down.

Why this matters: sizes has always forced you to describe layout too early. With lazy images, the browser can measure the rendered slot first and make a better request.

What I'd do: Add sizes="auto, ..." to lazy-loaded responsive images, then keep hand-written sizes for hero or LCP candidates only.

Shape: Mouth Coding ↗

The prototype gets better while everyone is still talking.

Why: Group sessions are much better when people have live preview, shared context, speech-to-text, and taste in the room. The design can be changed while the conversation is still fresh.

Adopt: Try this on the next design review. Start with a spec, keep the preview visible, and let stakeholders react to the thing itself.

Ship: AI is approving our pull requests: Here’s how we made it safe ↗

Fast review needs logs, scope limits, and human accountability.

Why: Intercom auto-approves 19% of PRs, but the system decomposes review into sub-jobs, blocks large changes, labels every approval, and keeps humans accountable after merge.

Adopt: Before automating review, define the evidence record: intent match, safety checks, test results, labels, and who watches production afterwards.