w3c / jlreq

Text Layout Requirements for Japanese
https://w3c.github.io/jlreq/
Other
101 stars 17 forks source link

Rotation of fullwidth semicolon #302

Open r12a opened 3 years ago

r12a commented 3 years ago

In case it's useful, here are some observations i made for the orientation of [U+FF1B FULLWIDTH SEMICOLON] in vertically-set text, using writing-modes.

I tested on a Mac using Firefox, in a textarea. Textarea doesn't support vertical text in Chrome.

You can replicate the tests in the Japanese and Chinese character apps. Use the pulldown menu on the right to toggle the direction. Just mouse over the font names and watch the glyphs change.

Basic conclusion:

Japanese system fonts all rotate. Most Chinese fonts DO NOT rotate. Noto fonts do not.

Japanese system fonts tested

all rotate MS Mincho MS PMincho Hiragino Mincho Pro Toppan Bunkyu Mincho YuMincho Arial Unicode MS Hiragino Kaku Gothic Pro Hiragino Sans Osaka Toppan Bunkyu Gothic MS Gothic MS PGothic MS UI Gothic YuGothic Hiragino Maru Gothic Pro Tsukushi A Round Gothic Tsukushi B Round Gothic Toppan Bunkyu Midashi Gothic YuKyokasho YuKyokasho Yoko

Chinese system fonts tested

an asterisk indicates those that DID rotate SimSun Songti SC STSong Apple LiSung LiSong Pro MingLiu PMingLiu Songti TC Hei Heiti SC Lantinghei SC PingFang SC SimHei STHeiti Yuanti SC Apple LiGothic Heiti TC Lantinghei TC LiHei Pro PingFang TC Yuanti TC STFangsong Kai Kaiti SC STKaiti Xingkai SC Biaukai Kaiti TC Xingkai TC Baoli SC Hannotate SC HanziPen SC Libian SC LingWai SC Wawati SC Weibei SC Yuppy SC Baoli TC Hannotate TC HanziPen TC Libian TC LingWai TC Wawati TC Weibei TC Yuppy TC

Noto fonts

all upright Noto Serif CJK SC Noto Serif CJK TC Noto Sans CJK SC Noto Sans CJK TC

acli commented 3 years ago

Can you give us a short explanation on how to use the app? I went there and input some text, but couldn’t figure out how to run the test. Thanks.

kidayasuo commented 3 years ago

The vertical orientation depends on the combination of the app and the font. According to the test done by Murata-san (attached below) we see different results between Firefox (the most exotic), Chrome and Safari.

For example, most if not all AJ1 OpenType (i.e. postscript based) do not have the vert table to rotate the glyph for U+FF1B. It means if Hiragino, Yu, Toppan and Tsukushi rotate it is the app that did the work.

The test result sorted by the browser

Name Name Font type Browser OS  
凸版文久明朝 Toppan AJ1 OT Chrome Mac10.10 U
筑紫明朝 Tsukushi AJ1 OT Chrome Mac10.13 U
ヒラギノ Hiragino AJ1 OT Chrome Mac10.15.4 U
DNP版秀英体 DNP Shuei AJ1 OT Chrome Win10 U
リュウミン Ryumin AJ1 OT Chrome Win10 U
筑紫明朝 Tsukushi AJ1 OT Chrome Win10 U
游明朝 Yu Mincho AJ1 OT Chrome Win10 U
メイリオ Meiryo MS Chrome Win10 U
MS明朝 MS Mincho MS Chrome Win10 U
小塚ゴシックPr6N-M Kozuka AJ1 OT Chrome Win10 U
小塚明朝Pr6N-R Kozuka AJ1 OT Chrome Win10 U
源ノ角ゴシックPr6N-R Noto OT Chrome Win10 U
凸版文久明朝 Toppan AJ1 OT Firefox Mac10.10 R
筑紫明朝 Tsukushi AJ1 OT Firefox Mac10.13 R
DNP版秀英体 DNP Shuei AJ1 OT Firefox Win10 R
リュウミン Ryumin AJ1 OT Firefox Win10 R
筑紫明朝 Tsukushi AJ1 OT Firefox Win10 R
游明朝 Yu Mincho AJ1 OT Firefox Win10 R
メイリオ Meiryo MS Firefox Win10 U
MS明朝 MS Mincho MS Firefox Win10 R
ヒラギノ Hiragino AJ1 OT Firefox Mac R
凸版文久明朝 Toppan AJ1 OT Safari Mac10.10 U
ヒラギノ Hiragino AJ1 OT Safari Mac10.15.4 U
r12a commented 3 years ago

@kidayasuo i considered adapting the character app so that it wrote to a contenteditable element, rather than to a textarea, but it looked like too much work :( Good to see that you have some test results though.

@acli

Can you give us a short explanation on how to use the app? I went there and input some text, but couldn’t figure out how to run the test. Thanks.

See above:

You can replicate the tests in the Japanese and Chinese character apps. Use the pulldown menu on the right to toggle the direction. Just mouse over the font names and watch the glyphs change.

The pulldown menu is the three bars to the right of the line near the top. Select Toggle Direction. Then mouse over the font names and watch the characters change in the main text area.

r12a commented 3 years ago

@acli You shouldn't need to input any text. The URL causes the app to display 4 characters in the text area automatically.