ms-studio / karmilla

An expanded version of the amazing Karla webfont, adding support for various languages (French, German, Norse, Hungarian, Latvian, Icelandic...)
Other
150 stars 29 forks source link

Question: Making numerals tabular #46

Open JonellaCulmer opened 6 years ago

JonellaCulmer commented 6 years ago

While karla is excellent for web readability, the proportional numerals make it difficult to use them in a list. For example, when used in a list the numbers look vastly different. In the example shown below, at first glance it kind of looks like the numbers are in a somewhat random order, but they are listed sequentially. Would it be possible to convert numerals to tabular figures instead of proportional ones?

https://www.fonts.com/content/learning/fontology/level-3/numbers/proportional-vs-tabular-figures

screen shot 2018-06-27 at 4 03 16 pm

ms-studio commented 5 years ago

I just received a similar request by email, asking about tabular figures (tabular numbers):

Our company is currently using Karla font, but Karla was not commissioned to include tabular figures. I learned from Jonny Pinhorn (the creator of karla) that Karmilla might have, as it's a derived font family but with useful improvements. So I'd reach out to see if Karmilla is in tabular figures? and really appreciate if you can help and thanks for your time in advance!

I image that it can't be too hard to add those – but how? One way is to add them as an OpenType feature. There is an OpenType value for that, called 'tnum'.

There is a CSS property that allows to access that feature in webfonts (source: MDN):


/* enable tabular (monospaced) figures */
td.tabular { font-feature-settings: "tnum"; }

According to MDN, it's actually better to use the associated longhand property:


/* enable tabular (monospaced) figures */
td.tabular { font-variant-numeric: tabular-nums; }

How to create the tabular-nums in FontForge?

Great question...

There is some documentation here: https://fontforge.github.io/gposgsub.html

It says the following about the "single adjustment" subtable inside the GPOS table (GPOS stands for "Glyph Positioning"):

This sub-table allows the font designer to change the metrics of a specific glyph. The feature tag will provide a context in which the change should occur. For instance the 'tnum' (tabular numbers) feature could change a proportionally spaced digit by adjusting its advance width to be some set value and then centering the digit (by adjusting the left side bearing) within the new width.

So it certainly can be done... Here is more information: https://fontforge.github.io/charinfo.html#position

ms-studio commented 5 years ago

Didn't manage yet to get the Open Type table to work...

In the meantime, I produced a workaround font, a Karmilla Tabular typeface with the numbers 0-9 with equal width. Direct link: https://github.com/ms-studio/karmilla/raw/tabular-num/fonts/ttf/Karmilla-Tabular.ttf

You find this code in a special branch: https://github.com/ms-studio/karmilla/tree/tabular-num

davelab6 commented 5 years ago

Last week I was talking to @yangqin20 here in NYC about this, and I asked Mirko Iverson to work on this - for Karla as she wanted the tabular figures for italics too - and this work can go into Karmilla for sure.