†PCうそつき講座†

ブラウザのフォント ― メイリオとDroid Sansの話 ―

作成開始日 2021.08.19
最終更新日 2021.08.21

このような場合、cssで表示フォントを明示的に指定して、一般的な字幅のフォントに変更すればよい。と言っても、Win7の標準日本語フォントは、メイリオ系とＭＳゴシック／明朝系のみ。「メイリオUI」ならば字幅は縮まるが文章が読み難くなる。また、ＭＳフォントは文字線が細すぎて読み難い。メイリオはメイリオでメリットの大きなフォントなのだ。

ただし、ここで問題になっているのは半角英数字の幅なので、欧文フォントのみを変更するという方法が考えられる。その場合、cssで例えば次のように指定する。

font-family:"Segoe UI"

<style>
<!--
td{white-space:nowrap;font-size:18px;font-family:"Segoe UI"}
-->
</style>

Segoe UI	英語版Win7でシステムフォントとして使用されているらしい。 字幅が狭い上にメイリオとのバランスが良い。英語版メイリオUI？
Tahoma	字幅が狭いのでレイアウト崩れは防げるが、線がやや太い。 見出し系には悪くはないが、英数字がずらずら並ぶ表組みにはくどい。
Arial	字幅がやや広めで、この目的にはあまり適さない。
Calibri	横幅だけでなく字面そのものが小さい。メイリオとの混在はバランスが悪い。

【参考】「Segoe UI」が英語版「メイリオUI」に相当するなら、そもそも全部「メイリオUI」で良いのでは？と思うかも知れないが、「メイリオUI」は行間・字間が詰まって長い文章は非常に読み難くなる。あくまでも、日本語フォントの中に欧文UIフォントが混じることに意味がある。

●Droid SansをWindows7にインストールする

�@Droid Sans大前提では、未インストールの環境では何の解決にもならない
�AWin7用のフリーのDroid Sansは欧文のみで、CJKを含むフォントは何故か有料
�BDroidSansをインストールできたからと言って綺麗に表示出来るとは限らない

Droid Sansでなくても、半角英数字の字幅が標準的で、かつ読みやすいフリーフォントがあれば、それを使っても良いのだが、やはり�@と�Bの問題はついて回る。特に�@の問題は根本的で、表示環境に追加フォントのインストールを要求する時点でアウト（技術的問題ではなく、個人的な美学の問題）。が、まあ、一応Droid Sansのインストールには成功したので、その顛末を少し；

フォントの入手

上述のように、CJK（日本語等）を含むDroidSansは何故か有料販売されていて、フリーの物が見つからなかった。しょうがないので、Linux（Debian）から抜き出して使用した。［/usr/share/fonts/truetype］の中の「droid」フォルダをWin7のデスクトップにコピーおく（他の場所でも良い）。なお、このLinux版Droid Sansも、後から追加インストールした記憶があるが（違ったかな？）、もちろんフリーだった。

フォントのインストール

まず、「droid」フォルダの中の「DroidSansFallbackFull.ttf」をダブルクリックして、サンプル画面を表示する。そして、サンプル画面上部にある［インストール］ボタンをクリックすればインストール終了。ブラウザのフォント選択画面から「Droid Sans Fallback」を選べば、Droid Sansで表示されるようになる。が、ここで「あれ？」と思うはず→次項に続く。

なお、「droid」フォルダの中には「DroidSans.ttf」や「DroidSans-Bold.ttf」などのフォントファイルがあるが、今回はこれらはインストールしない。なぜなら、Win7環境ではこれはら上手く機能しないから。通常は、フォントとしては「Droid Sans」を指定し、「DroidSans.ttf」が「DroidSansFallbackFull.ttf」からグリフデータを引っ張り出して来る、という仕組みになっているのだと思うのだが、そして、Win7でもそのように機能している筈なのだが…→次項に続く。

Seamonkey/Firefoxのアンチエイリアス処理

一般に、ディスプレイのような解像度の低いデバイス上に、TrueTypeフォントを生のまま表示しても、線幅が一定しなかったり、ジャギーが出たりして、綺麗な文字にならない。で、こうした文字をスムーズに表示するのが「アンチエイリアス処理」と呼ばれるもので、Windows7では「clear type」と言う機能がそれに該当する。

ところが、標準状態のSeamonkeyやFirefoxでは、このclear typeがまともに機能していないようなのだ。なので、Droid Sans（Fallback）で表示出来たとしても、文字の崩れた非常に汚い表示になってしまう。で、アンチエイリアス処理を有効にするオマジナイが、「about:config」の以下の項目；

gfx.font_rendering.cleartype_params.rendering_mode

【参考】OS/2版のSeamonkey 2.28には上記に当該する項目がない（clear typeがないのだから当然）。代わりに「gfx.os2.font.antialiasing」という項目があるが、この値はデフォルトでTrue。それでも、Droid Sans以外のTrueTypeフォントにはアンチエイリアス処理はしていないようだ。

ボールド指定ができない

ところが、このDroid Sans（Fallback）はボールド指定が無効になってしまう。考えて見れば当然で、これはDroid Sans群の基本となる生の字形データなわけで（「droid」フォルダ内の他のttfファイルとサイズを比較すればすぐに判る）、ボールドしたければ、ボールド加工処理を行う「DroidSan-Bold.ttf」をインストールしておかなくてならない。

じゃ、「DroidSans.ttf」や「DroidSans-Bold.ttf」をインストールして、フォントとして「Droid Sans」（Fallbackではない）を指定すれば、ボールドも有効になるのかと言うと−−有効になることはなる；けれども、文字が汚くなる。アンチエイリアス処理が無効になってしまうのであった。う〜ん、孫引き式のフォントではこうなってしまうのか？私の理解に根本的な誤りがあるのか？この辺り、正直私の理解力ではどうにもならない。

−−とりあえず、今回はここまで。