Performance, Page 3

Update (July 2019): Our process has changed quite a bit since this article was written. Check out our latest update! When I wrote about why you shouldn’t use icon fonts in your next…

We had the great fortune to help WalmartLabs convert their sites to responsive design, and it is always nice to see our clients get recognized for their hard work. Mini Kurhan and…

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…

It was mid-afternoon on a Wednesday when my team started finding strange bugs in older versions of Internet Explorer. At first these appeared to be unrelated… until we noticed seemingly random chunks of style appeared…

Most of the time when people refer to responsive images, they are referring to inline images, not CSS images. This is because before <picture> and srcset there were no good solutions for inline responsive images.

So far we’ve been focused on how to make responsive images more performant. That’s essential, but at the end of the day, we still have the same old image on the page. Now, it is…

In Parts 3, 4 and 5, we focused on solutions for resolution switching. Now it is time to look at how to solve for art direction. The picture element—the media attribute…

When we last left our intrepid web developers, they had discovered the power of srcset width descriptors, only to be faced with a new challenge—the browser only knows the size of the viewport when it…

In Part 3, we looked at display density descriptors and concluded that they are great for fixed width images, but are insufficient for flexible images. Flexible images is where srcset’s width descriptors shine. Width…