mceachen
Joined 16 years ago
Joined 16 years ago
(archie and veronica are non-denumerable)
A srcset lists those versions, and the browser picks the one that fits the current viewport and screen density. https://responsiveimages.org/ has details.
For an example, view the source of https://photostructure.com/tags/. All the header art looks like this:
<picture><source type="image/webp" srcset="/img/2026/05/desk-2000w_hu_f9b8e901c6d3512c.webp 400w, /img/2026/05/desk-2000w_hu_4e2d65cccd03c969.webp 800w, /img/2026/05/desk-2000w_hu_11f3bf6c90dbf78d.webp 1200w, /img/2026/05/desk-2000w_hu_8c1a7d0a013e4ee2.webp 1600w, /img/2026/05/desk-2000w_hu_4cebe999e55b5486.webp 2000w" sizes="100vw"><source type="image/jpeg" srcset="/img/2026/05/desk-2000w_hu_cf5671a2e3bdd0cc.jpg 400w, /img/2026/05/desk-2000w_hu_2906e4ba7cda040.jpg 800w, /img/2026/05/desk-2000w_hu_f59ef0388799d4d2.jpg 1200w, /img/2026/05/desk-2000w_hu_e183d28df837e14a.jpg 1600w, /img/2026/05/desk-2000w_hu_ea9c422963c8e0e1.jpg 2000w" sizes="100vw"><img src="/img/2026/05/desk-2000w_hu_f59ef0388799d4d2.jpg" width="1200" height="600" alt="About" class="w-100 header-image" loading="eager"></picture>
That’s generated by https://gist.github.com/mceachen/d5915e46d1294489698e155eb11..., which uses Hugo’s resources.Get and .Resize.
Your experience would make for excellent feedback for me if you're willing, email hello@ my domain name if you want complementary PLUS!
I've written open source for several decades, and certainly enjoyed the spoils of open source, but I've also seen a ton of bad behavior. Keeping it closed source certainly is not a guarantee that I avoid intellectual property theft or license violations, but at least I'm not just one agent prompt away from someone rebranding and reselling what I've worked full-time on for more than a decade.
Depending on the device that uploaded the media and your country, they may have stripped GPS metadata from your media. I've also had captured-at times get changed randomly (!!) from your original media.
If possible, pull your media directly off your smartphone to make sure there are no shenanigans going on.
(These were painful discoveries made while trying to help support my PhotoStructure users)
PhotoStructure runs everywhere (laptops, desktops, macOS, Windows and Linux), libraries are portable across machines and OSes, there's a generous, usable free tier, and setup takes about three minutes. If you have any questions hop into our discord, we're a friendly bunch.
I feel like being explicit like this put candidates at a bit more ease than having them try to suss out what the interviewer is expecting from them implicitly (and I know there are many interviewers that will auto-veto any candidate with the audacity to suggest a possibly imperfect approach).
https://photostructure.com/
Founded AdGrok (a YC startup), which was acquired by Twitter in 2011.