A List Apart

Menu
Issue № 351

Standard vs. standard: which way of creating responsive images is best for the web?

Responsive Images and Web Standards at the Turning Point

by Mat Marquis · 42 Comments

Responsible responsive design demands responsive images, images whose dimensions and file size suit the viewport and bandwidth of the receiving device. As HTML provides no standard element to achieve this purpose, serving responsive images has meant using JavaScript trickery, and accepting that your solution will fail for some users. Then a few months ago, in response to an article here, a W3C Responsive Images Community Group formed, and proposed a simple-to-understand HTML picture element capable of serving responsive images. The group even delivered picture functionality to older browsers via two polyfills: namely, Scott Jehl's Picturefill and Abban Dunne's jQuery Picture. The WHATWG has responded by ignoring the community's work on the picture element, and proposing a more complicated img set element. Which proposed standard is better, and for whom? Which will win? And what can you do to help avert an "us versus them" crisis that could hurt end-users and turn developers off to the standards process? ALA's own Mat Marquis explains the ins and outs of responsive images and web standards at the turning point.

More from A List Apart

Columnists

Ask Dr. Web with Jeffrey Zeldman

If Ever I Should Leave You: Job Hunting For Web Designers and Developers

At the start of your career, you’re excited to have any job—but at some point you wonder if there’s a better job out there for you. Is it youthful restlessness, or are you learning to recognize the warning signs of career stagnation? There’s no sure-fire way to tell—but if you’ve stopped growing or feeling any passion for the work, it’s probably time to let go. So how do you find a better job without making it worse with your current colleagues and in your bank account? Jeffrey Zeldman has some tried-and-true tips to make your transitions smoother.

From the Blog

Developing Empathy

Everyone talks a lot about empathy, but distilling that theory-driven talk into practices for our day-to-day work can seem daunting. Susan Robertson shows how she's been able to practice empathy for users as a developer.

On Our Radar: Four-and-a-Horse Stars

This week's recommended reading list has bad news for icon fonts: we learn from Seren Davies' presentation that they present accessibility issues for people with dyslexia. Plus: our favorite tech TinyLetter, the NYSE computer glitch, an animal gif, and more.