046 – Friday, 21st May 2021
Hello again! I’m Mark, and this is the Specimen Digest, a weekly typography newsletter.
I continue my questioning of the usefulness of variable fonts. Not in any luddite view of the world, you understand, but figuring out how I can use them in my own work. A few questions continually on my mind are: ‘why would I deviate from the instances defined by the type designer?’, and ‘if I’m only using a couple of weights, is the extra file-size cost of a variable font worth it over one or two more requests to the server’. The ebb and flow of trade-offs for using variable fonts in digital products.
This week, my mind has been firmly focussed on what I consider the most useful of variable axes for type setting – particularly in a digital context – Optical Size.
As you might know, in some type families, some glyphs look dramatically different depending on if they are intended to be used for captions or folios at one end of the spectrum, and display or ‘poster’ weights on the other. This is the optical size. Is the intended usage small or large. But it’s not as straight forward as that. Particularly when you consider digital products being presented in the plethora of devices and environments. Throw into the mix dark mode. Legacy devices with poor screen resolution (yes, they still exist!). And single type families for entire brands, suites of products, and all potential environments (print, physical, digital). All of a sudden, being able to tweak optical size becomes a very powerful tool. Let’s consider one example I looked at this week: typesetting for dark mode.
Most type considerations for dark mode are exclusively colour. Changing the foreground and background on a toggle or by the user’s OS preferences. But, it shouldn’t stop there. Typographic considerations for dark mode should extend to line height and spacing, font weight, and finally, optical size.
Light type on a dark background on a digital screen is optically higher contrast. Despite often conflicting typographic ‘rules’, I’ve found the following considerations useful when defining dark mode styles all with a view of smoothing out those contrast issues:
And now, a caveat. This tends to be highly subjective, dependent on the typeface you’re using, and how comfortable you are at doing those things. Try to look at it like this: like a chef developing their palette, this is a designer developing their typographic sense. It requires practice. And heavy reliance on that question: ‘does this feel right? Give it a try!
Until next week!
Mark
NaN Jaune Where to start? ‘Closed apertures, display for text and text for display, Jaune follows this NaN motto: take a bad idea and do it well, or at least die trying.’ Behind the fun exterior, – I mean, a game!? With a leaderboard!’ this specimen for Juane has some really great features. The optical size slider is perhaps the most useful here.
Oatmeal Sans Yes, stacked svg graphics but a striking and bold specimen for Oatmeal Sans. Another neo-grotesque, but it has some striking alternates. The specimen only hints at those features, so whilst the graphic design is appealing, it’s lacking those evaluative components for a user to explore it.
MD Primer MD Primer is a digital reinterpretation the flaws and inconsistencies of early sans-serifs. Big, bold, stacked type testers are the order of the day. You may notice that the type tester words are all of a full screen width. A simple, subtle but sophisticated addition to the specimen.
Mantar A simple one-pager for Mantar. The accompanying mini site is an immersive story-based experience. Be sure to read the design notes for some detail on the design brief and exploratory illustrations.
NON Section I’m a big fan of experimental typefaces. ‘NON is a series of limited edition type systems that utilise the basic latin and numerical character sets to create abstract forms, rhythms and fields from otherwise ordinary text.’. In some ways, however, it would be nice if the specimen expanded on this brief.
There are more specimens added this last week on the Type Specimen website. You can subscribe to the RSS feed for daily updates, or follow along on Twitter, if that takes your fancy.
Simpler Font Licensing: Introducing V2. This looks very promising from Mass Driver. I do hope other foundries adopt a similar approach.
Design Regression: a project by Rosetta
Grilli Type designs a bespoke typeface for Pinterest that lets pinned imagery “shine”
Fluid Typography. This is a really handy little generator for producing the clamp CSS rule.
How Important Is Harmony When Designing Multiscript Type Systems? An Interview With David Březina
Additional Mac Symbols. Opens up a ton of additional options ranging from dingbats and geometric shapes to international character sets for use on the Mac.