Skip to content

Commit 889f2c0

Browse files
committed
Promoted Linter to its own section, tweaks
1 parent f5fea69 commit 889f2c0

File tree

1 file changed

+13
-10
lines changed

1 file changed

+13
-10
lines changed

RICG-newsletter-2016-05-09.md

Lines changed: 13 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,7 @@ I don’t “ICYMI” often. But when I do, it’s because [every responsive ima
1414

1515
The news was even better than I reported; turns out, Safari’s shipping `picture` implementation [*does* respond to viewport changes][correction-safari] and *doesn’t* double-download in the test case that I lazily linked to without actually, you know, checking. Yay!
1616

17-
Bruce “Strawman” Lawson, the man who first put the word “picture” between angle brackets, took a well-deserved [victory lap][bruce-victory-lap] over on the Opera blog, re-capping and reflecting on the achievement.
17+
Bruce “Strawman” Lawson (the man who first put the word “picture” between angle brackets) took a well-deserved [victory lap][bruce-victory-lap] over on the Opera blog, re-capping and reflecting on the achievement.
1818

1919
And our Chair, Mat Marquis, [recently appeared on the Responsive Web Design podcast][wilto-podcast] to discuss who, what, why-is-it-still-around, and what’s next for the RICG.
2020

@@ -23,12 +23,19 @@ And our Chair, Mat Marquis, [recently appeared on the Responsive Web Design podc
2323
[bruce-victory-lap]: https://www.opera.com/blogs/news/2016/03/the-picture-element-saving-bandwidth-data-and-possibly-the-world/
2424
[wilto-podcast]: http://responsivewebdesign.com/podcast/ricg/
2525

26+
## It’s dangerous to go alone!
27+
28+
Martin Auswöger wrote a [respimg linter][respimg-linter]! “Linter” doesn’t quite capture [all of the things that this little bookmarklet does][respimg-linter-checks], though — in addition to checking for syntax errors (as the ever-helpful [HTML5 validator][valitator-nu] does), it actually loads your images across a full gamut of viewport sizes, and will raise the alarm if, say, your `sizes` is lying about the actual layout size of your image, or if it looks like you’re trying to kludge art-direction using `srcset`. I ran it across a few of my own pages, and the results were, uh, alarming. Bookmarklet bookmarked.
29+
30+
[valitator-nu]: https://checker.html5.org
31+
[respimg-linter]: https://ausi.github.io/respimagelint/
32+
[respimg-linter-checks]: https://ausi.github.io/respimagelint/docs.html
2633

2734
## Down ‘n nerdy with image formats
2835

29-
Colt McAnlis, developer advocate at Google, is writing [a book on image compression][understanding-compression] and has published a few articles on the topic over the past few weeks, explaining how the [JPEG][colt-jpg-works] and [PNG][colt-png-works] compression algorithms work, and suggesting a plethora of tools and techniques for making [`.jpg`s][colt-jpg-smaller] and [`.png`s][colt-png-smaller] smaller.
36+
Colt McAnlis, developer advocate at Google, is writing [a book on image compression][understanding-compression] and has recently published a few articles on the subject, explaining how the [JPEG][colt-jpg-works] and [PNG][colt-png-works] compression algorithms work, and suggesting a plethora of tools and techniques for making [`.jpg`s][colt-jpg-smaller] and [`.png`s][colt-png-smaller] smaller.
3037

31-
If you’re game for a deep dive, these articles are well worth the effort. I’ll highlight one mentioned project which was news to me: the terribly-named [Butteraugli][butteraugli] image comparison tool, from Google. Buggerutley can provide not only a single number (like every other comparison metric, e.g. [PSNR][psnr] or [SSIM][ssim]), but also a *spatial map of dissimilarity* (woah?). Awesomely, Botticelli was motivated by a deep study of the biology of vision. How many engineers can casually drop references to the “frequency space inhibition of ganglion cells”?
38+
If you’re game for a deep dive, these articles are well worth the effort. I’ll highlight one project that I discovered therein: the terribly-named [Butteraugli][butteraugli] image comparison tool, from Google. Buggerutley can provide not only a single number (like every other comparison metric, e.g. [PSNR][psnr] or [SSIM][ssim]), but also a *spatial map of dissimilarity* (woah?). Awesomely, Botticelli was motivated by a deep study of the biology of vision. How many engineers can casually drop references to the “frequency space inhibition of ganglion cells”?
3239

3340
And over on the Cloudinary blog, Jon Sneyers (creator of the new-and-exciting [FLIF image format][flif], which, hey!, he just gave [an excellent interview about][jon-interview]) takes a similarly technical tour of the JPEG compression algorithm and makes a wonderfully accessible analogy: [“JPEG is like a Photocopier”][jpeg-photocopier]. Recompression is bad; when you copy a copy of a copy, things can start to get, well, buttugli.
3441

@@ -46,11 +53,10 @@ And over on the Cloudinary blog, Jon Sneyers (creator of the new-and-exciting [F
4653

4754
## Grab Bag
4855

49-
- Martin Auswöger wrote a [respimg syntax linter][respimg-linter]!
5056
- [Google is going to funnel all of its web platform feature development through our sister org, the WICG][google-wicg]. In other words, henceforth, when Google wants to change something about web standards, they will be doing it via a process and community that is open to anyone, everywhere, at the [click of a button][click-of-a-button].
51-
- New axis of respimg adaptation alert! It’s time to [start thinking about color gamuts][color-gamuts].
52-
- [Intersection Observers][intersection-observer] will power the lazyloaders of the future; the feature [just landed in Chrome 51][io-in-chrome]
53-
- Speaking of lazy loading, my favorite lazyloader is [`lazysizes.js`][lazysizes] (which keeps the presentation-separate-from-markup dream alive); the imgix folks just wrote about [how to use `lazysizes` in conjunction with their image hosting-and-resizing service][imgix-lazysizes].
57+
- New-axis-of-respimg-adaptation alert! It’s time to [start thinking about color gamuts][color-gamuts].
58+
- [Intersection Observers][intersection-observer] will power the lazyloaders of the future; the feature [just landed in Chrome 51][io-in-chrome].
59+
- Speaking of lazy loading, my favorite lazyloader is [`lazysizes.js`][lazysizes] (because it keeps the presentation-separate-from-markup dream alive); the imgix folks just wrote about [how to use `lazysizes` in conjunction with their image hosting and resizing service][imgix-lazysizes].
5460
- Speaking of imgix, Oliver Pattison [wrote up his strategy][imgix-jekyll] for building low-overhead respimg-equipped sites using imgix and Jekyll.
5561
- Ever wonder [how to decorate an `object-fit` image][decorate-object-fit]?
5662
- Neat: [Facebook is automatically authoring `alt` text on user uploads][automatic-alt] using artificial intelligence.
@@ -59,9 +65,6 @@ And over on the Cloudinary blog, Jon Sneyers (creator of the new-and-exciting [F
5965
See you in a few weeks!
6066
—eric
6167

62-
63-
[respimg-linter]: https://ausi.github.io/respimagelint/
64-
[valitator-nu]: https://checker.html5.org
6568
[google-wicg]: https://groups.google.com/a/chromium.org/d/msg/blink-dev/PJ_E04kcFb8/baiLN3DTBgAJ
6669
[click-of-a-button]: https://groups.google.com/a/chromium.org/d/msg/blink-dev/PJ_E04kcFb8/qZtcSdE2AAAJ
6770
[color-gamuts]: http://blog.iconfactory.com/2016/04/looking-at-the-future/

0 commit comments

Comments
 (0)