Get started with variable fonts – Medium
Rich has posted a sneak peek of one part of his book on Ev’s blog.
Archive: February 21st, 2017
Variable fonts
We have a tradition here at Clearleft of having the occasional lunchtime braindump. They’re somewhat sporadic, but it’s always a good day when there’s a “brown bag” gathering.
When Google’s AMP format came out and I had done some investigating, I led a brown bag playback on that. Recently Mark did one on Fractal so that everyone knew how work on that was progressing.
Today Richard gave us a quick brown bag talk on variable web fonts. He talked us through how these will work on the web and in operating systems. We got a good explanation of how these fonts would get designed—the type designer designs the “extreme” edges of size, weight, or whatever, and then the file format itself can extrapolate all the in-between stages. So, in theory, one single font file can hold hundreds, thousands, or hundreds of thousands of potential variations. It feels like switching from bitmap images to SVG—there’s suddenly much greater flexibility.
A variable font is a single font file that behaves like multiple fonts.
There were a couple of interesting tidbits that Rich pointed out…
While this is a new file format, there isn’t going to be a new file extension. These will be .ttf files, and so by extension, they can be .woff and .woff2 files too.
This isn’t some proposed theoretical standard: an unprecedented amount of co-operation has gone into the creation of this format. Adobe, Apple, Google, and Microsoft have all contributed. Agreement is the hardest part of any standards process. Once that’s taken care of, the technical solution follows quickly. So you can expect this to land very quickly and widely.
This technology is landing in web browsers before it lands in operating systems. It’s already available in the Safari Technology Preview. That means that for a while, the very best on-screen typography will be delivered not in eBook readers, but in web browsers. So if you want to deliver the absolute best reading experience, look to the web.
And here’s the part that I found fascinating…
We can currently use numbers for the font-weight property in CSS. Those number values increment in hundreds: 100, 200, 300, etc. Now with variable fonts, we can start using integers: 321, 417, 183, etc. How fortuitous that we have 99 free slots between our current set of values!
Well, that’s no accident. The reason why the numbers were originally specced in increments of 100 back in 1996 was precisely so that some future sci-fi technology could make use of the ranges in between. That’s some future-friendly thinking! And as Håkon wrote:
One of the reasons we chose to use three-digit numbers was to support intermediate values in the future. And the future is now :)
Needless to say, variable fonts will be covered in Richard’s forthcoming book.
Atomic.
(thanks, @brad_frost)
The Five-Tool Designer » Mike Industries
Mike lists five tool skills he looks for in a designer (not that every designer needs to have all five):
- Visual Design & Animation
- Interaction Design
- Getting Things Done
- Teamwork
- Leadership
Swap the first one out for some markup and CSS skills, and I reckon you’ve got a pretty good list for developers too.
Flatris
Tetris in your browser. Visit it once and it works offline (if your browser supports service workers) so go ahead and add it to your home screen.
Send messages when you’re back online with Service Workers and Background Sync – Twilio Cloud Communications Blog
This example of using background sync looks like it’s specific to Twilio, but the breakdown of steps is broad enough to apply to many situations:
On the page we need to:
- Register a Service Worker
- Intercept the “submit” event for our message form
- Place the message details into IndexedDB, an in browser database
- Register the Service Worker to receive a “sync” event
Then, in the Service Worker we need to:
- Listen for sync events
- When a sync event is received, retrieve the messages from IndexedDB
- For each message, send a request to our server to send the message
- If the message is sent successfully, then remove the message from IndexedDB
And that’s it.
kamranahmedse/design-patterns-for-humans: Design Patterns for Humans™ - An ultra-simplified explanation
I’m crap at object-oriented programming (probably because I don’t get get enough practice), but I’ve had a quick read through this and it looks like a nice clear primer. I shall return and peruse in more depth next time I’m trying to remember how to do all this class-based stuff.
ongoing by Tim Bray · Geek Career Paths
Tim Bray lists the options available to a technically-minded person thinking about their career path …but doesn’t mention the option of working at an agency.
Some good long-zoom observations in here:
The bad news that it’s a lot of work. We’re a young profession and we’re still working out our best practices, so the ground keeps changing under you; it doesn’t get easier as the decades go by.
The good news is that it doesn’t get harder either. Once you learn to stop expecting your knowledge to stay fresh, the pace of innovation doesn’t feel to me like it’s much faster (or slower) now than it was in 1987 or 1997 or 2007. More good news: The technology gets better. Seriously, we are so much better at building software now than we used to be in any of those other years ending in 7.
Functional Minimalism for Web Design
According to this, the forthcoming Clearleft redesign will be totally on fleek.
[this is aaronland] fault lines — a cultural heritage of misaligned expectations
When Aaron talks, I listen. This time he’s talking about digital (and analogue) preservation, and how that can clash with licensing rules.
It is time for the sector to pick a fight with artists, and artist’s estates and even your donors. It is time for the sector to pick a fight with anyone that is preventing you from being allowed to have a greater — and I want to stress greater, not total — license of interpretation over the works which you are charged with nurturing and caring for.
It is time to pick a fight because, at least on bad days, I might even suggest that the sector has been played. We all want to outlast the present, and this is especially true of artists. Museums and libraries and archives are a pretty good bet if that’s your goal.
Open Access at ESA
Images, videos, sounds, and 3D models are now available from the European Space Agency under a Creative Commons Attribution Share-alike license.