ダークモードの強制使用をやめてほしい
(iamvishnu.com)- ウェブサイトがダークモードしか提供しない場合、長文を読む一部のユーザーに目の疲れや不快感を与えることがあり、選択肢や快適な配色が必要
- 核心はダークモード自体ではなく、テキストと背景の明暗コントラスト比であり、純白のテキストと完全な黒背景は 21:1 のコントラストとなって負担が大きくなり得る
- 黒背景に
#888888のグレーテキストを使うとコントラスト比が5.9:1に下がり、過度なコントラストより読みやすいダークモードの例になる - WCAG 2.1 は通常のテキストに最低コントラスト比 4.5:1 だけを要求し、最大コントラストの制限は設けていないため、21:1 の組み合わせも規則上はアクセシブルと見なされ得る
- WCAG 3.0 草案の Maximum text contrast 要件は 2025 年 9 月 4 日の更新で削除され、強制ダークモードの記事には現時点で CSS を直接上書きするような暫定対応が必要
強制ダークモードが読みにくさを生む場合
- ダークモード専用に設計されたウェブサイトや個人ブログは多く、サイトによっては 1 段落読む前に目がつらくなることもある
- ダークモードは特定の状況では有用だが、ユーザーに選択肢がなく強制適用されると悪いユーザー体験になる
- 長いダークモードの記事を読んだ後は、目がすぐ順応できず、水平の縞模様が残って見えるように感じることがある
問題の中心は明暗コントラスト比
- ダークモードでの不快感を左右する中核要素は、テキストと背景の間の明暗コントラスト比である
- 純白のテキストを完全な黒背景の上に置くと、コントラスト比は21:1になる
- この組み合わせは目に負担をかけ、読みにくくする可能性がある
- 黒背景の上に
#888888のグレーテキストを使うと、コントラスト比は5.9:1に下がる- 同じダークモードでも、より楽に読める配色の例である
- コントラスト比は高ければ高いほど良いわけではなく、ダークモードでは過度なコントラストがかえって不快感を強めることがある
WCAG 基準が取りこぼしている部分
- 現在の WCAG 2.1 SC 1.4.3 は、通常のテキストに対して最低コントラスト比 4.5:1を要求している
- WCAG 2.1 には最大コントラスト比の制限がない
- 純白のテキストと完全な黒背景のように 21:1 のコントラストを持つ組み合わせも、規則上は完全にアクセシブルと見なされ得る
- 多くのユーザーに不快感を与え得ても、既存のガイドラインはダークモードの過度なコントラスト問題を扱っていない
- WCAG 3.0 には探索的要件として Maximum text contrast が追加される予定だった
- 2025 年 12 月の更新によると、この要件は2025 年 9 月 4 日の WCAG 3.0 草案更新で削除された
- コントラスト比の数式に関する GitHub Issue は依然として未解決のままである
現在可能な回避方法
- 重要な記事が強制ダークモードでしか提供されていない場合、ブラウザの開発者ツールで CSS を上書きして色を反転できる
- 別途プラグインを使いたくない場合、より良い解決策が出るまでは開発者ツールが暫定的な対処法として残る
ダークモードがうまく合う状況
- ダークモード自体を否定する立場ではなく、次のような状況ではダークモードを好む
- 明かりを消した部屋でOLED 画面で文章を読むとき。たとえば寝る前にスマートフォンで記事を読む場合
- コードを書くとき。ほぼすべての IDE が、デフォルトで快適なコントラスト比のダークモードを提供している
- ウェブサイトのダークモードが快適なコントラスト比を備えているとき
- 記事後の Hacker News の議論 では、賛同と批判の両方があり、初期 OEM のダーク/ライトモード選択、コントラスト比の重要性、個人的経験、医学的条件、アクセシビリティ問題、回避方法などが議論された
1件のコメント
Hacker Newsのコメント
ダークモードは、もともと伝統的なデフォルトに近いものだった
初期の緑色／アンバー色の文字と黒い単色ディスプレイ、黒背景に灰色文字のDOSテキストモード、C-64の濃い青背景に明るい青文字、Apple IIの黒背景上の灰色／白色がそうだった
GUIでもAmigaは標準のWorkbenchが濃い青の背景で、すべてのパレットをユーザーが選べた
ほとんどのアプリで紙に似ているという理由から、白い画面に黒い文字をデフォルトにしたのはMicrosoft Windowsで、紙は白くても発光する白ではないため、その移行は苦痛だった
ダークモードが戻ってきたのはうれしいが、強制ダークモードではなく選択肢が必要で、ライトモードもできれば最大輝度の白ではないほうがいい
デバイスやモニターを発光する白にしてはいけず、横に置いた紙に近く見えるように輝度を下げるべきだ
パラダイムを変えたのもWindowsではなく、広く普及した消費者向け機器としてはMacが先で、内蔵CRTも従来のオフィス照明では紙より暗かった
初期のコンピューターが暗い配色を使ったのは、解像度が低くピクセルの明るさがにじんで読みやすかったからで、技術が向上するにつれてその問題は消え、画面であれ印刷物であれ、明るい背景に暗い文字のほうが目に楽だ
アンバー色や緑色も白い文字より楽だと考えられていて、比較自体が難しいほど差が大きい
完全な黒ではなく、ある程度明るさのある背景ならダークモードはより多くの人にとって問題ないかもしれないが、そうするとOLEDの利点の大半を失うことになる
初期PCのDOS/Unixが当時のディスプレイ特性上、黒背景を使っていたのは事実だが、その前は白い紙で情報を共有していたし、インターネット初期は白背景に黒文字を再び持ち込んだ
結局、正統なデフォルトのようなものはなく、いつ参加したか次第だ
Amiga Workbenchが濃い青の背景だったのもコストのためだ。多くの人がコンポジット映像出力でテレビにつないで見ると想定されており、白い文字と青い背景はテレビがうまく表示できる組み合わせだった
1080モニターはA1000の価格の3分の1ほどで、多くのA500がクリスマスに開封されたあと、しばらくテレビにつながれていた可能性が高い
Amiga用ワープロはほぼ全部使ってみたが、WordPerfectを除けばすべて白背景に黒文字で、WordPerfectも変更はできたものの、DOSに合わせるために標準の青／白を維持していただけだ
暗い背景はちらつきを目立ちにくくし、1990年代により高いリフレッシュレートのCRTが一般化するとちらつき問題が減り、ライトモードがデフォルトになった
ちょっと待って、あるウェブサイトが明るい文字と暗い背景しか持っていないなら、それはそのサイトのテーマと雰囲気だ
ダークモードはライトモードがあるときにだけ存在し、その逆も同じだ
望まないウェブサイトに2つのモードを両方維持しろと強制することはできない
ダークモードがブランド特性なら、テキストに快適なコントラスト比を選べと書かれている
デフォルトで設定変更できないライトモードは長らく存在しており、それを補うためにDark Readerのようなプラグインもある
だが逆にライトモードを強制するインフラはあまりない
ほとんどの状況ではライトモードのほうがダークモードより良いと思う。ダークモードのほうが良い唯一の状況は、画面が唯一の光源である暗い部屋に座っているときだが、たいてい健康的な環境ではない
ダークモードは補助ツールに近く、明かりをつけるか寝たほうがいい
光のない環境ではライトモードが読みにくく感じることもあるが、明るい環境ではダークモードはほとんど読めない。真夏の明るい日にスマートフォンでダークモードUIを読んでみれば、輝度を最大にしてもよく見えない
実際、ブラウザーにはデフォルトの背景色と文字色を設定する機能があるので、ウェブサイトが本当に必要なとき以外はこのデフォルトを尊重するだけで、拡張機能は不要なはずだ
「自分の好みを実際に尊重させる」ための拡張機能が必要な世界は不幸だが、必要なら少なくとも両方のオプションをサポートしていることは知っておく価値がある。全体の状況はかなり馬鹿げているが、回避策はある
今ではOSがいずれも切り替え可能なモードを持っており、それをブラウザーに知らせることができる。ブラウザーはOSが報告した設定に合わせて適応できるし、そうすべきだ
UIデザインは、Paul Fittsのようないくつかの合理性の島を除けば、概して誤って適用された雰囲気と流行の連鎖だ
最初はコントラストが悪いと言ってコントラストを不足させ、次は明るさが悪いと言って明るさを不足させる。そして、コントラストと明るさがなぜ最初から重要だったのかを再び悟り、その循環が続く
車のハイビームを正面から見るような感じで、Dark Readerプラグインを使ってはいたが、サイトがきちんとダークモードをサポートしているのとは違った
真昼でもずっと見やすい。一部のAndroidアプリのように、Pure Blackモードがダーク／ライトモードとは別のオプションだったらいいのにと思う
今はDark Readerで明るさを最小にしてしのいでいるが、少し不格好だ
このブログ自体がデバイス設定に従わず、読者にライトモードを強制している
筆者は途中で立場を変え、問題はダークモードではなく色のコントラストだと結論づけている
color: #111;とbackground-color: #fdfdfd;を定義しており、これは18.56:1 のコントラスト比である皮肉なことに、最後には回避策として反転フィルターを使うと言っているが、ダークモードを好む人が筆者の強い白背景／黒文字のサイトに Vivaldi の
Invert Modeのようなものを使えば、筆者が不満を言っているまさにそのダークなコントラスト比になるユーザーに低いコントラスト比を強制しないでほしい
誰もが 100 ニト超に較正された画面と、明るいが妥当な周囲照明の下でコンテンツを見ているわけではない
推奨されているグレー同士の組み合わせは、たとえば完全な暗室で輝度 0 で見る場合や直射日光の下で見る場合には読みにくいことがある
SDR の色域全体は使うためにあるのであって、ユーザーの目をくらませないよう制限すべき HDR ではない
ライト対ダークだけの問題ではない。ウェブサイトには全般的に自分のシステム設定を尊重してほしい
私の OS テーマが黄色いレンガの背景に紫の Comic Sans テキストなら、ブラウザもそれを尊重すべきだ
テキストをブラウザ全体の幅で読みたいのに、中央の 5 インチ幅の狭い列でしか見られないなら、ブラウザ設定で魔法をかけたり、上書き CSS を呼び出したり、拡張機能を入れたりする必要があってはならない
ブラウザはただ「ウェブ開発者よ、仕方ない。ユーザーの好みが勝つ」と言うべきだ
ブラウザは、ユーザーが望むことを無視できるだけの支配権を開発者に渡しすぎており、「ユーザーエージェント」という言葉が色あせている。今では開発者エージェントに近い
私もそうして使っていて、ウェブ閲覧はずっと良くなった
ダークモードが素晴らしいところもあれば、まったくひどいところもある。白いテーマも同じだ
あまりにも多くのウェブ開発者が、誰もがダークモードを好むと仮定してデフォルトにし、Dark/Light Mode のトグルボタンがあるからと正当化している
新しく作られたウェブサイトでさえユーザー設定を検出せず固定していることが多く、驚かされる
開発者なら CSS の
color-schemeプロパティで、要素がどの配色で快適にレンダリングできるかを示せる:root { color-scheme: light dark; }element { light-dark(light-color-code, dark-color-code); }macOS ユーザーとしては、メニューバーや IDE のようにダークモードがよい場合もあるが、読む・書く・ブラウジングはライトがよいので好みが混在している
System Preferences でテーマを LIGHT に設定した後、
defaults write -g NSRequiresAquaSystemAppearance -bool Yesを実行し、ログアウト後に System Preferences でテーマを DARK に設定すればよいデフォルトテーマに戻すには
defaults write -g NSRequiresAquaSystemAppearance -bool Noを実行するおかしいのは、ブログの「読みやすいテキスト」の例が、私には低コントラストのせいで本当に読みにくい点だ
どんな目の状態やモニターを使っているのか気になる
我慢できないし、見た目も悪く、読みにくい。みんなやめてほしい
ユーザーがダークモードかどうかを判別する Web API があるので、それを使えばよい
@media (prefers-color-scheme: dark) { CSS Rules here... }ダークモードは間違いだった
初期の LCD は暗かったので、誰もがそれを補うために白を強く上げ、今では LCD が追いついた結果、かなり多くの人の目を焼くレベルになっている
そのため次第に 2 つのモードをサポートしなければならなくなっており、Apple のばかげるほど醜いダークモードアイコンは、これをうまくやるのがどれほど難しいかを示している
理想的には、明るい CRT が標準だった時代のように、コンピューターインターフェースの基本色を再びグレーに戻すことだと思う
そうすれば UI 要素に奥行きの手がかりを与えられるという利点もあり、これも復活させるべきだ
核心は、ユーザーが自分の好みを設定できるよう構成可能であるべきだということだ
個人的にはライトモードはまぶしく、目が痛くなり、疲れる。人によって違う
ライトモードはたいてい完全な白ではなく、ダークモードはグレー系だ