Hacker News new | ask | show | jobs
by airstrike 2155 days ago
The question is: do we need flexible fonts? Other than fine-tuning the monospace font to fit your exact preferences given the hours you spend coding, everything else seems to be a matter of just picking an appropriate type that fits your project
5 comments

As a coder, probably not.

As a designer, absolutely. The exact weight of a font can make a ton of difference in a finished product, and it's frequent to be frustrated that the font isn't available in the weight that would look right for the needs -- you need something in between semibold and bold, or something in between regular and condensed, or something oblique but not that oblique.

It's the difference between a design being good, and a design being beautifully "just right" with everything perfectly in proportion.

So for that, variable fonts are a godsend.

That being said, I've never seen a slider between proportional and monospace before. That's just weird. :)

Is there anything related to outputting a static font from a variable font + config? The problem I have with variable fonts is that whilst they're smaller than an entire font family, they're usually significantly larger than individual fonts -- to the point that I can't justify using them on the web.
It's perfect for those times where you need something monospace, but not too monospace.
Not sure if you're being facetious - it's actually not a crazy idea. For example: displaying 'code' at display font sizes.

If I want to show something that looks like code - like an HTML tag or something - at a heading size on a page or a poster, a proper monospaced coding font is going to look bad. Playing with the MONO slider on https://www.recursive.design/ for a string like '<blink />' does a good job of producing something that looks like code but isn't swamped with too much whitespace...

Interesting. But given that so many big brands simply use Arial or Helvetica for their logo and brand, is this really a thing?
Helvetica (Neue) comes in more weights and variations than practically any other typeface. So it is really a thing.

https://www.myfonts.com/fonts/linotype/neue-helvetica/

Also, Helvetica is popular in large part because of the very precise personality it has with is quite amenable to the image corporations often like to portray. It become widely available on computers, starting with Macs, because it was already such a useful font. Major corporations aren't choosing Helvetica simply because it's a default font on computers. And, of course, it's not like a majority of companies use Helvetica for their branding or anything -- it's a popular font, but where popular means maybe 3% or 5%, not 50%.

Another way of saying it would be:

Helvetica was put on Macs because it was so popular as a useful font, rather than it becoming popular because it was on Macs.

This is effectively the third try at making something like this work. Arguably the first "variable" font was Metafont which was limited by its programmatic interface which made most type designers reject it as a useful tool. The roughly contemporaneous development of PostScript and the subsequent opening up of the Type 1 format to non-Adobe font development was sufficient to end any possibility of MF being a viable type development system. Still, its fully programmable nature meant that it was possible to have parameterized typefaces and opened the possibility for something like this to appear elsewhere.

Take two was Adobe's Multiple Master extension to Type 1. Technically this is still used by Adobe Acrobat to handle fallbacks for missing fonts, but as an end-user technology it was a failure, largely because of difficulties in being able to use the interpolated fonts—few applications allowed direct selection of interpolated designs and users had to generate them in ATM instead.

So now we have the third attempt, with better application support, which has some hope of success. For text type users, the appeal is the ability to finally regain optical scaling for type designs. Traditionally, as a type design was created at a smaller size, it would become relatively darker with less contrast. Perhaps the most dramatic example of this in everyday use is to compare the spindly appearance of "fake" small caps with the more robust appearance of properly designed small caps. So this is one case where, yes, we really do want this ability.

Just speculating, but this could help in any web project where you're including multiple font weights/styles -- Currently that involves building a CSS font-family from multiple font files which have a lot of redundant information. With a variable font, your font family could pull from a single font file and use the font parameters to tweak different styles.

The HN audience loves to discuss the bloat in web design -- If you can reduce 500kb of font-<heavy, bold, italic, light> files into a single file that interpolates between font vectors dynamically, that goes a long way to avoiding excessive resources. And you also get the benefit of being able to tweak the parameters of each font style without changing out static files.

For example, with Recursive the entire static font family come in at 12.8mb, while the dynamic font family in a single file is 1.45mb. Obviously you wouldn't load up every variant and Recursive is a very large font, but I could certainly imagine replacing ~8-10 font files with a single variable font.

They offer web optimized versions. The full variable font in woff2 comes in at 523kb, and then there are subsets available from there (reduced character set, reduced customizability), and you can even build your own font with only what is needed.
Are variable fonts supposed to have a smaller file size? The examples I've looked at have been bigger than including all the variations you'd expect to use of the non-variable version. Are there examples of a significant file size saving?

Generally with web design, you want to stick to a small number of font weights anyway so if the file size isn't smaller, what's the core motivation?

It depends. The font rendering process is based around "masters" which can vary in count. One font could have one master for all the weights, or multiple masters - for the bold/normal/light. Depending on the master count, the size can differ.

The key thing also is the number of web requests. This is not a trivial detail. One variable font can be less web requests.

> The key thing also is the number of web requests. This is not a trivial detail. One variable font can be less web requests.

Is the number of web requests a factor if you're using HTTP/2 though?

Variable fonts are a nice match for rich text editors. They allow you to have any combination of italic and font weight without having to load in a whole font family.
I can imagine wanting to use a flexible font for syntax highlighting for colorblind people and monochrome displays like eInk.