Responsive images
Since striking out on my own, much of my time’s been dedicated to, well, the book. But I’ve also been fortunate enough to collaborate a bit with Filament Group on one of their projects: namely, a large-scale engagement that requires a responsive approach.
Needless to say, I am having the time of my life.
We’re also learning a lot, too. A lot of discussions about approach and execution have come up, largely because processes for a lot of this stuff don’t exist yet. That will, with a bit of hard work and community discussion, change over time. Still, there has been a lot of brilliant stuff created so far.
Here’s just one example:
The goal of this technique is to deliver optimized, contextual image sizes for responsive layouts that utilize dramatically different image sizes at different resolutions. Ideally, this approach will allow developers to start with mobile-optimized images in their HTML and specify a larger size to be used for users with larger screen resolutions — without requesting both image sizes, and without UA sniffing.
Check out the script, download it, and kick the tires a bit—feedback and tweaks are most welcome.
I realize that there are always going to be philosophical differences around responsive web design. But for me, the solutions-driven discussions are always going to be infinitely more interesting to me than the alternative.