Responsive Web Design, Page 7

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…

When starting new projects, a CSS builder’s initial concerns tend to involve typography. Setting a typographic foundation with the right mixture of ingredients can form something solid enough to support many other building blocks of…

The fact the Apple may soon release an App Store for TVs has me revisiting a couple of questions that have troubled me these last few years: Where does the common device context continuum start…

I’ve dreaded writing this installment of the Responsive Images 101 series. Selecting image breakpoints is something everyone will face, and frankly, I have no good answers for you. But sooner or later, we will all…

Although my favorite projects will always be those that allow us to re-evaluate a user experience from the ground up, sometimes that isn’t realistic. That’s where Responsive Retrofitting comes in: The process of making…

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…

This happens to me over and over: I have a multi-column grid of tiles, each with varying heights. This means the bottom of certain rows can appear jagged and difficult to scan visually:…