[css-fonts] Selecting generic fallbacks

[r12a]

This issue is intended to be a home for a topic arising during the joint CSS+i18n WG monthly telecon.

The latest minutes say (https://www.w3.org/2022/11/22-i18n-minutes.html):

addison: Consider nastaliq, is it tied to language or is it a font style?
… affects legibility

florian: Might not meet the bar. Meets the bar of it's important
… but it's not clear that you have documents that contain both nastaliq and something else, and if you lose the distinction you lose information

addison: unclear you'd have document where they're validly mixed
… maybe if you have Arabic document talking about Urdu

florian: it's very relevant, but not very relvant contrast
… that's kind of thing that doesn't meet fantasai's bar
… however, might also be nice to have, because it's a thing people want
… but if the browser is smart enough, which it should be, if you say it's Urdu it should make it nastaliq without you telling it to
… because that's how Urdu should be rendered
… for Persian, less clear, could have either

It's not really about mixing or contrasting font styles on a page. It's more fundamental.

Here's a use case for nastaliq. Let's imagine that an Urdu or Kashmiri content author has created a page and would like to apply some nifty opentype features that come with the font Awami Nastaliq. So they declare that font as the primary font for the whole page. Let's suppose that they also add Noto Nastaliq Urdu to the font stack, in case someone doesn't have Awami Nastaliq installed. Beyond that, though, it's hard to guess what other nastaliq fonts the reader may have on their system.

Along comes a reader who has neither of those fonts installed, but does have Nafees Nastaleeq or one of its derivations. Unfortunately, the font used for the page currently falls back to a naskh font, even though the reader has a nastaliq font available to them.

This is an issue. It actually has practical consequences. Nastaliq is not just a fancy stylish font - people in Pakistan or India will struggle to read text that is not in a nastaliq font. And in addition, it will not fit with their cultural identity. Just a couple of weeks ago i watched a conference presentation by an Urdu font expert who explained that when Urdu speakers come across some text in a naskh style font they tend to ignore it, because the expect that it's likely to be Arabic language text.

So there needs to be some way for the content author to say that if the browser falls back to a different font it should choose one that's in the nastaliq style. We're not talking about special bits of text like headings or fancy boxed sections, we're talking about the whole page.

This also applies in a slightly different use case, but one that may have value, where the content author decides that they don't really mind which font is used, so they don't provide a specific font name in the font-family property values. However, if they are writing for an Urdu or Kashmiri audience they don't want the text to come out in naskh style - which currently is the most likely outcome. So they'd like to be able to say: font-family: nastaliq. We see this in the West already, where people don't assign a specific font for their page, but might say font-family: sans-serif. Having a nastaliq generic name allows people speaking Urdu and Kashimiri to do the same.

[svgeesus]

Update: CSS Fonts 4 now specifies the generic(nastaliq) generic font family, largely using text proposed by @r12a.

We could really do with an illustration, similar to the ones we have for serif, sans-serif etc, showing a couple of characters or a brief phrase in two or three fonts that illustrate the visual characteristics of the Nastaliq style. Together with the name of the font underneath.

[r12a]

I was actually wondering whether you needed that yesterday. I can probably come up with something, if you like. Or you could try yourself using https://r12a.github.io/scripts/fontlist/index.html?script=arab#nastaliq fonts and the Urdu sample at https://r12a.github.io/scripts/samples/index.html?script=arab#urdu

[svgeesus]

I also considered doing it myself, but my preference is that a fluent Urdu reader pick the short run of characters to illustrate, and also verifies that the rendering is correct.

[r12a]

What may also be useful is to show the same piece of short text in both naskh and nastaliq styles, so that readers can appreciate the difference. I think that ideally the example would show at least two words with clearly sloping baselines, such as السلام علیکم.

Here's the same text in naskh:

[svgeesus]

I agree, that would be helpful. Preferably as two separate images.

[svgeesus]

I was actually wondering whether you needed that yesterday. I can probably come up with something, if you like.

@r12a I'm hoping to get CSS Fonts 4 published before the holiday season, as it has been a while. Is it realistic to get that naskh vs. nastaliq image before then, or should I assume it will be added in the new year?

I'm a bit worried the new generic() families sound a bit mysterious without visual examples.

[r12a]

@svgeesus I thought you wanted to find a fluent Urdu speaker (writer). Are you asking whether we can do that, or asking for me to supply some text (such as the example above)?

[r12a]

@svgeesus in case it's the latter, here are a couple of SVGs. I didn't include text in the image (like the images above the nastaliq section) because that's not generally recommended. I think it would be better to use text-based labels. (And then, of course, the caption.)

The text for the SVGs is السلام علیکم (it's a greeting) and it's Urdu spelling.

Do you also need images for the kai and fangsong subsections? I guess @xfq may be able to help with that.

[svgeesus]

@r12a thanks for the images; for the caption, what was the name of the font used for each?

Do you also need images for the kai and fangsong subsections? I guess @xfq may be able to help with that.

@xfq would you be able to do that?

[r12a]

Oh, interesting... those SVGs don't show up well in dark mode in this thread.

Anyway, the font for the nastaliq is Noto Nastaliq Urdu, and the naskh is Scheherazade New.

[svgeesus]

Oh, interesting... those SVGs don't show up well in dark mode in this thread.

Sadly, a known problem for SVG included using html using img which prevents external styles, fonts, and images from being loaded.

[xfq]

Do you also need images for the kai and fangsong subsections? I guess @xfq may be able to help with that.

@xfq would you be able to do that?

There are two SVG files in https://www.w3.org/TR/clreq/#kai and https://www.w3.org/TR/clreq/#imitation_song .

Would those be enough?

[svgeesus]

Thanks for the pointer, those look great.

[svgeesus]

So, CSS Fonts 4 has been updated on /TR and the section on generic font families includes:

• generic(fangsong)
• generic(kai)
• generic(nastaliq)

I suggest this generic issue could be closed, and more specific issues started for newly proposed generics.