00:01
スマホやパソコンのダークモードを使ってますでしょうか? 私は使っていません。
AppleがiPhone、iPad、そしてMacにダークモードを採用してから、
Webサイトやいろんなアプリでダークモード対応というのが出てきて、
ちょっと一時的にブーム的な雰囲気もあったと思います。
Androidではダークテーマというらしいですね。 このダークモード、
簡単に言ってしまうと、従来は白字に黒で文字とかが表示されているものを、
黒字に白文字にすることです。 することというかしている状態です。
OS自体の設定で切り替えることで、ユーザーインターフェースの部分が黒ベースになるわけですね。
各アプリケーションも対応してないといけないんですが、
対応しているアプリケーションだったら、黒字に白の文字になるとか、
ダークモードの時にモードが変化する、色が変わるんですね。
ウェブサイトの場合も、サイト自体を作る時にダークモードに対応した作り方をしておく必要があります。
ウェブサイトの見た目を調整するのはCSSというのを使うんですが、
ダークモードに対応するにはダークモード用のCSSも記述しないといけないので、
通常の配色とダークモードでの配色の2パターン用意しないといけないので結構面倒ですね。
ちなみに今から言うことはわからない人は聞き飛ばしていただければいいんですが、
CSSのフレームワークのTailwind CSSというのを私は最近使っているんですが、
Tailwind CSSでは簡単にダークモード用の設定をできるようになっていて便利です。
HTML上のクラスの指定が長くなってしまうのがTailwind CSSのデメリットだと言われていますが、
ダークモードの記述をするとより長くなっちゃうんですけどね。
はい専門的な話はここまでです。
通常は白地に黒でダークモードは黒地に白と言いましたが、厳密には真っ白と真っ黒ではコントラストが強すぎるので、
その辺OS側もWebサイトの場合はサイトを作る側も調整しています。
03:05
Webページの場合ちょっと淡い色を白か白じゃないかわからないぐらいのグレーとかちょっと暖色系の色とかを下に敷くこともあるんですが、
そうすると白地に何か要素が入っている画像を配置した時にも背景と白との区別がついてしまうので、
背景は真っ白を使って文字を真っ黒ではなくてグレーな色にすることが一般的には多いですね。
今話したのはWebサイトの話でしたが、ユーザーインターフェースでは薄いグレーの上に濃いグレーが載ってるとか、
ダークモードの場合は逆に濃いグレーの上に薄いグレーが載ってるみたいにグレーの濃さを調整して読みやすく目に優しい感じに調整しているはずです。
Webサイトの話で言い忘れてましたが、OSの設定をダークモードにしたらWebページもダークモードで表示されると。
そういう作り方にすることができます。
このダークモードを良さとして消費電力を抑えるとか目に優しいと言われることもありますが、
そんなに大きな差はないと言われています。
消費電力に関してですが、光の3原色、RGB、レッド、グリーン、ブルーで色を作る場合、
どれも光ってない状態が黒で、RGB全部光ってる状態が白なので、
黒の方が消費電力が少ない。黒い面積の多いダークモードの方が消費電力が少ないという理屈にはなると思います。
ただこれ有機ELディスプレイの場合だそうで、昔の液晶の場合は常にバックライトが光っているのであんまり関係ないということでした。
有機ELの場合もそこまで大きな差にはならないそうで、今時のスマホとかパソコンは周りの明るさに合わせて輝度が自動調整されているので、
特に明るいところでダークモードにして使ったところで、そこまで消費電力の差はないということらしいです。
ちなみに昔のパソコン、昔と言っても本当に初期の頃のパソコンは黒字に白とか黒字に緑とか、字の色が黒でしたね。
06:14
私が最初に使ったパソコンがシャープのMZ80Bというパソコンなんですが、黒字に緑で文字やグラフィックが表示される一色のみだったんですね。
当時はブラウン感でしたが、光ってない状態が黒で、光った状態で色が付くわけですから、ベースが黒の方が消費電力的にも耐久性的な面からもそういう設計にしたいですよね。
テレビ、パソコン、スマホ、画面が消えている状態、電源が消えている状態は黒ですからね、色が。
レッドとグリーンとブルーを混ぜればグレーっぽい色になるだろうと思うんですが、それは絵の具とか印刷とかの色の話で、光の場合はレッド、グリーン、ブルー、全部光って白なんですね。
目に優しいに関しては、確かに周りが暗い環境の時にはダークモードの方が見やすいし、目に優しいと思います。
なので、Appleのダークモードの設定は、時間に合わせて夜になると自動でダークモードになるような設定があります。
ただ、基本室内でパソコンを使っている場合、夜だってライトを高校とつけていれば、周りの明るさは変わらないですよね。
アメリカ人は日本みたいに天井のライトを高校と夜照らさずに間接照明とか使って、夜の室内は結構暗いイメージがあるので、そういう環境の人、アメリカ人には自動で夜になったらダークモードというのはいいのかもしれません。
欧米ではそうなんですかね。 で、私はダークモード不要派だったんですが、ある時セミナーに行った時に、コロナ以前ですが、セミナー会場でダークモードの必要性を理解しました。
セミナーの時、プロジェクターを使うために部屋を暗くしたりしますよね。最近明るいままで大丈夫なプロジェクターも多いですが、その暗くした時にパソコンやタブレットの画面が白ベースだとすごく光って、使ってる本人眩しいだろうし、周りの人も気になると思うんですよね。
09:13
そこだけモワッと光ってるので。なのでエチケット的な意味も込めてダークモードにする、黒ベースの画面にするというのが必要なんだなと理解しました。そのセミナーの時にパソコンやiPadを広げてる人は黒ベースの画面にテキスト打ってメモしたりしてたんですね。
エンジニア系の人は結構黒い画面に白い文字でエディターを使っているイメージがあるので、それでなのかなと最初は思ってたんですが、会場が暗くなってそういうことかと。
自分もセミナー会場でパソコンやiPadを使うときは黒ベースのテーマが使えるダークモード的な見え方ができるアプリを使わないといけないなと気づかされました。今回は以上です。
