Bana’s Tech Tips

Windows10やChromeでの中華フォント現象を解決してみる

f:id:BanaoLihua:20210507180753p:plain

<追記(2019/9/29)>

Windows10に元から入っているMicrosoft Yi Baiti、Microsoft Jheng Heiでも可能なようです。それを使用すればわざわざsource han sunsをインストールしなくても大丈夫だと思います。


こんにちは。皆さんは中華フォント現象って知っていますか?

一部の漢字だけフォントが変になったり、続く文字も気持ち悪いフォントになったりする現象のことです。

気にする人はすぐ気づきますが、全く気にしないし気付かないしどうでもいいって人も多いと思います。

私は断然前者で、この現象が起こると気持ち悪すぎて眠れないほどです。

iPhoneでこの現象を解決しようとしたのですが、失敗に終わったので取り敢えずWin10のシステムフォントから変えていきたいと思います。

最終的にはこのように変わります。

f:id:BanaoLihua:20210507180923p:plain

変更前

f:id:BanaoLihua:20210507180952p:plain

変更後
 <注意!> 

あくまで簡体字を日本のフォントに近くするだけです。そのため、糸へんや「直」などは繁体字の形で表示されてしまいます。

フォントをインストール

そもそも中華フォント現象は、日本語のフォントが簡体字に対応していないというのが根本的な原因(?)なので日中共通形のフォントを探しました。

すると、Adobe日中韓共通形の「Source han sans」というフォントを無料でリリースしているのを見つけたので、こちらを利用することにしました。

<フォントをダウンロード>

正式なダウンロードページはリンク切れ?していたのでGit hubから直接ダウンロードします。仕方ない。

こちらのページに飛び、下のDownloadからzipファイルをダウンロードします。

f:id:BanaoLihua:20210507181024p:plain

解凍すると色んな太さのotfファイルがでてきます。適用したいものをインストールしていきましょう。

<フォントをインストール>

インストールの方法ですが、otfファイルをダブルクリックするとサンプル画面が出現し、左上に「インストール」という項目が出てくるはずです。また、管理者権限も必要です。

<インストールできたか確認>

適当にWordでも開いてみてください。フォント選択のセレクトボックスに画像のような「Source han sans」が出てくると思います。

f:id:BanaoLihua:20210507181054p:plain
このフォントはカタカナの横幅が少し気になりますが、よしとします。

ちなみにSource han sans JPをインストールすると「源ノ角ゴシック」という名前になっています。

Windows10のシステムフォントを変更

Windows10のデフォルトのシステムフォントは「Yu Gothic UI」というフォントを採用しているらしいのですが、これを強制的に変更します。

こちらのサイトから、「Meiryo UIも大っきらい!!」というソフトをダウンロードしてください。

このソフトではデスクトップやメニューバーなどのフォントを好きなフォントに変更することができます。

また、使用方法もこのサイトに書いてあるので参考にしてください。

ちなみに私はこのように設定しました。

戻す方法も作者様のサイトに書いてあるのでそちらをご覧ください。

成功するとこんな感じです!

「华」(「華」の簡体字)の違和感が無くなりましたね。もう少しカタカナが小さければより良いですが・・・

細字の方がかっこいいような気がしたのでLightを適用したのですが、文字はもう少し大きくてもよかったかも。

何はともあれ中華フォントの気持ち悪い現象は解決しました!

Chromeでも中華フォントを解決してみる

上のやり方だと、デスクトップなどは適用されますが、当然ながら他のソフト上は適用範囲ではありません。

せめてブラウザだけでも中華フォント現象を根絶していきたいので、Chrome上で解決したいと思います。

さて、Chromeには様々な拡張機能が世界中のデベロッパーによりリリースされています。

以前、Vue.js開発で役に立つ拡張機能を紹介しましたが、今回も拡張機能に頼っていきたいと思います。

「font」と検索すると色々出てきますが、今回はこちらの「Force Custom Fonts」という拡張機能を使ってみます。

Chromeに追加」を選択してインストールしましょう。

右上にアイコンが出現すると思うので、アイコンをクリック⇒オプションから画像のように設定します。

これの良いところはアルファベットなどを個別にフォント指定することができることですね。

「Save」すると適用されます。

適用前

適用後

ちゃんと中華フォントも解消しました~

ただこの拡張機能、恐らくページ内のフォントを強制的に変更しているので全て選択したフォントになってしまうと思います(確認はしていませんが・・・)

ページのレイアウトが何か変だなぁと思ったら設定からオフにしてみてください!

お疲れさまでした~~