No bopomofo ruby support #241
Comments
r12a
added
gap
|
The first comment in this issue contains text that will automatically appear in one or more gap-analysis documents as a subsection with the same title as this issue. Any edits made to that comment will be immediately available in the document. Proposals for changes or discussion of the content can be made in comments below this point. Relevant gap analysis documents include: |
|
I found my way here from https://github.com/w3c/i18n-activity/projects/3?card_filter_query=ruby and am curious what's missing. I tried recreating the Wikipedia example with HTML: >
<style>
ruby {
font-size: 64px;
ruby-position: inter-character;
}
rt { font-size: 16px; }
style>
<body lang=zh-Hant>
<ruby>
瓶<rt>ㄆㄧㄥˊrt>
子<rt>˙ㄗrt>
ruby>It's rendered similarly in Chrome, Firefox and Safari, here's a screenshot from Safari: It looks like I'm also not sure if the tone marks are combined correctly in particular "˙ ㄗ" seems weird, but then I don't know how horizontal bopomofo is supposed to look like. Are there more issues here? |
|
When i'm able to get to it, i'll improve the problem statement here. In the meantime, you may find this illuminating: Basically, bopomofo ruby is not normally rendered above the base, but rather each character is annotated to its right side with one vertical column containing the syllabics and one of the tones, and if other tones are used they appear in a second column, where the tone marks are aligned with the syllabics in various ways. (And, btw, if rendering above the base, the vertical and horizontal alignment in your screen snap is pretty awful.) hth |
|
Thank you Richard, that was great reading you linked to. It looks like I wasn't far off with my guess, that tone marks and in particular the light tone need special support. |
|
See more info below. Spec: Tests & results: |
|
I rewrote the first comment to add more information about Bopomofo. |
|
I applied the new template, but also added text to the problem statement to describe what the gap actually is. Note also that in principle the spec links should briefly describe whether the specs already provide what is needed, or whether they need work – rather than just linking to relevant sections. |
|
Safari / Webkit 18.2 support unprefixed 'ruby-position: inter-character' and it seems working well with font to adjust tone mark's position. 
https://cmex-30.github.io/Bopomofo_on_Web/testpage/index.html |
|
Thanks @bobbytung. I updated the first comment. |
|
I largely rewrote the initial comment to update the format but also to make it clearer that Safari 18.2 still doesn't actually fix the problem (because it simply lists all bopomofo glyphs vertically). @xfq i also reinstated the original problem statement and moved the new information to the Outcomes section. I also changed the example, so that it shows tone positioning. |
r12a
added
x:blink
|
Raised a WebKit bug. |
Uh oh!
There was an error while loading. Please reload this page.
This issue is applicable to Chinese, particularly in Taiwan.
Bopomofo, also named Zhuyin Fuhao, is a transliteration and writing system for Chinese. Although it can sometimes be used for writing Chinese, or local Taiwanese languages, however it has been widely used for 100 years to indicate phonetic annotations of Chinese characters.
Bopomofo is usually written in vertical columns to the right of the Han character. Importantly, most tone marks are set in a second column to the right of the bopomofo letters, and the vertical placement of the tone relative to the letters follows certain rules.
For example:
There are two potential ways to implement Bopomofo:
Make special fonts, and combine the Chinese character and the Bopomofo characters into the glyph. Use
spans, CSS, and webfonts to toggle fonts. This approach works in all browsers, but it is not very accessible and it is not easy to handle polyphones.Use HTML
ruby/rt,ruby-position: inter-character, and OpenType fonts for all characters inrt(see https://github.com/cmex-30/Bopomofo_on_Web/blob/master/BOPOMOFO%20TYPOGRAPHY.pdf). The CSS specinter-charactervalue for theruby-positionproperty is specifically "provided for the special case of traditional Chinese as used especially in Taiwan".Use of
ruby { writing-mode: vertical-lr; }to achieve this (see an example) doesn't produce the needed positioning.More:
The GAP
Bopomofo ruby is not supported by any browser. This is because:
Priority
Since this is important for education, it is prioritised as a basic issue.
Tests & results
I18n test suite, ruby-position:inter-character will make zhuyin annotations appear in vertical columns alongside the base in horizontal text.
I18n test suite, ruby-position:inter-character will make zhuyin non-neutral tone marks appear in the correct relative positions alongside the zhuyin characters in horizontal text.
I18n test suite, ruby-position:inter-character will make zhuyin neutral tone marks appear above the zhuyin characters in horizontal text.
Action taken
Blink • Gecko • WebKit
Outcomes
Version 18.2 of Safari (WebKit) supports
ruby-position: inter-characterin so far as it positions bopomofo glyphs vertically to the right of the Han characters — however, it doesn't position the tone marks correctly relative to the bopomofo letters, and therefore it doesn't yet provide a solution to this issue.The text was updated successfully, but these errors were encountered: