Tool Time

# Tool Time

If I’ve had a mantra in this newsletter for the past few months, it's 
that now that we’ve managed to get respimg into *specs* and 
*browsers*, the final step in respimg-ifying the web is to get 
responsive images into as many *webpages* as possible. The best way to 
do that is tooling, and this newsletter is full of it.

## Remember, remember, the 8th of December

That’s the day that responsive images will ship in WordPress core, as 
the marquee feature of version 4.4 (currently in [beta][1]). The team is 
making some [final tweaks][2] to the platform to prepare the way; [Joe 
McGill recently appeared on the WP Tavern podcast to explain how it all 
works][3].

WordPress may be the web’s largest CMS, but it’s not the only one 
— a new, excellent-looking [respimg plugin for Kirby][4] appeared the 
other week. And it looks like the `jekyll-picture-tag` plugin for Jekyll 
[will soon be boarding the `srcset`, `w`, and `sizes` bandwagon][5].

[1]: [https://wordpress.org/news/2015/10/wordpress-4-4-beta-1/]
[2]: https://core.trac.wordpress.org/changeset/35479
[3]: 
http://wptavern.com/joe-mcgill-explains-how-responsive-images-work-in-wordpress-4-4
[4]: https://github.com/jancbeck/kirby-responsive-images
[5]: 
https://github.com/robwierzbowski/jekyll-picture-tag/issues/68#issuecomment-152596140

## It’s hosted

Responsive image CMS integrations do two things. First, they generate 
and manage multiple sizes/versions of your “master” image files. 
Second, they generate the respimg markup that’ll be used within the 
context of the CMS.

What if you just want the first part of that – the image-management 
bit, without the markup (or the tie-in to a particular CMS)?

Never fear, The Cloud™ is here! Mike Engel [wrote a thing about 
pairing cloud-based image hosts with respimg markup][6]. I’ve been 
experimenting with the services he talks about recently and can report 
that having a fully-featured, well-maintained CMS/API for just your 
images … well let’s just say it has some nice benefits vs. the 
bespoke ImageMagick, Ruby, duct-tape, and wishes-based workflow that I, 
personally, have been using for the past couple of years. Upload a 
high-res file once, and use it (with a few URL parameters to handle the 
scaling/cropping/format-conversion) anywhere.

And the services that Mike mentions are moving *fast*: Imgix [just added 
bleeding-edge Client Hints support][7].

[6]: 
https://medium.com/@beardfury/no-bake-responsive-images-9e1289ceb9f7
[7]: 
http://blog.imgix.com/post/131102712254/next-generation-responsive-images-with-client

## Free as in JPEG

The venerable JPEG format — a 20+ year old [“alien technology from 
the future”][8] — still rules the web. It’s efficient, universal, 
and patent-and-DRM-free.

Bad news: the committee in charge of JPEG is [“investigating solutions 
that will empower end-users to protect their privacy”][10] AKA adding 
a DRM extension to the web’s primary image format. The EFF (god love 
’em) attended the latest JPEG meeting to tell them [exactly why 
that’s such a terrible idea][11]. Here’s hoping the presentation 
didn’t fall on deaf ears.

[8]: https://xiph.org/~xiphmont/demo/daala/update1.shtml
[9]: http://jpeg.org
[10]: http://jpeg.org/items/20151023_press.html
[11]: 
https://www.eff.org/deeplinks/2015/10/theres-no-drm-jpeg-lets-keep-it-way

## NKOTB

JPEG is old; WebP and JPEG-XR are shiny and new. After years of 
stagnation, progress in the image format space seems to be accelerating; 
here are two *even newer* formats that have popped up on my radar in the 
last few weeks:

- [FLIF][12] features world-beating lossless compression with a 
progressive loading scheme that they’re thinking some [interesting 
thoughts about re: responsive images][13].
- [HIMG][14] offers JPEG-like compression on very-constrained hardware

Neat.

[12]: http://flif.info
[13]: http://flif.info/responsive.html
[14]: https://github.com/mbitsnbites/himg

## Grab bag

- Toot toot! What’s that sound? It’s my own horn! Because this here 
newsletter just passed the 1,000-subscriber mark. I owe all of you 
beers.
- [Yoav went to TPAC][15].
- Use Node.js and need to automatically crop/art direct images? 
[Smartcrop.js][16] might be just what the doctor ordered.
- Speaking of art direction at scale — a couple of folks from Walmart 
Labs gave [a great presentation on responsive hero images][17]. I write 
a lot of words here about code, tools, and specs — this talk focuses 
on the much gnarlier problems of organizational process and people. A 
refreshing perspective and an informative talk; also includes some 
delightful Jason Grigsby/Rick Astley mashup gifs.

[15]: 
http://w3cmemes.tumblr.com/post/132069160337/meanwhile-in-the-wicg-breakout
[16]: https://github.com/jwagner/smartcrop.js/
[17]: https://www.youtube.com/watch?v=CJ07hLitIfU

See you in a couple of weeks!

—eric