ブログの配色とダークモードに挑戦した感想
テーマをUNDER SHIRTに変更
minimalismというテーマを使っていたが、デザインCSSを忘却したせいか管理不足なのか、とりあえずブログ誤動作や不具合が出始めた。
気分転換のつもりでランキング上位だったテーマを試しに変更してみたら、よさげだったので思ったので乗り換えを実行。
noteとか見てると2カラムの需要は少ないし時代遅れかもしれないけどがんばれば1カラムにも変更できるっぽいのでテーマをインストールした。
閲覧者のブラウザに合わせた配色
ブログが各OSのダークモード対応させたい。
白背景はずっと見てると目が疲れるのでダークモードを導入したかった。ググってはコピペしてCSSを弄るを繰り返した。
ダークモード導入で参考にしたブログ
ダークモードのCSSを貼り付けたら、ダークモード用のブログデザインを用意するということになります。
それは、ブログデザインを2つ用意するということ。
それは地獄。
ダークモード実装はスーパーハッカー達のおかげでコピペで済んだ。けれどダークモード用の配色が辛くて泣きそうだった。
ひたすらカラーコードコピペして、CSS弄って、デイモードの配色確認して、ダークモードでも配色確認してって、やってたら運営中のブログが何回も閲覧不可能なほど崩壊してました。
その作業が地獄すぎたので、初心に帰って、CSSコードを削って削って、配色もシンプルにシンプルにを心がけました、
今はデイモードナイトモードどちらでもようやく記事が読めるようになりました。
2021年ブログの主な配色コード
黒: #333333
中間色: #cccccc
白: #fff
差し色: #EF6776
配色とダークモードに挑戦した感想
ダークモードは趣味全開の配色に、デイモードは手を抜いたので読めない文字あるかも。
ディスプレイによって色味が異なるって話思い出すと、自分の配色は伝わるのだろうか、そもそも自分は何色を見てるのかって思い始めてしまい配色地獄の入り口に向かってしまうことがある。
CSSも配色もずっと続けていたら指が腱鞘炎みたいになったのでかなりの重労働なのだとわかった。
今はピンクの差し色とか使ってるけど、ブログが眠りを妨げないためにも低コントラストか超コントラストの配色にしていきたい。
デイモードもダークモードもPCでもスマホでも、OSでテーマを設定すればどちらも表示切り替え可能。
自分で記事を読んだ限りでは、ダークモード版のほうが文字の可読性は高く、読んでて疲れにくい配色にできたと思う。
CSSも配色もほんとうにムズかったんだけど、これからも挑戦していきたい。
