Webサイトの嫌いなフォントをブラウザ側で置換する方法

たとえばGoogle系のページはフォント指定がArialなんだけど、

こいつはHelveticaの劣化コピーなので汚いし

日本語フォントとは高さも太さも違うせいでガタガタに表示される。

こういうのをどうにかしたい。

ほかRobotoとかMeiryoとかSegoeUIとかを指定してるサイトも個人的にはあんま好きじゃなくて、まとめて置換できる方法があるので使っている。

置き換え方法（Chromeを想定）

• ユーザースタイルシートを設定できる拡張機能を入れる。たとえばStylish こいつは閲覧情報収集野郎&機能超絶劣化したのでStylusに乗り換え推奨
• すべてのサイトに適用するスタイルを作成する。内容は以下

@font-face { font-family: "Arial"; font-weight: normal; src: local('ヒラギノ角ゴ Pro W3'); } @font-face { font-family: "Arial"; font-weight: bold; src: local('ヒラギノ角ゴ Pro W6'); } @font-face { font-family: "メイリオ"; font-weight: normal; src: local('ヒラギノ角ゴ Pro W3'); } @font-face { font-family: "メイリオ"; font-weight: bold; src: local('ヒラギノ角ゴ Pro W6'); } @font-face { font-family: "Meiryo"; font-weight: normal; src: local('ヒラギノ角ゴ Pro W3'); } @font-face { font-family: "Meiryo"; font-weight: bold; src: local('ヒラギノ角ゴ Pro W6'); }

こんな感じで、消したいフォントの数だけ指定すれば全部置換される。

注意点として、置換先であるヒラギノフォントは「すべてのユーザーに対してインストール」されていないとダメです。理由はわからん※

あとChromeの仕様変更とかでダメになる可能性はある。昔だとDirectWrite関連でOpenType全滅したりしたので、そんなことが今後あるかも。とりあえずver.101の時点では動いてる。

 

※ブラウザのフィンガープリント対策の可能性がある（2024-05-31追記Z）

主に広告目的で閲覧者を識別する方法の一つに、インストールされたフォントのリストを使う方法がある。その対策として、最近のブラウザではシステムフォント以外のローカルフォントの使用が禁止されているらしい。

例：https://support.mozilla.org/ja/kb/firefox-protection-against-fingerprinting