Re: [csswg-drafts] [css-fonts-4] Behavior for variable fonts with 'ital' axis ambiguous / underspec'ed (#3125)

On Mastodon, @svgeesus [asked for examples of real variable fonts that provide oblique and italic options independently](https://mastodon.social/@svgeesus/112134755993656762). However, based on the discussion both here & there, it seems font designers are avoiding that for technical reasons, rather than design ones. So I started imagining a design that would include both.

So here is my rough design spec (samples below), for a handwriting font family with two continuous variable axes: SLNT (slant angle) and CRSV (cursive style, from block print through connected cursive). I want easy access to six named instances: Normal, Oblique, Italic, Upright Italic, Cursive, and Upright Cursive. The slant angle for the named oblique style is different from the slant angle used in the named italic and cursive styles. I may or may not make masters for the higher slant angle in the cursive styles, but otherwise assume that both the change in slant angle and the change in cursive style are continuous between the shown samples.

![A scanned, hand-lettered table. Columns labelled SLNT=0, 20deg, and 25deg. Rows labelled CRSV=0, 1, and 2. The cells contain the words "The fancy text" written in different lettering styles, and some cells are also labelled in a different colour. The cell labelled Normal, at SLNT and CRSV 0, is written in a geometric upright block handwriting, similar to what would be used to teach young children how to print letters neatly. The sample labelled Italic is at SLNT=20deg and CRSV=1; the letters are slanted and many have curved flourishes at the ends of the strokes. The sample labelled Cursive is at SLNT=20deg and CRSV=2; it has similar flourishes and slant, but now in a fully connected script. The cells with SLNT=0 and CRSV=1 or 2 are labelled Upright Italic and Upright Cursive, respectively. They have the same flourishes and connectedness as their slanted equivalents, but with the vertical orientation of strokes maintained. The cell labelled Oblique is at SLNT=25deg and CRSV=0; it has the simple geometric shapes of the normal style, but at a sharp slant. An oblique sample with CRSV=0 and SLNT=20deg is also given but not labelled.](https://github.com/w3c/csswg-drafts/assets/9876129/c892559f-5a5b-4e6f-8424-dcc26f786452)

My question: How should this be implemented in OpenType? How should the styles be accessed in CSS?

Requirements:
- A CSS author should be able to access the named instances directly by name. (This is currently possible when loading the font, with the [`font-named-instance`](https://drafts.csswg.org/css-fonts-4/#font-named-instance) `@font-face` descriptor, and then specifying unique values for other style descriptors or unique font-family names that it should match.)
- They should be able to modify the variable font axes independently. (This currently seems to not work well in combination with the previous requirement, although you could have separate `@font-face` rules for loading the same font file either with all variations enabled or as specific named instances.)

Ideally (in my opinion):
- The ways to set the different styles should use independent font properties that cascade nicely in CSS, and which fall back gracefully if my font doesn't load. (That is, not using `font-variation-settings` for simple normal vs italic style switches.)
- A CSS author should be able to access the named normal, oblique, and italic styles with a simple keyword in the `font-style` property / descriptor, and the CRSV and SLNT angles will be adjusted to match the named styles in the font.
- They should be able to access the upright italic style with `font-style: italic 0deg`.
- They should be able to choose any other combination of the CRSV and SLNT axes to use as their normal vs italic styles, and swap between them with the `font-style` property. (I *think* this is currently possible by setting the axis values and desired font-style value in two separate `@font-face` rules, but I have no idea how that interacts with more complex values in the `font-style` property on a given section of text.)


-- 
GitHub Notification of comment by AmeliaBR
Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/3125#issuecomment-2016559702 using your GitHub account


-- 
Sent via github-notify-ml as configured in https://github.com/w3c/github-notify-ml-config

Received on Saturday, 23 March 2024 17:49:35 UTC