👏
text-shadow: 1px 1px 1px #fff;は文字のガビガビを消し去る

読みやすい
文字を見るためのソフトにおいて、ディスプレイ上に表示される文字に割かれるピクセル数が少ないことによる違和感のようなものにより、長時間文章を読むことが困難になる現象が多く発生する。
スマホのような小さな画面でかつFHD程度の画素数のデバイスで文章を読むと、
結構読みやすい。
この問題は、単に、ディスプレイ解像度やディプレイのサイズによっておこる問題なのだが、
FHD、24インチモニタだと、見にくいなと感じてしまうことがある。
文字サイズを大きくすると、目を大きく動かす必要があり、
これはこれで疲れてしまう。
なので、この文字の大きさと、ある程度の目の動きでどうにか文章を表示できないものかと悩んでいたわけです。
解決策として、text-shadow: 1px 1px 1px #fff;によって、文字の輪郭を滑らかにし、文字のガビガビ感を消し去るという手法を確立した。
眼鏡をつけ忘れたかのようなぼやけ方により、ディスプレイに表示される文字の違和感のようなものを軽減できるのではと理解している。
これによって、FHD 24インチモニタ、18pxあたりでもある程度の文章を読むことができている状態である。
この結論に至るまで結構悩んできたので、同じようにPCで長文を表示するようなソフトを作成していらっしゃる方がいらっしゃれば、参考にしていただければと思います。
Discussion