CSS Firefox Windows フォント

Windows + Firefox フォントをきれいに表示する方法

Windows環境におけるFirefoxでフォントをきれいに表示する方法を解説する。「Firefox 59」で動作確認を実施。

レンダリングパラメーターの設定変更

「about:config の設定変更」或いは「右上三本線 → ヘルプ → トラブルシューティング情報 のプロファイルフォルダを開いた場所にある“prefs.js”の編集」で、レンダリングに関するパラメーターを変更する。
  • ClearTypeレベル
    名前: gfx.font_rendering.cleartype_params.cleartype_level
    既定値: -1 (自動)
    設定可能な値: 0 ～ 100
    設定値: 100
  • コントラスト
    名前: gfx.font_rendering.cleartype_params.enhanced_contrast
    既定値: -1 (自動)
    設定可能な値: 0 ～ 200
    設定値: 200
  • サブピクセルレイアウト
    名前: gfx.font_rendering.cleartype_params.pixel_structure
    既定値: -1 (自動)
    設定可能な値: 1 , 2
    設定値: 1 (RGB)
  • フォントレンダリングモード
    名前: gfx.font_rendering.cleartype_params.rendering_mode
    既定値: -1 (自動)
    設定可能な値: 0 ~ 5
    設定値: 5 (Natural Symmetric)
“prefs.js”の編集

↓ コピー用 ↓

user_pref("gfx.font_rendering.cleartype_params.cleartype_level", 100);
user_pref("gfx.font_rendering.cleartype_params.enhanced_contrast", 200);
user_pref("gfx.font_rendering.cleartype_params.pixel_structure", 1);
user_pref("gfx.font_rendering.cleartype_params.rendering_mode", 5);

ユーザースタイルシートの設定

Stylish - Custom themes for any website – Firefox 向けアドオン

を使用して、以下のようなスタイルシートを設定して、サイトで指定されているフォントを自分の好みのフォントに変更する。

/* Meiryo */
@font-face { font-family: "Meiryo UI"; src: local("Meiryo"); }
@font-face { font-family: "MS PGothic"; src: local("Meiryo"); }
@font-face { font-family: "MS Gothic"; src: local('Meiryo'); }
@font-face { font-family: "MS UI Gothic"; src: local("Meiryo"); }
@font-face { font-family: "Yu Gothic"; src: local("Meiryo"); }
@font-face { font-family: "Yu Gothic UI"; src: local("Meiryo"); }
@font-face { font-family: "YuGothic M"; src: local("Meiryo"); }
@font-face { font-family: "Roboto"; src: local("Meiryo"); }
@font-face { font-family: "Arial"; src: local("Meiryo"); }
@font-face { font-family: "verdana"; src: local("Meiryo"); }
@font-face { font-family: "Helvetica"; src: local("Meiryo"); }
@font-face { font-family: "Hiragino Kaku Gothic Pro"; src: local("Meiryo"); }
@font-face { font-family: "Hiragino Sans"; src: local("Meiryo"); }
@font-face { font-family: "HiraKakuProN-W3"; src: local("Meiryo"); }
@font-face { font-family: "Lucida Grande"; src: local("Meiryo"); }

↑ サイトで指定されているフォントをローカル側にあるフォントに変更すると云う意味。
ここでは“Meiryo”を指定しているが、好みのフォントをインストールして指定してもよいだろう。

スクリーンショット


↑ クリックすれば原寸表示。フォントの品質はかなり向上したのでは？
最終更新日:
コメントは受け付けておりません。