これまで、少し文字は大きめにしていましたが、スマホから見た時に、文章の行数が多くなっている気がしました。
そこで、「モバイルサイトフォント」のサイズを「18px」から「17px」に変更してみました。
1行あたりの文字数は、表示するスマホによって異なりますが、自分のスマホ(Pixel 5:1080×2340)で確認すると、18文字になりました。


このフォントサイズを選んだのは、「note 」や「ほぼ日刊イトイ新聞」などの読みものメインのサイトを参考にしました。


以前に、糸井重里さんが、「横の一行は27文字」というお話をされていて、そこから、一行あたりの文字数と読みやすさを考えるようになりました。


27文字は、パソコンなど横長ディスプレイの話なのか、スマホでは「18〜19文字」になっているんですね。
「文字の読みやすさ」と「文章の読みやすさ」を両立するバランスを模索中です。
こちらもどうぞ。


[CSS] ブログの印刷時のフォントをUDフォントにした
パソコンでの文書作成用に「BIZ UDフォント」をパソコンに入れたのですが、ブログの印刷時のフォントでも活用したいと思います。ただし、印刷時だけで、通常のパソコンやスマホの画面で表示するときには、デフォルトのフォントのままにします...


note風スタイル第4弾!目次のデザイン
「note風スタイル」ということで、ブログのスタイルシートを編集しています。今回は、目次について。主な変更点は……文字を細く・小さく・薄く背景色をグレーに項目の間に線を追加noteの目次の特徴は、「控え...


ブログをnote風のデザインにしてみた
今回はCocoonとCSSを使って、note風のシンプルなブログデザインに変更してみました。◆ note風デザインの記事一覧 ◆「note(ノート)」というブログサービスをご存知ですか?...
QRコードを読み込むと、関連記事を確認できます。