4

On Google Chrome, Chinese characters are being marked in different scripts on the same site, and traditional characters are rendered in a sans-serif font while simplified are rendered in a serif font:

On Duolingo, we have two different fonts in the same sentence:

Duolingo sentence discussions post showing two different fonts in the same sentence

On Yabla, the search box renders 在饭馆 with 在 in traditional and 饭馆 in simplified:

Search box on Yabla rendering 在饭馆 with a different font for 在 than 饭馆

This started today (07/16/2022) and I have not made any changes to my font or language settings since about a week before this started happening. I am on Version 10.0.19044 Build 19044 of Windows 10 and running the latest versions of Google Chrome (Version 103.0.5060.114) and Discord (Stable 138254 (8e7d809)).

I do not have any custom fonts installed for Chinese. This issue persists in some apps (such as Discord) but does not persist in other browsers such as Firefox or Opera. I have checked my font settings in Chrome and there are no options for fonts in languages different from the UI/System language, which in my case is English.

I have tried uninstalling and reinstalling both traditional and simplified Chinese in my Windows settings. In Chrome, when selecting the different characters with the inspect tool, it displays that they are being rendered with the same font set but apparently different fonts are being chosen for each script.

If it is not possible to correct this issue at the source (identifying characters correctly) then I would like to know how to set the default font for each language so that the characters in the simplified script appear in a sans-serif font that looks similar to the traditional font.

6
  • You have to upload the screenshot, on which there is a mix of fonts, otherwise, this question is unanswerable and shall be closed for lack of clarity.
    – r13
    Commented Jul 17, 2022 at 1:27
  • I'm very confused. Does the second screenshot ("Chinese English Pinyin Dictionary") not show a clear enough difference in font between 在 and 饭馆? Commented Jul 17, 2022 at 1:48
  • Along with that, 地方 is in a different font the second time it shows up in the first screenshot. Commented Jul 17, 2022 at 1:51
  • @sovietcitrus I see the font disparity clearly, and have had the issue before on my Windows machines in Chrome too.
    – Michaelyus
    Commented Jul 19, 2022 at 14:00
  • I saw the exact solution to this problem on 知乎 a while back. I'll see if I can still find it.
    – iBug
    Commented Jul 26, 2022 at 20:48

3 Answers 3

1

Okay, the authors of a website can specify what fonts to use for that site. That specification can be in a like so "font 1", "font 2", "font 3", ..., serif (or sans-serif)

What the browser does is it will search your computer to see if "font 1" is installed (or downloaded from the Net). If so, use it. Otherwise, move down the list and repeat.

It also happens that, for CJK characters, not every character is encoded in every font. If the brower encounters a character that's not in "font 1," it will go to "font 2" to see if it's there, and so forth.

So if "font 1" specified does not contain simplied Chinese, the browser is goinf to use two different fonts, resulting in what you saw.

1
  • agreed, While OP may be able to correct this issue by adding fonts, the issue is is not inherently anything in their settings. what is displayed is inherently in the webpages//apps//or even machine itself's display coding. Just like how emoji's will appear differently between different devices, or how my email font will render differently on different computer's, or a website will defualt to traditional or simplified-- all with zero setting changes.
    – zagrycha
    Commented Feb 18 at 23:32
0

As unicode CJK (means Chinese, Japanese and Korean characters) is rather a large word set, most fonts will only implement their target languages to reduce size. For Chinese fonts, some would only implement Simplified Chinese characters while some would only implement the Traditional one.

“在” is of same shape in both Simplified and Traditional, while “饭馆” are not in the traditional Chinese character set. They are replaced with “飯館”, and if a font designated for Traditional Chinese is used, “饭馆” would not render correctly, and fallback to a font your computer have.

The creator of the website may choose a font causing such problem. The font provided by Microsoft ususally have the shapes for both Chinese flavor (otherwise, the “饭馆” would be rendered as empty boxes), but it may also go wrong. You can do these to check where the problem lies:

  1. Press "F12" to call out the DevTools
  2. Use "Inspect Element" or press Ctrl + Shift + C and select the wrongly displayed font
  3. In the "Computed" tab, check the "Rendered Fonts", you may see what the font is, and whether the font is from your device or from Internet. Check the font

If your font is shown as from a local file, you may need to:

3
  • While this does help me understand the problem, I can't actually set the default font for foreign languages on Chrome (The Chrome UI is set to English). I also installed Traditional Chinese and the font problem did not subside. I have updated the post to reflect the update. Commented Jul 26, 2022 at 1:24
  • @sovietcitrus That would not be possible to assign fonts to a language, as web tech itself does not describe languages. You can try set Chrome's "standard font" and “sans-serif” to "Microsoft Yahei (微软雅黑)". This may affect all fonts displaying on Chrome, but it's the typical behaviour on Windows and Chrome install when you set the language to Chinese. Commented Jul 26, 2022 at 1:56
  • Well, it does in fact work to set the default sans-serif font to YaHei, but now everything is in YaHei and not just Chinese characters. :(( It's certainly a good stopgap measure but I'm going to keep hunting around the web for a better solution. Thanks a lot! Commented Jul 26, 2022 at 18:08
0

I don't know if there are equivalent settings for Chrome, but Firefox can specify a list of default fonts per script.

This means that if a website falls back to the abstract "sans-serif" font (as English websites typically do for Chinese), the browser will pick a different font based on what language the site specified for that text. The problem is that most sites usually don't bother specifying, meaning that the Latin font is used everywhere (falling back sloppily, either alphabetically or by prioritizing some old standard), which will not have good fallbacks specified for non-Latin. This is especially true for user submitted content like Duolingo comments, which are not language tagged, and inherit the main language of the page which is indeed English.

The solution available in Firefox is to go to the about:config page and search for and change the font.name-list. family of settings, notably the ones for x-western and x-unicode, adding names of Chinese fonts to those lists, separated by commas.

Something more advanced (but that should work in Chrome as well) is overriding the CSS using an addon like Stylus.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.