I find this soooo relatable:
I know when I look at a design (heck, even if I know I’m not going to be building it), my front-end brain starts triggering all sorts of things I know will be related to the task.
Difference is, Chris comes up with some very, very clever techniques.
Mandy’s experiments with text effects in CSS are kinda mindblowing—I can’t wait to see her at Ampersand at the end of the month!
This looks like fun: it’s like a clever slot machine for pairing typefaces.
I thought the “machine learning” angle sounded like marketing bullshit, but it’s genuinely fascinating.
A nice intro to variable fonts.
Over the course of a semester, students at UMPRUM Academy in Prague made variable fonts. I think Krabat might be my favourite.
A drag-and-drop tool for examining variable fonts (kind of like FontDrop but with more sliders to play with).
I didn’t get the name until I said it out loud.
Service workers, push notifications, and variable fonts are now shipping in Edge.
Rich enumerates some changes in how you set up variable fonts. So if you’re pulling in a font that has weight as an axis, you can now add this to your @font-face rule:
font-weight: 1 999;
I’m already very excited about variable fonts—I’m going to be positively giddy by the time Ampersand rolls around (which, by the way, you should totally go to—it’s going to be sooo good!).
Here’s an interesting twist on variable fonts: one of variable axes is serificity …serificousness …serifness. The serifs. The serifs, is what I’m trying to say.
One small point: it seems a bit of a shame that there are separate files for regular and italic—it would’ve been nice to have a variable axis for italicity …italicousness …ah, screw it.
If you’ve ever wondered what it would be like to be a fly on the wall at a CSS Working Group meeting, Richard has the inside scoop.
The consensus building is vital. Representatives from all the major browsers were in the room, collaborating closely by proposing ideas and sharing implementations. But most fundamentally they were agreeing together what should go in the specifications, because what goes in the specs is what gets built and ends up in the hands of users.
I’m soooo excited that Mandy is speaking at Ampersand here in Brighton in June!
Be there or be square.
A simple resource for finding and trying variable fonts.
A handy browser-based tool for examining font files to see which features they support.
You’ll need to be comfortable with using the command line, but this is a very useful font subsetting tool from those clever folks at Filament Group.
A look at the font stack that Github is using.
The gorgeous website for this year’s Ampersand conference might well be one of the first commercial uses of variable fonts in the wild. Here, Richard documents all the clever things Mark did to ensure good fallbacks for browsers that don’t yet support variable fonts.
Save the date! The best web typography conference in the world is back in Brighton on June 29th, and this time it’s at the best venue: The Duke Of York’s.
In fact, you can do more than saving the date: you can snap up a super early bird ticket for whopping £85 saving.
A quick guide to all the font-variant-... stuff in CSS.
These experiments with transitioning variable font styles on hover might be silly, but I can see the potential for some beautiful interaction design.
Rob walks us through the typographic choices for his recent redesign:
Most of what I design that incorporates type has a typographic scale as its foundation, which informs the typeface choices and layout proportions. The process of creating that scale begins by asking what the type needs to do, and what role contrasting sizes will play in that.