Responsive Images 101, Part 2: Img Required
One of the main reasons why we need solutions for responsive images is because the <img> element is insufficient. It only has one src and we need multiple sources. Given that fact, it may be…
Standards, Page 6
The Forgotten Responsive Images Spec: image-set()
Now that responsive images have landed in Chrome and Opera, I’ve started working on a flowchart to help people decide how to use these new features. This work led me to wonder what…
Don’t use <picture> (most of the time)
Browser support for the picture specification is landing and as Marcos Cáceres said, it is time to “go forth and <picture> all the things!” Except you shouldn’t. You shouldn’t <picture> all the things.
Two pretty-good techniques for styling tricky form elements
Confession time: For most of my career, I despised form elements. Checkboxes, radios, selects and file inputs seemed to gleefully defy what little control I expected from an HTML element. Their penchant for idiosyncracy drove…
Fantastic intro to new srcset and sizes
I normally don’t write a post simply to link to another article, but if you’ve enjoyed the things I’ve written about responsive images, you really should read what Eric Portis wrote about Srcset and…
Common Patterns in Styleguides, Boilerplates and Pattern Libraries
It’s hard to believe it’s been almost three years since the publication of Ethan Marcotte’s seminal Responsive Web Design article on A List Apart. The ideas and techniques described therein blew our minds while forcing us to…
Android Browser Countdown
Android’s poor browser has been the thorn in side of mobile web developers for quite some time. Dion Almaer once said that “Android WebKit is the closest thing to being the IE6 of…
Media Queries in SVG images
“Wait? What was that Bruce Lawson just said?” That was my reaction last week as I listened to the audio from Bruce’s presentation at Responsive Day Out conference. What had Bruce said…
What a holy grail image format would mean for the browser’s lookahead pre-parser?
As long as I’m posting puzzles, riddle me this: what happens to the browser’s lookahead pre-parser if we find the holy grail of responsive images—an image format that works for all resolutions? What is…
How do you pick responsive images breakpoints?
For a few months now, I’ve been puzzling over the question of how to pick responsive images breakpoints. It has become a koan to me—no more answerable than the sound of one hand clapping. And…