WordPress / wporg-parent-2021

21 stars 11 forks source link

Unset heading text-wrap for ja #123

Closed mkismy closed 9 months ago

mkismy commented 10 months ago

In https://github.com/WordPress/wporg-parent-2021/pull/119 text-wrap was implemented.

However since this is causing unexpected line break especially on headers in Japanese like https://github.com/WordPress/wporg-parent-2021/pull/120#issuecomment-1897700115 , I unset the css variable. Chinese and Korean probably has the same issue but it is out of this scope since I'm a stranger.

cc @t-hamano

Screenshots

Before After
localhost_8898_2024_01_hello-world_ localhost_8898_2024_01_hello-world_ (1)

FYI this change was discussed in the Japanese Slack.

t-hamano commented 10 months ago

@mkismy is a member of the Japanese community and discussed this issue in advance in the Japanese Slack channel. I think this change makes sense, at least for Japanese.

In English, there are always spaces between words. Perhaps text-wrap:balance takes up that space and never cuts the word.

In Japanese, on the other hand, there are no spaces in sentences. We divide words by mentally determining whether they are nouns or verbs, etc. based on the context of the entire sentence and the surrounding characters. However, text-wrap:balance doesn't seem to be ideal, at least in Japanese, and can sometimes cut off text that it recognizes as words.

If line breaks are required, we have the option of injecting a br tag on GlotPress.

ryelle commented 10 months ago

If we add this, it changes the balance of headings on the homepage, too. I've taken some screenshots of this PR applied to my sandbox, so you can see it on real content. Does this still look like you expect?

HomeAlt heading 2Alt heading

On the news & single pages, it looks like this:

news

single

t-hamano commented 10 months ago

Thank you for showing me the screenshot. To me, all the screenshots all look as expected.

Just to be sure, I will send a ping to @miminari and @nukaga who were involved in creating the Japanese version design file.