Re: [csswg-drafts] [css-fonts] `system-ui` behavior is undesired for some users (#3658)

> But let's go back the topic: I don't agree with you that MS YaHei is "not terrible"; it's too wide compared to majority of English typefaces. 

Have you seen Tahoma for Windows 7 Classic theme (screenshot provided in previous comments)? It is wider and higher than Segoe UI, but users does not have a problem with it. What you are trying to do now is you are forcing people to follow *your own aesthetic standards* by saying the font is too wide compared to Segoe UI and ignoring all the other benefits of `system-ui`.

> Also some punctuations are totally ruined:

This is non-issue: The font being used is compliant to GB 18030, which makes the quotation mark full-width as it is used in Chinese for quotation (E.g. `“我觉得:‘你觉得’。”`) This is a legacy problem related to the decisions of GB team and Unicode to share a codepoint for quotation marks. Font support (in Microsoft YaHei) from its vendor Microsoft is required to fix this "problem", and not a problem of `system-ui`.

> Regardless, it being "enlarged" alone is already a serious drawback since the designers of the sites often have a fixed (perceptive) font size in their mind. Let's put it this way: if English users see the font in that size is expected, why Chinese users (when seeing the same English content) would need something different?

If you are designing for cross-platform, multilingual use, a "fixed (perceptive) font size" is a *very* bad decision. Some languages requires bigger line height/size to accommodate their respective languages, which sometimes reflects on to the fonts being used. It is better to use the designated font (and size) provided by the system for each language rather than trying to enforcing a constant aesthetic across all language groups.

If the system vendor does not think enlarging text is required (eg in Mac), *then* that will fit your usage. Else, just write your own font stack.

> Totally false. Did you test it? Firefox and Chrome have slightly different fallback mechanics [1] in this regard, but both will fallback to Chinese version glyphs on a Chinese Windows. 

Sorry, this is my fault. I did not test this issue thoroughly.

> It even works with Chinese Windows with browsers in English display language.

> Even if you tag it with <lang="ja">, it will still use MS YaHei font if you use system-ui. See the screenshots above.

However, I failed to recreate this issue. `system-ui` with language tagging works just fine on pure English Windows. Screenshot below (latest stable Chrome & Firefox):

![en-user](https://user-images.githubusercontent.com/33471049/192789626-b56847b4-5934-40c2-a922-113f9ffe6441.png)
![en-user-firefox](https://user-images.githubusercontent.com/33471049/192789631-bec8b302-084d-4c3b-8db8-278c2b2e952e.png)

This is an issue with Windows multilingual and should be raised to Microsoft. However, this alone shouldn't be an issue to block websites from using `system-ui` as the issue is vendor-specific. The testing works fine on Android and iPadOS, with respective correct locale display, and even better display of Latin text using Roboto (both using Simplified Chinese UI):

<details>
  <summary>Screenshot of lang on Android and iPadOS</summary>

![image](https://user-images.githubusercontent.com/33471049/192778605-729618b4-8e0c-495f-a140-ad5085ba26ef.png)
![image](https://user-images.githubusercontent.com/33471049/192778769-c56673a4-2f0d-43b3-8ca4-5319c3302919.png)

</details>

Also, I will argue that displaying the *correct localization with correct font* **when no language tag is present** is more important than displaying the *best visual result* when no language tagging is done. You definitely do not want Meiryo to overrride the Chinese part (especially by default, Meiryo is overriding Microsoft YaHei in regedit) as most of the internet *does not tag languages properly* (e.g. GitHub user content). Using `system-ui` will ensure the correct locale is displayed based on system settings.

> Also, system-ui is intrusive. If I don't like X font, I can always manually replace it with

`system-ui` is *not* designed to be replaced. It is just a keyword that is used to replace Mac's hacky `-apple-system,BlinkMacSystemFont` font stack while expanding the same functionality across platform, such that developers can integrate their website *using the system font*. For the screenshot provided in ["the issue"](https://infinnie.github.io/blog/2017/systemui.html) by infinnie, remember, this is what the system font has already been using.

## English
### Aero theme
![en-aero-font](https://user-images.githubusercontent.com/33471049/192782798-ff30bfb8-498d-4b1f-a408-fe875d4ab8db.png)
### Classic theme
![en-classic-font](https://user-images.githubusercontent.com/33471049/192782821-d777bd6e-4ef2-470a-b97d-286be8f9fc4e.png)

## Simplified Chinese
### Aero theme
![zh-aero-font](https://user-images.githubusercontent.com/33471049/192782845-b52bedce-9118-4ef0-b1c7-da5dd10a215f.png)
### Classic theme
![zh-classic-font](https://user-images.githubusercontent.com/33471049/192782853-b796d611-56ce-4a31-81c5-858c02fa860d.png)


There is no point to replace `system-ui` for something *you* want instead of what its intended purpose is. If you don't like it, write your own global CSS with `!important` keyword to always replace the site font.

> At last, a more general point: https://infinnie.github.io/blog/2017/systemui.html is not the holy grail of system-ui issue. Refuting that alone doesn't mean all issues are non-issue. As I displayed above, the issue of it isn't limited to "niche, classic theme" users.

Please note, *all* issues I have been looking on `system-ui` ([StackOverflow](), and including your issue) points to this specific target group: Windows, Simplified Chinese users; literally no other languages have any related kind of issues.

TL;DR: **`system-ui` is for using the current system font. Locale tagging might be broken for some languages, however all texts will be displayed by the user's preferred locale first instead of relying on prewritten font stack. Some fonts for specific locale (most notably Simplified Chinese) will be bad in some particular instances; in other languages it will be enough for normal daily usage.**

Side note: Windows has always been bad on multilingual display; Win32 doesn't even handle multilingual text in the same line. That is the main point why this "issue" is being brought up in the first place from Simplified Chinese users (bad Latin in SimSun from Windows 95-XP, "wide" Latin in Microsoft YaHei from Windows Vista-11). However, there is no way that this should be the point that *all* sites **must** stop using `system-ui`, and CSS should drop support for `system-ui`. It is a great tool for devs to use, and if you can't handle it, do write your own font stack; just please dont shove your opinion through all other user's throat. The most minimal fix that does not affect other users should be contacting Microsoft and let them fix it (e.g. WinUI), rather than blocking all other global users from using `system-ui`.

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


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

Received on Wednesday, 28 September 2022 13:23:14 UTC