[css-fonts] font-weight-adjust

With the same font-size, the apparent size of the text varies depending on the actual fonts used, and we have font-size-adjust to deal with that.

However, the same is true about font-weight, and we don't have a way to cope. Font-weights numbers are merely relative to each other within a font family. Just because two fonts both support the same numerical values for font-weight does not mean the stroke width and perceived thickness will be the same. Conversely, even if both font families have weights where they visually match each other, there is no guarantee that they will map these to the same numerical value.

Based on this, I suggest that a font-weight-adjust property, analogue to font-size-adjust property, would be a useful addition.

Sample use case, based on a real situation at encountered at Bloomberg:

You have a custom font, which you really like, and use for your body text. Its normal/400 font weight is somewhat thick (and its heavier weights are thicker). The fonts support a good chunk of unicode, but not all of it, so you have a fallback font to deal with the rest. The fallback isn't as nice, but but it's not practical to commission someone to make one that covers every language you need to support, and you've found a generic font that looks acceptable. However, this font (which also supports multiple weights) looks thinner than your favorite one at normal/400, so if you display chunks of text which rely on both fonts, such as CJK text (thin fallabck) with latin numerals (thick base font), it looks bad. The fallback font's 600 would be a better match for the base font's 400.

Using this:
  body {
    font-family: my-favorite-font, my-fallback;
    font-weight: 600;
  }
does not not solve it, since it also base the base font thicker, and the weight gap remains. So you'd like to say something like:
  body {
    font-family: my-favorite-font, my-fallback;

    font-weight-adjust: 400 to 600 / 600 to 800;

    /* imaginary syntax saying that for the fallback font,
    the UA should use the 600 (resp. 800) weight when 400
    (resp. 600)is specified.*/
  }
  strong {
    font-weight: 600; /* makes the base font 600, and the fallback 800 */
  }

Unlike font-size-adjust, I don't think we can use a multiplicative (or for that matter additive) factor, since font-weights, despite looking like numbers, are not something you can do arithmetic on, which is why I'm providing an explicit mapping.

Syntax aside (yeah, bikesheding ahead), does that make sense? If not, why not?

 - Florian

Received on Monday, 19 October 2015 08:22:52 UTC