W3C home > Mailing lists > Public > public-css-archive@w3.org > July 2019

Re: [csswg-drafts] [css-fonts] system-ui-serif, system-ui-monospaced, and system-ui-rounded (#4107)

From: Koji Ishii via GitHub <sysbot+gh@w3.org>
Date: Tue, 30 Jul 2019 13:59:16 +0000
To: public-css-archive@w3.org
Message-ID: <issue_comment.created-516431332-1564495155-sysbot+gh@w3.org>
> If the use case is to adaptively mimic the OS look, ...

This is probably the most confusing part, but as I read more feedback and articles about `system-ui`, authors do not want to mimic the OS look. I thought they do too before, and I'm revising my understanding now.

The article [Using UI System Fonts In Web Design: A Quick Practical Guide](https://www.smashingmagazine.com/2015/11/using-system-ui-fonts-practical-guide/) explains that the goal is:
1. Feel more like an app.
2. To draw clear lines between the content and user interface.
3. **To use modern, beautiful fonts with zero latency**.

and the emphasis on the item 3. It says using system UI fonts suffice this goal, namely Roboto, San Francisco, and Segoe.

Then this [github article](https://infinnie.github.io/blog/2017/systemui.html) explains that, it turns out that using the system font of the platform does not suffice these goals on older and/or CJK versions of Windows. They prefer Segoe or Arial over decades-old Tahoma or poorly rendered Chinese fonts, and that stopped using `system-ui`. And this isn't only github saying.

In my new understanding, authors want modern, beautiful UI fonts, rather than the actual system UI fonts of the platform. I think it's more similar to a UI version of `sans-serif` generic font family rather than a different version of `font: menu` keyword. Authors want to use `serif` or `sans-serif` for UI, rather than exactly the same font family, style, and size of `caption` or `status-bar` of the platform.

I'm looking into updating Blink's `system-ui` to reflect the feedback, and this proposal looks like a good extension to it.

-- 
GitHub Notification of comment by kojiishi
Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/4107#issuecomment-516431332 using your GitHub account
Received on Tuesday, 30 July 2019 13:59:18 UTC

This archive was generated by hypermail 2.4.0 : Tuesday, 5 July 2022 06:41:50 UTC