Archive: September 19th, 2016

Why we use progressive enhancement to build GOV.UK | Technology at GDS

This is a terrific read that gets to the heart of why progressive enhancement is such a solid methodology: progressive enhancement improves resilience.

Meeting our many users’ needs is number one on our list of design principles. We can’t know every different setup a person might use while building our systems, but we can build them in a way that gives all of our users the greatest chance of success. Progressive enhancement lets us do this.

The article is full of great insights from a very large-scale web project.

An intro to progressive web apps | 8th Light

A nice introduction to progressive web apps. There’s a little bit of confusion about permissions—whether a site has been added to the home screen or not has no effect on the permissions granted to it (for things like push notifications)—but the wrap-up nails the advantages of using the web:

No more waiting to download an app, no more prompts for updating an app. From a developer perspective, it means we will be able to iterate a lot quicker. We don’t need to wait for app store approvals anymore, and we can deploy at our own leisure.

Another advantage that a progressive web app has over a native mobile app is that it is linkable, hence it is easier to share and, probably even more importantly, can be indexed by search engines. This makes discoverability of the app a lot better.

The Typekit Blog | Variable fonts, a new kind of font for flexible design

This is what Nick Sherman has been banging on about for years, and now the time has come for variable fonts …as long as typographers, browser makers, and standards bodies get behind it.

More details on Ev’s blog.

Nordic.js 2016 • Jeremy Keith - Resilience: Tried and tested approaches - YouTube

I’m just back from a little mini 3-conference tour of Europe where I was delivering my talk on resilience. The first stop was Stockholm for Nordic.js and the video is already online.

Physical Web Beacons - Snook.ca

Jonathan takes a look at the physical web. Like me, he’s excited by the possibilities. Although he says:

Sadly, my mind quickly devolved into the annoyance of numerous notifications, like popup windows and other distracting adverts, vying for my attention.

This is a common worry with the physical web, but it’s unfounded. All a beacon does is broadcast a URL. You have to actively look for the URLs being broadcast—they can’t send notifications.

It all just feels like QR codes. They’ll be all over the place and most of them won’t be very useful.

I understand this concern, but whereas QR codes are completely opaque to humans, at least URLs can—and should—be human-readable …so, unlike QR codes, a URL can give you some idea of what awaits.

CanvasSwirl: An animated spirograph experiment in JavaScript and canvas by xhva.net

But, like, have you have ever really looked at your hand?

Cross-origin Service Workers: Experimenting with Foreign Fetch | Web Updates - Google Developers

This one is definitely for service worker nerds only. I’ve been trying to get my head around this idea of “foreign fetch” which allows third parties to install service workers—could be handy for sites with APIs like Huffduffer and The Session. This article does a good job of explaining the somewhat tangled process.

What, Exactly, Makes Something A Progressive Web App? | Infrequently Noted

Alex runs through the features that a progressive web app must have, should have, and would be nice to have.

In general, installability criteria are tightening. Today’s Good-To-Haves may become part of tomorrow’s baseline. The opposite is unlikely because at least one major browser has made a strong commitment to tightening up the rules for installability.

Right now, this is in the nice-to-have category:

Mobile-friendly, not mobile-only.

Personally, I’d put that in the must-have category, and not just for progressive web apps.

Anyway, read on for some advice on testing and tooling when it comes to evaluating progressive web apps.

lyzadanger/pragmatist-service-worker: Pragmatist’s Guide to Service Worker

Lyza put together some example code for her Smashing Conference talk on service workers. If you haven’t written a service worker before, these are really nice examples of how to grok it bit by bit.