Topic: Images

Client Hints can make the day-to-day task of creating responsive images much easier by greatly simplifying the markup. More

Many techniques for cropping image thumbnails on the front-end require explicit dimensions, which is less than ideal for responsive design. More

In January, Cloudinary released a free tool for generating responsive image breakpoints that was based on some of the ideas I had for picking breakpoints based on performance budgets. Today they’ve updated with some amazing new… More

Logos are an ideal use-case for SVG. Because they’re typically designed for reproduction and versatility, they’re almost always vector to begin with. SVG’s support of CSS and media queries means we can adapt brand imagery depending on the display… More

It’s political season here in the United States, and it is great to see politicians taking technology issues seriously. Take Jeb Bush for example. His campaign has gone out of its way to highlight the importance of planning the… More

As a follow-up to my post discouraging the use of icon fonts, I recently wrote about the SVG icon process we’ve been using at Cloud Four. While most of the feedback I received was positive, some felt the… More

When I wrote about why you shouldn’t use icon fonts in your next web project, I had no idea it would spark so much heated debate and intense discussion. One recurring question stood out to me: How might one… More

Responsive image breakpoints have vexed me for nearly four years. They have been my personal koan—my unsolvable problem—until today. See a couple of years ago, I had a crazy idea to pick image breakpoints using performance budgets. More

Fun fact: Cloud Four’s design team really digs SVG. Our enthusiasm for the image format accumulated gradually over many months, thanks in large part to Sara Soueidan’s tireless documentation of its most mysterious features and quirks. It was during… More

Phew. We made it! We’ve come to the end of the Responsive Images 101 series. Before we part ways with this series, I want to pass along some tips, resources and final thoughts on where responsive images are heading next. More