Tagged “responsiveimages”
My new syntax for modern, responsive blog images
I’ve started trialling different HTML and technologies for the “simple” responsive images (i.e. not art-directed per breakpoint) used in blog articles on this site. I’m continuing to lean on Cloudinary as my free image host, CDN and format-conversion service. But at the HTML level I’ve moved from a complicated <img srcset>
based approach which included many resized versions of the same image. I now use a simpler <picture>
and <source>
based pattern that keeps the number of images and breakpoints low, leaning instead into the performance gains offered by the newer image formats avif
and webp
.
Cloudinary
Cloudinary is a very handy tool for image and video upload, storage, optimisation and CDN.
Store, transform, optimize, and deliver all your media assets with easy-to-use APIs, widgets, or user interface.
See all tags.