It has been a busy few weeks around the RICG.
First and foremost: the Group’s IndieGoGo campaign to support Yoav Weiss’ implementation efforts came to a close on Thursday and we’re over the moon about its success. We raised $15,366, well over our original $10K goal. Thus, not only will Yoav will be able to devote himself full-time to seeing the rapidly-progressing Blink implementation through—he’ll also be able to port that implementation over to WebKit.
WebKit has given Yoav the go-ahead to start coding and committing. It’s important to note that they’ve made no promises to ship anything. But we can now say that experimental implementations have been green-lighted in Blink, Gecko (picture, and srcset), and WebKit. IE officially lists the feature as under consideration. picture, srcset, and sizes are being actively implemented in three major rendering engines and are on the radar of the fourth.
If you’ve been following the Group for any amount of time, you know just how amazing that is.
To everyone that contributed to the campaign: a sincere and heartfelt thank you. You helped make responsive images on the web a reality. Now it’s time to start kicking the tires.
Picturefill v2.0.0 officially launched this week. It provides a complete pollyfill, allowing everyone to use the new markup in a fallback-and-future-friendly fashion, right now. It may be early to start using the picture markup in production, but if you’re looking to get your hands dirty with the new markup grab Picturefill 2.0 and start coding—and file issues!
If you’re feeling particularly adventurous, Yoav would like nothing more than to have as many people as possible using and abusing the in-progress Blink implementation. How-to:
- Download Chrome Canary
- Go to
chrome://flags/#enable-experimental-web-platform-features - Click “Enable”
- Pause a moment, relishing life on the bleeding edge as you prepare to experience the future: native, in-browser responsive images.
- Break things and submit bugs.
As of this writing, srcset and sizes are up and running; picture and source aren’t in just yet. But they’re just around the corner!
More huge news! Sizer Soze is fully operational. Want to see first-hand just how wasteful your non-responsive images are? Give Sizer Soze a URL and a few window widths—it’ll load your page, re-size and re-compress your images to fit the layout at those widths, and tell you what you would have saved by supplying appropriately-sized images. Hint: lots!
The server is a little shaky and loading/re-compressing boatloads of images is expensive, so a little patience and understanding might be in order (we’re working on it). It’s worth it, though: there’s nothing like seeing the giant potential savings on sites you own and maintain to really bring home the potential of the new spec.
Sadly, I’m pushing up against my word limit... otherwise I’d mention that the new features are getting Modernized, shived, and caniused. I’d point you to Yoav’s recent talk at the State of the Browser 2014 conference—maybe I’d even have the space to show you a crazy picture of his grody old jalopy of a laptop. Too bad.
See you in a couple of weeks!