ブラウジングをしていると、文字がギザギザのページに遭遇することはありませんか？そんな悩みを解決する拡張機能を開発したので、今回はそのご紹介です。
この記事の対象は Windows ユーザーです。
Mac / Linux ユーザーにはほとんど関係ない内容です。
どんな拡張機能か
前述の通り、Web サイトの汚い文字を綺麗にする拡張機能です。
インストールはこちらから
Chrome→ https://chrome.google.com/webstore/detail/oecglhldbofcklanmhckefiflhfhabdd
Firefox→ https://addons.mozilla.org/ja/firefox/addon/replace-with-noto/
ソースコード→ https://github.com/r-40021/replace-font
インストールするだけで使えます。
拡張機能がしていること
そもそも、なぜ一部の Web サイトの文字はギザギザしているのでしょうか？
多くは、フォントとして MS ゴシック を使用しているためです。
この MS ゴシック、実は30年前に作られた古いフォントです。
低解像度のディスプレイでも読みやすいようにと開発されたフォントで、現在の高解像度のディスプレイとの相性が悪いのです。
「じゃあ、なぜ未だに MS ゴシックを採用しているサイトが有るのか」と思うかもしれません。
理由は色々ありますが、
- 過去の慣習が残っている
- 更新がしばらく止まっている
等があると思います。
また、Windows に未だに MS ゴシックが搭載されているのは互換性維持のためです。
そこで、この拡張機能はこの MS ゴシック を、読みやすくてきれいな Noto Sans に置き換える働きをします。
対象は MS ゴシックだけでなく…
当初は MS ゴシックのみを置き換える拡張機能の予定でしたが、翌々考えてみれば他にも読みづらいフォントは色々あります。
例えば、
- 游ゴシック
- メイリオ
等です。
メイリオについては意外に思うかもしれませんが、ディスプレイによってはかすれることがある少し厄介なフォントです。(MS ゴシックに比べれば1億倍マシですが)
あと、THE・Windows のフォントって感じが好みではない。
これらのフォントも、ちゃんと Noto Sans に置き換えます。
開発に当たっての苦悩
Noto Sans は綺麗で素晴らしいフォントなのですが、容量が大きいという欠点があります。
そこで、サブセット化を行いました。
サブセット化とは、フォントの中から必要な字のみを抽出することです。
これにより、大幅にフォントファイルのサイズを削減することができました。
また、フォントファイルの形式には、圧縮効率が高い WOFF を使用しました。
サブセット化及び WOFF への変換に使用したソフトウェアは以下のとおりです。
サブセット化で収録文字数を減らせばフォントファイルのサイズも小さくなりますが、収録文字数が少なすぎると一部の文字が Noto Sans に置換されないという事態が発生します。
そこのバランスが難しかったです。
最終的に収録した文字の一覧はこちらの記事にまとめてあるのでご覧ください。
さらに、フォントファイルを先読みしておくことで、フォント読み込みにおけるちらつきを軽減しました。
評判
Chrome ウェブストアで高評価を頂いたほか、その他の利用者の方々からも多数の喜びの声を頂いています。
この場をお借りして御礼申し上げます。
より多くのサイトの文字を見やすくする
この拡張機能で一部の Web サイトのフォントは綺麗になりますが、フォントを特に指定していないサイトではこの拡張機能は効力を発揮しません。
これらのサイトも美しい Noto Sans で見たいという方は、ブラウザの設定から変更できますのでぜひやってみてください。
この記事では具体的な設定方法は割愛します。
(そのうち記事書くかも)
(2022/5/30 追記)
記事書きました。
Chrome のフォントを美しい Noto Sans にする方法
設定自体はそこまで難しくはないです。
最後に
この拡張機能は自分の中でも出来にかなり自信があります。
もちろん自分も愛用しています。
「この拡張機能良いな」と思ったら、ぜひ使ってみてください！
Chrome→ https://chrome.google.com/webstore/detail/oecglhldbofcklanmhckefiflhfhabdd
Firefox→ https://addons.mozilla.org/ja/firefox/addon/replace-with-noto/
