[2025-04-19 Latest]
(当ページは、「Noto Sans JPフォントで書かれたテキスト」を悪目立ちしないように表示させる事に一応成功したので、大幅に内容修正しました)
ユーザー「ブラウザーのフォントを勝手に変えられた」┆"デフォルトフォント"の罠┆
今月のWindowsUpdate後、Firefoxを除く各ブラウザーのデフォルトフォントが軒並みNoto Sans JPに置き換わってしまって、Windowsユーザーの間で大騒ぎになっています。
私は普段Firefoxメインなのでブラウジングには支障ないのですが、問題は運営中のWebサイト
私のサイトに来るのは当然Chromeからが多数でEdgeもそれなりにいて、「(ユーザーから見たら)"勝手にフォント改悪"」の被害に遭っている最中なので、とりあえず、「メイリオをベースフォントに指定」の応急処置に踏み切りました。
(本来は、運営中のサイトは原則「フォントファミリー sans-serifのみ指定」ですが、特殊文字を(メイリオ閲覧を前提に)テキスト・記号・画像装飾などに設定しているので、その修正が完了しないと、最悪レイアウト崩壊になるサイトもあるので)
今回は、大多数のChrome及びEdgeユーザーはメイリオに戻す見込みらしいですが、何時またWindowsUpdateでデフォルトフォントを変えられるか分かりません。
それを考えると、ユーザーの選択の自由を奪う事になってしまいますが、「メイリオをベースフォントに優先指定」を一部サイトで継続すべきか迷っています。
(他にも、設定変更完了なのにデフォルトフォントがメイリオに戻らない人(実は、私もそうです・・・拡張入れてやっと戻りました)、会社のPCなどでフォント変更許可されていない人なども相当数いるでしょうし)
(以後 いろいろ情報が錯綜して正確な判断ができないでいたのですが、やっとフォントの最終的評価と対策が一応できたので、当ページの大幅修正更新します)
Noto Sans JP の長所短所 こう書けば、Windowsユーザーも、このフォントを受け入れられるようになる かも？
で、その問題の「Noto Sans JP」ですが・・・
一言で言うと、サイトを見るユーザーの環境によっては「貴方がメガネコンタクトに合わせなさい」みたいな事になりかねないフォント
- 読みやすい
- 通常モード(ライトモード)だと、"400"は太過ぎ "300"は細過ぎて字が薄く見える で ちょうどいい太さがない
- ダークモードだと、(少なくともWindowsでは)「font-weight 300」一択
- 字の形は悪くはないけど、「font-weight 400」だと太過ぎて台無し
- Windowsや低解像度のディスプレイだと字が滲む(見え難いという事はないですが・・・)
- 通常モード(ライトモード)だと、どう頑張っても、スタイリッシュだったり繊細だったりするレイアウトには合わない
- 「font-weight 400以上」だと、ディスレクシア(字の読み書きが困難)を抱えている方には、長文だと見づらいかも？と推測
以上を勘案した結果、私が出した結論(当然、アクセシビリティも考慮に入れてます)：
2025年春の現在、CSSはこう書くべし(注：企業や行政のサイトだとまずいかもしれませんが)
↓
通常モード・ダークモード共通：
body{
font-family: sans-serif;
font-weight: 300;
}
通常モード：
body{
color: #1e1e1e;
}
(多少は前後して良いと思いますが、これより濃いと(矯正含む)視力が普通の人の目に負担がかかり、これより薄いと見え難い人が出てくると思われます。
なお、理想的と言われる 通常モード時の文字色#333333は、"Noto Sans JP；font-weight 300"で読むにはあまりに薄すぎて無理)
ダークモード：
color: (常識的な数値でOK)
これで、Windowsユーザーの大部分は今まで通り"メイリオ；font-weight 400" で表示、設定を元に戻さなかったか戻せなかったWindowsユーザーは "Noto Sans JP；font-weight 300" で表示されます。
(Macやスマホユーザーも(デバイスに入っている他フォントの)font-weight 300 で表示になる可能性大ですが、Macのフォントは元々Windowsユーザーから見ると「太過ぎ！」みたいですし、スマホユーザーは昨今は Noto Sans JP がデフォルトが多いという情報見たので大丈夫ではないかと思われます。
Linux？・・・昨今はNotoフォントも多いとか(受け売り))
この設定がスタンダードになれば、世のWebサイトは軒並み「読みやすさとレイアウトを両立可能」になるはずですが・・・
広く採用される日は多分来ないだろうな・・・
(因みに、Googleで検索したところ、AI Overviewが、
CSSのfont-weightで300がない場合、一般的にブラウザは400（Normal）に設定します。
と答えてくれたので、<body>に"font-weight 300"と指定しても、もしユーザーのデバイスに"300"のフォントがなかった場合でも"200以下の細さのフォント"が表示される心配はなさそうです)
なお、私は「メイリオ推し」という程ではなく、
Noto Sans JPを万人、特にWindowsユーザーに「見られるフォント」にするには、CSS設定に細心の注意を払う必要があり、そして何より、極めて多数のユーザーが、程度の差はあれ メイリオを推していると判明したため、あくまでも消去法で選択しています。
(本当は、自分のサイトにはWindowsユーザー向けに「Yu Gothic "font-weight 500"」がベターだけど、現実は・・・)
(今回の「ブラウザーのデフォルトフォントが勝手に変わってしまった」騒動で、
フォントにとって読みやすさと同等に最も大事なのは、太さ細さに過不足がなく、(ディスプレイの解像度やライトモードダークモードの別に関係なく)滲まず、見る人の目障り(「体の目」には優しくても「心の目」に優しくない)にならない事
だというのを改めて実感)
(ディスレクシア(字の読み書きが困難)を抱える方は、アプリなどで閲覧中サイトのフォントを変えている事があるそうですが、「CSSでメイリオ強制」にすると無効になってしまうかも？
など、他にもアクセシビリティに関わる重大な問題もあるので、
WindowsUpdateの際にブラウザーのデフォルトフォントまで弄るのは止めて下さい＞ Microsoftさん)