WEB中国語フォントアプリケーションガイド

本当の課題は中国語フォントにあります。中国語フォントの特殊性により、サイズが大きすぎます。オペレーティングシステムに組み込まれているフォントに加えて、他のフォントをウェブサイトに適用することは困難です。選択肢が少ない場合に中国語フォントを正しく使用するにはどうすればよいですか?

まず、次のフォント宣言は不適切であり、決して使用しないでください。

フォントファミリー: "Song"

フォントファミリー: "宋体"、Arial;

フォント ファミリ: Arial、「Songti」、「Microsoft YaHei」;

フォントファミリー: Helvetica、Arial、「Huawen Xihei」、「Microsoft Yahei」;

次に、適切なフォント宣言を定義する方法を段階的に説明します。

中国語フォントにも英語名がある

多くの開発者はこの点を見落としています。オペレーティング システムでは Songti、Microsoft Yahei、Huawen Xihei などのフォント名をよく見かけますが、実際にはこれらはフォントの表示名にすぎず、フォント ファイルの名前ではありません。ほとんどの場合、表示名を直接使用すれば機能しますが、一部のユーザーは極端なケースで作業し、フォント宣言が無効になることがあります。

たとえば、ユーザーが中国語版のオペレーティング システムをインストールした (つまり、システムに中国語フォントがある) が、主要言語を英語に切り替えたとします。これは、英語力を向上させたい中国のユーザーの間では非常によくあることです。現時点では、オペレーティング システムは表示名に応じて正しいフォントを見つけることができない可能性があります。そのため、最初に覚えておく必要があるのは、次のように中国語フォントのフォント名 (英語) と表示名 (中国語) を同時に宣言することです。

フォントファミリー: SimSun、「宋体」

フォントファミリー: “Microsoft YaHei”, “微软雅黑”

フォント ファミリ: STXihei、「Huawen Xihei」、「Microsoft YaHei」、「Microsoft YaHei」

英語フォントの宣言を忘れないでください。英語フォントは中国語フォントより前に配置する必要があります。

この事実を覚えておいてください。ほとんどの中国語フォントには英語の文字が含まれていますが (基本的には見苦しいですが)、英語フォントには中国語の文字は含まれていません。

Web ページで中国語と英語が混在することはよくあります。中国語フォントを使用して英語を表示すると、好ましくない結果になるので、最初に英語フォントを宣言することを忘れないでください。

フォントファミリー: Georgia、SimSun、「宋体」

フォントファミリー: Arial、「Microsoft YaHei」、「微软雅黑」

もう 1 つの良い習慣は、英語のフォント ファミリーの名前を末尾に追加することです。フォント ファミリは、一般的にサンセリフとセリフの 2 つのカテゴリに分けられます。それらの違いと使用ルールについては、この記事の冒頭にあるビデオをご覧ください。一般的に言えば、次のようにする必要があります。

フォントファミリー: Georgia、SimSun、「宋体」、セリフ

フォントファミリー: Arial、「Microsoft YaHei」、「微软雅黑」、サンセリフ

注意: 上記の 2 つのステートメントの Songti と Microsoft YaHei は入れ替えないでください (入れ替えてもエラーは発生しません)。これは、フォント スタイルの観点から、Microsoft YaHei は非セリフ体であり、Songti はセリフ体であるためです。ただし、中国語では英語ほど厳密にフォント ファミリが区別されないため、実際のアプリケーションではそれほど重要ではありません。

異なるオペレーティングシステムへの配慮を忘れないでください

Web 開発者として、Windows、Mac OS、Linux ファミリーなどの一般的なオペレーティング システムのシステム フォント、特に中国語フォントについて十分な知識を持っている必要があります。ここでは、対象の Web サイトが Windows ユーザーと Mac ユーザーの両方に最高のフォント エクスペリエンスを提供したいと考えていると想定し、次のように宣言できます。

フォントファミリー: Helvetica、Tahoma、Arial、STXihei、「华文细黑」、「Microsoft YaHei」、「微软雅黑」、サンセリフ

このステートメントは何をするのでしょうか? 一つずつ説明しましょう (括弧は対応するターゲット オペレーティング システムを表します)。

英語の文字の場合、最初に Helvetica (Mac) を検索し、次に Tahoma (Win) を検索し、どちらも見つからない場合は Arial (Mac および Win) を使用します。3 つとも見つからない場合は、現在のデフォルトのサンセリフ フォント (オペレーティング システムまたはブラウザーによって指定) を使用します。

中国語フォントについては、ルールはすでにわかっています。 Huawen Xihei (Mac) と Microsoft Yahei (Win) は、これら 2 つのプラットフォームのデフォルトの中国語フォントです。

下位互換性に注意する

これまでのところ、フォント宣言は非常に優れています - オペレーティング システムの古いバージョンをまだ使用しているユーザーについて心配する必要はありません。残念ながら、中国市場には Windows XP を使用するユーザーがまだ多数存在し、Songti が彼らの主な中国語フォントとなっています。これらのユーザーに対応するには、Microsoft YaHei のフォールバックを追加できます。

フォントファミリー: Helvetica、Tahoma、Arial、STXihei、「华文细黑」、Heiti、「黑体」、Microsoft YaHei、「微软雅黑」、SimSun、「宋体」、sans-serif

同様に、Mac システムのフォールバックとして太字も使用されていることがわかります。

他の

二重引用符を使用しなくても大丈夫ですか?

できる。英語のフォント名には 2 つ以上の単語が含まれるものがあり、単語間にスペースがあるため、"" で囲む必要があります。中国語フォントは非常に特殊です。英語の観点から見ると、Microsoft YaHei は 1 語ですか、それとも 4 語ですか? それは問題ではありません。幸いなことに、中国語フォントの名前にはスペースがないので、"" を追加しなくても問題ありません。

ただし、どのオペレーティング システム/ブラウザー環境でもこれが機能するという保証はありません。何かおかしなことが起きる場合は、二重引用符を追加してみてください。

特定のフォントをデフォルトで表示できますか？たとえば、Microsoft YaHei

前回のフォント宣言では、Huawen Xihei がデフォルトのフォントになっていることにお気づきかもしれません (宣言内のすべての中国語フォントがシステムにインストールされている場合)。なぜ最初に Mac システムのフォントを宣言するのでしょうか?

論理的に言えば、ほとんどの Web サイトの主なターゲット市場は依然として Windows ユーザーであるため、理論的にはこれは妥当な記述です。

フォント ファミリ: Helvetica、Tahoma、Arial、「Microsoft YaHei」、「Microsoft YaHei」、SimSun、「Songti」、STXihei、「Huawen Xihei」、Heiti、「Heiti」、サンセリフ

しかし、現実にはそうではありません。中国語フォント ユーザーのうち、Mac を所有している人の多くは、Windows でよく使用される中国語フォントもインストールしています (Office for Mac のおかげ)。しかし、Windows ユーザーで Mac に中国語フォントをインストールする人はほとんどいません。

したがって、Mac フォント宣言を先頭に置いても、Windows ユーザーにはほとんど影響はありません (Windows ユーザーにはまったくフォント宣言がないため)。ただし、フォールバックとして使用される太字フォントが Microsoft YaHei に置き換わる可能性があるため、より安全なアプローチは次のようになります。

フォント ファミリ: Helvetica、Tahoma、Arial、STXihei、「Huawen Xihei」、「Microsoft YaHei」、「Microsoft YaHei」、SimSun、「Songti」、Heiti、「Heiti」、サンセリフ

ただし、Microsoft YaHei を中国語フォントのトップにしないでください。歴史上最も醜い中国語フォントの 1 つである Microsoft YaHei は、良い選択ではありません。Mac に甘やかされているユーザーを気遣ってください。ありがとうございます! (あくまでも個人的な意見です)

ちなみに、私と同じように Microsoft YaHei が気に入らない場合は、削除してください。

これまでのところ、サンプル コードには Linux ファミリーの例はありませんが、何をすべきかは理解できたと思います。

ちょっとした補足

Microsoft Yahei のランキングに異議を唱える人がいることを考慮して、上記の解決策をさらに一歩進めてみてもいいかもしれません。真実はこうです:

Microsoft YaHei を前に置くと、Microsoft YaHei フォントをインストールした Mac ユーザーは Microsoft YaHei に直面することになりますが、Mac には Microsoft YaHei よりもはるかにエレガントな中国語フォントが多数あります。

Mac フォントを前面に配置すると、Windows ユーザーに同様の混乱が生じます。結局のところ、Microsoft YaHei は Windows プラットフォームに最適なフォントです (今のところ)。

1と2ではどちらが出やすいでしょうか？これは計算しなくてもわかる答えだと思いますが、どうでしょうか？

しかし、実際には他に 2 つの要因が関係しています。

多くの Windows ユーザーは、さまざまな理由で ClearType をオフにしています。この場合、Microsoft YaHei は最悪です。ただし、Mac フォントもあまり良い選択ではありません。本当の勝者は? そうです、Songti です。

Mac の太字フォントのほとんどは Windows ではぼやけますが、Microsoft YaHei は醜いものの、少なくとも Mac では表示されます。 （これは、2つのプラットフォーム間のフォントレンダリング技術のギャップを間接的に反映しています）

したがって、実際には、本当に「確実な」ソリューションを実現するには、次の点を考慮する必要があります。

UA を使用して、さまざまなプラットフォームに読み込むフォントを決定します。

特別な理由がない限り、本文は宋字で表記し、タイトルなど拡大できる箇所にはMicrosoft YaHei（Windows用）を使用するようにしてください。

Holly は Mac でうまく動作しますが、Mac OS X 10.6 より前では利用できなかったため、ユーザー ベースを慎重に検討するか、中国語の Hei フォント シリーズをフォールバックとして使用してください。

最後に、フォントの長所と短所について議論するつもりはありません。この記事の目的は、フォントの選択ではなく、使用方法を紹介することです。 「美しさ」や「醜さ」というのは、常に非常に主観的なものです。私は著者なので、偏見を持たざるを得ません。しかし、私はあなたが正しい判断を下すだろうとも信じています。私と議論しても実際的な意味はありません。